Page 279 고등학교 컴퓨터 그래픽 교과서
P. 279
• 스토리보드 제작 및 일정 수립
Story Board
No/001 파일명/index.html 화면 성격/HTML
화면명/메인 화면 위치/초기 화면 비고/무
로그인 회원 가입 쇼핑백 My shop
로고와 메뉴는
MENU 1 MENU 2 MENU 3 MENU 4 MENU 5 상단에 배치
브랜드 이미지 삽입 유동적인 부분으로
(로고/스포츠를 활용하여 홍보 효과 제고) 계절별 화면 이미지
가 바뀐다. 또한 특별
한 행사나 알림이 있
의류 이벤트를 좀 더 부 으면 이 위치에 삽입
한글로 수정
신발류 이벤트 상품 광고 배너 각시킬 수 있는 디 하여 홍보 효과를 극
가방/액세서리 자인으로 수정 대화한다.
운동용품
클릭!!
유벤투스 유니폼 (게시판) (게시판) Vento Pure Power
한정 판매
ATP
디자인 수정 하단에 있는 정보들을
FAQ FAQ 메뉴 추가 서브 메뉴 정보를 올 메인 DTP 눈에 잘 띄는 곳에 재배
페이지에서 다이렉트로
문의 사항 치하여 웹 페이지 방문
들어갈 수 있게 재배치하
JUVETUS 자들에게 흥미를 불러일
여 정보를 부각시킨다.
으킨다.
대리점 | 이용 약관 | 개인정보 보호정책 | 고객 문의 | global|sitemap Footer 부분
[그림 Ⅳ-32] 웹 기획 스토리보드
(2) 제작 단계
제작 단계에서는 기획 단계에서 제시한 스토리보드와 제작 일정에 맞추어 콘텐츠를
이용하여 웹 페이지로 제작하고 웹상에 출판하고 테스트한다.
① 디자인
콘셉트와 목표 설정, 메타포 정의 및 콘텐츠를 구조화한다. 메타포(metaphor)
문학에서 많이 사용하는 단어로서
• 시안 제작: 실제 제작에 들어가기 전에 시안을 만들어 콘텐츠의 계층적 구조, 내 은유 또는 비유를 의미한다. 실생활
에서 사용하는 것을 그대로 웹 페이
비게이션, 아이덴티티, 레이아웃을 결정하는 의사소통 도구로 사용한다.
지에 비유적으로 적용했다는 의미
• 페이지 디자인: 최종 결정된 시안에 따라 전체 페이지를 디자인한다. 에서 웹 디자인에서도 메타포라는
말을 사용한다.
② 구현
• 파일 구조화: 콘텐츠 관리와 상대 경로 링크를 위해 디렉터리와 파일 이름을 관
리한다. 디렉터리 구조는 콘텐츠 구조를 반영하여 확장하기 쉽도록 제작한다. 일
관된 파일 및 객체 이름을 설정한다.
• 페이지 템플릿: 각 페이지마다 공통으로 적용되는 저작권 관련 내용, 버전 정보,
웹 마스터의 이메일 주소, 타이틀 등을 제작한다.
3. 웹 디자인 277
