파피루스 사이트 웹기획서.

Presentation on theme: "파피루스 사이트 웹기획서."— Presentation transcript:

1 파피루스 사이트 웹기획서

2 목 차 1. 개요 2. 사이트분석 - 현재 Sitemap 3. 전략수립 4. 리뉴얼 5. 구성요소 - 목적 - 배경
목 차 1. 개요 - 목적 - 배경 2. 사이트분석 - 현재 Sitemap - 저해요소분석 - 벤치마킹 3. 전략수립 - 리모델링 디자인 - 프로모션 4. 리뉴얼 - 추진조직구성 추진일정 - 사이트 구조도 웹사이트 세부내용 - 메인화면 서브화면 5. 구성요소

3 유용한 Communication Homepage
1. 개요 1. 배경 고객 유용한 Communication Homepage 향후 파피루스 안경점 의 고객유치의 대응 파피루스 홈페이지 구축 등록 2. 목표 목 표 1. 파피루스 홈페이지 구축 – 안경점의 홈피 적용 으로 널리 고객 인지도 향상 2. 효과적인 마케팅 전략 수립 – 안경점의 홍보 및 비즈니스 창출 3. 핵심 컨텐츠 강화 – 고객 친화적인 홈피 제작 및 서비스 구현 4. 효율적인 UI구현 – 잘 정리된 메뉴를 통해 최적화된 User Interface 구현으로 고객만족 실현 5. CRM 강화 – 체계적이고 지속적인 User 의 성향 분석을 통한 맞춤 정보, 안경서비스제공

4 2. 사이트 분석 1. 현재 Sitemap About us Brand Information Community 파피루스 이야기
main 파피루스 ( 일산.com) 매장 둘러보기 About us Brand Information Community 파피루스 이야기 Papyrus 안경 공지사항 파피인 소개 Markus-T 선글라스 Q&A 찾아오시는 길 VOLTE-FACE 렌즈 SAMA 악세 서리 HOPEMAN

5 2. 사이트 분석 2. 저해요소 분석 디자인 네비게이션 기타 3. 문제 해결 요소 기타 디자인 네비게이션
현재 메인 화면 파피루스 로고가 부각되지 않음 제품위주의 메뉴구성 갤러리란에 제품이 업데이트 되지 않고 정체되어 있는 상태 전체적인 홈피 색상이 다소 어둡고 둔탁함 메뉴란 파피루스를 알리는 부분에서 텍스트나 이미지가 애매함. 고객지원에 대한 서비스 부족 홈피 하단에 부면 주소나 저작권 배너가 정적임 Brand란의 메뉴가 부각되지 않음 3. 문제 해결 요소 기타 디자인 네비게이션 메인 화면 파피루스 로고 컬러 색상 변화 메인 홈피 색상과 로고의 플래시 적용 하단 배너의 이미지 수록 와 주소의 변화 제품위주보단 안경점을 알리 수 있는 메뉴구성 파피인 메뉴 란 의 텍스트와 매장인 소개를 확고하게 표현 BRAND 메뉴 란 의 메뉴 플래시로 부각 갤러리란 제품 업데이트 활성화 고객지원에 대한 서비스 강화

6 3. 전략수립 1. 리모델링 1. 파피루스 홈페이지 구축 – 안경점의 홈피적용으로 널리 고객 인지도 향상
1. 파피루스 홈페이지 구축 – 안경점의 홈피적용으로 널리 고객 인지도 향상 2. 효과적인 마케팅 전략 수립 – 안경점의 홍보 및 비즈니스 창출 3. 핵심 컨텐츠 강화 – 고객 친화적인 홈피 제작 및 서비스 구현 4. 효율적인 UI구현 – 잘 정리된 메뉴를 통해 최적화된 User Interface 구현으로 고객만족 실현 5. CRM 강화 – 체계적이고 지속적인 User 의 성향 분석을 통한 맞춤정보, 안경서비스제공 2. 디자인 1. 통일적인 플래시 적용 2. 안경점 이미지를 부각시킬 수 있는 그래픽 요소 사용 3. User Interface 통일감 과 일관성을 통하여 편안하고 쉬운 네비게이션 제공 4. 모든 페이지에 플래시화 기본으로 제공 적절한 Depth를 유지하여 사용자 편의성 확보 5. 사이트와 사용자간의 Communication 효율성을 강조한 Design

7 3. 전략수립 3. 밴치마킹 서면 the-# 센트럴 스타 폴라리스 안경원 Pm - frost 갤러리 안경

8 4. 리뉴얼 Project Team Project 총괄 Project Manager 1. 추진 조직 구성 기획 디자인 개발
(원성보,조성용) 디자인 (이수정,최지혜 원성보,조성용) 개발 (조성용) 운영관리 (원성보,조성용) - 기획 - 스케쥴 관리 - 업무분할 - Page 디자인 - Flash 제작 - 기타 화면 디자인 - 테스트 - Coding - 설계/업무분석 사이트 운영 - 시스템 운영 - 컨텐츠 관리

9 메인 및 서브 페이지 시안(서브는 color 정의)
4. 리뉴얼 2. 추진 일정 정식오픈 예정 : 7월 5일 ~05.08 ~05.15 ~05.22 ~06.08 ~06.18 ~06.20 사이트맵 확정 스토리보드 작성 메인 및 서브 페이지 시안(서브는 color 정의) 페이지 상세 디자인 Site 개발 테스트 및 완료

10 4. 리뉴얼 3. 사이트 구조도 ABOUT US BRAND INFORMATION COMMUNITY PAPYRUS 안경 공지사항
MAIN ABOUT US BRAND INFORMATION COMMUNITY PAPYRUS 안경 공지사항 파피루스 이야기 MARKUS-T 선글라스 Q&A 파피인 소개 VOLTE-FACE 렌즈 찾아오시는 길 SAMA 악세 서리 공통메뉴 HOME 매장 둘러보기 Site주소 저작권

11 4. 리뉴얼 초기화면 About us brand information community Top utility Menu
4. 웹 사이트 세부내용 초기화면 파피루스의 안경점 내부구조 제시 및 웹사이트 고객 편의의 UI구성 About us 파피루스 매장의 소개와 고객으로 하여금 파피루스 소개 및 매장 원 들을 볼 수 있게 구성 brand 매장의 제품들을 UI 플래시로 구성, 제품 소개및 브랜드 소개 information 안경 / 선글라스 / 악세서리 / 렌즈 및 매장 제품 소개 community 공지사항 및 Q&A 메뉴구성 고객 의견제시 창 마련 Top utility Menu 사이트 이용자들이 상시 매장 안을 360도 관람 할 수 있는 회전 뷰 구성

12 FLASH MOTION IMAGE / TYPE TRANSACTION
4. 리뉴얼 1. 메인 화면 브랜드 사이즈: 71 * 36 로고사이즈: 56 *40 파피루스 파피루스 로고 90 1003 About us brand information community 523 30 30 30 942 640 150 150 FLASH MOTION IMAGE / TYPE TRANSACTION 385 324 278 파피루스 TEXT TYPE TRANSACTION 81 파피루스 매장 주소 푸 터 92

13 4. 리뉴얼 1. 메인 화면 스토리보드 (메인 디자인 시안)

14 이름 url www.파피루스 일산.com Title Note Link
파피루스 메인 (prpyrus main) 사이즈 1003 * 597 폰트 9 pt url 일산.com Title 파피루스 메인 Note 파피루스 매장을 한눈에 보이는 메인 화면 부분 플래시 효과를 주어 마치 블라인드가 펼쳐지는 느낌을 줌 메뉴 바 역시 플래시 로 버튼을 클릭 시 부드럽게 메뉴가 나옴 다른 안경사이트와는 다른 색감과 간결한 디자인의 조화 깔끔하면서 고객들에게 안경 점이라는 이미지를 한눈에 파악 할 수 있슴. Link 매장 둘러보기 메뉴란 3D뷰 활성화 매장전체를 둘러 볼 수 있게 메인 화면에 등록

15 FLASH MOTION IMAGE / TYPE TRANSACTION
4. 리뉴얼 3.파피루스 로고 클릭시 3d 가상현실 구현 1. 메인 화면 세부 구성 1.파피루스 메인화면 전개 3 파피루스 파피루스 로고 매장둘러보기 1 About us brand information community 7 8 9 10 메뉴란 플래시 적용해 각 페이지로 링크됨 2.플래시 웹페이지 메인 이미지 부각 파피루스 안경점 전개 2 FLASH MOTION IMAGE / TYPE TRANSACTION 6.파피루스 메인 문구 플래시적용 6 파피루스 TEXT TYPE TRANSACTION 5.파피루스 푸터 4.파피루스 매장주소 5 4 파피루스 매장 주소 파피루스 푸터

16 FLASH MOTION IMAGE / TYPE TRANSACTION
4. 리뉴얼 2. 서브 화면 브랜드 사이즈: 71 * 36 로고사이즈: 56 *40 파피루스 362 파피루스 로고 90 파피루스 이야기 파피인 소개 찾아오시는 길 24 About us brand information community 523 30 30 942 640 FLASH MOTION IMAGE / TYPE TRANSACTION 385 324 파피루스 매장 주소 푸터 92

17 FLASH MOTION IMAGE / TYPE TRANSACTION
4. 리뉴얼 1. 서브 화면 세부 구성 파피루스 파피루스 로고 About us brand information community 1 2 3 4 파피루스 이야기 파피인 소개 찾아오시는 길 유명브랜드 제품 소개 안경 선글라스 렌즈 악세서리 공지사항 Q&A FLASH MOTION IMAGE / TYPE TRANSACTION 파피루스 매장 주소 파피루스 푸터

18 4. 리뉴얼 2. 서브 화면

19 이름 url www.파피루스 일산.com Title Note Link
파피루스 서브1 (About us) 사이즈 1003 * 597 폰트 9 pt url 일산.com Title 파피루스 서브1 Note 서브 부분으로서 파피루스의 안경 점에 관한 사이트 소개 및 유래 파피루스 매장 소개란 및 찾아오시는 길 첨부 각 메뉴란 에는 플래시 효과를 주어 파피루스에 관한 이야기 / 찾아오시는 길 을 한층 더 부드럽게 표현해 강조 Link

20 이름 url www.파피루스 일산.com Title Note Link
파피루스 서브2 (brand) 사이즈 1003 * 597 폰트 9 pt url 일산.com Title 파피루스 서브2 Note 브랜드란 에는 각종 파피루스의 유명한 고급 안경의 소개 및 상품소개 이 역시 플래시 부분으로써 버튼으로 나열해 클릭 한번으로 매장의 안경 품목 및 제품 브랜드의 소개가 이루어짐 다양한 플래시효과를 주어 웹사이트 방문한 고객들에겐 더욱 화려한 볼거리를 제공 Link 파피루스 각 브랜드별 제품 소개 제품에 대한 상세 설명 및 제품의 유래

21 이름 url www.파피루스 일산.com Title Note Link
파피루스 서브3 (information) 사이즈 1003 * 597 폰트 9 pt url 일산.com Title 파피루스 서브3 Note 인포메이션 란 에는 안경 / 선글라스 / 렌즈/ 악세 서리 를 갤러리 형식으로 나열 안경에 관한 진열된 제품을 진열 선글라스에 관한 제품을 진열 렌즈에 관한 제품을 진한 악세 서리에 관한 제품을 진열 올 플래시로 메뉴 바를 선택하면 즉시 그 제품을 열람하고 보여지게 만들 수 있슴 Link 안경 / 선글라스 / 렌즈 / 악세 서리 메뉴란 안 에 갤러리를 링크

22 이름 url www.파피루스 일산.com Title Note Link
파피루스 서브4 (공지사항) 사이즈 1003 * 597 폰트 9 pt url 일산.com Title 파피루스 서브4 Note 공지사항 Q&A 게시판 과 각종 공지사항 및 질문답변을 추가 고객들 의 질문 및 답변을 제시할 수 있고 공유 할 수 있슴 로그인 과 회원가입의 절차를 걸쳐 고객유치의 발달을 추가사항으로 적용 Link

23 5. 구성요소 1. Title / logo Title / logo 2. Title / 마크 Title / 마크
파피루스 로고 폰트 24pt 글자체 2. Title / 마크 Title / 마크 파피루스 마크 파피루스의 안경을 알리는 형태 심볼

24 5. 구성요소 1. Main footer Main footer Main 1,2 의 경우 모든 Page에 동일하게 적용
Color를 사용하되 명도와 채도는 모든 사이트에 유사하게 적용한다. 글자체: 굴림체 폰트:12pt

25 5. 구성요소 1. Color 규정 Main Color : Main 1,2 Color의 경우 모든 Page에 동일하게 적용
주 사용 Area Main Color : Main 1,2 Color의 경우 모든 Page에 동일하게 적용 Main 3 Color는 Site의 성격에 맞게 차별화된 Color를 사용하되 명도와 채도는 모든 사이트에 유사하게 적용한다. Sub Color : Main Color에 맞게 배색하여 사용하되 Sub Color는 한가지 배색만 가능하며 한 Page내에 3가지 이상의 Color를 사용하는 것은 지양한다. Point Color : Main/Sub Color에 맞게 배색하여 사용하되 한화면의 Point Color는 2가지 색 이하로 사용한다. 채도와 명도가 높은 색으로 화면의 생동감을 줄 수 있도록 표현할 때 사용한다. Main Color 1 Menu Bar 상단 Color Main Color 2 Main Menu Area BG Color Main Color 3 Sub Menu Area BG Color Sub Color 1 Main 화면 내 Title 및 Table Header 등 주요 Area Color Sub Color 2 Table 내 Sub Header BG Color 등 Sub Color 3 Table 내 Data Field BG Color 등 Sub Color 4 Sub Color 4 Contents 일반에 쓰이는 BG Color 메인화면 및 본문화면 기타 BG Color 로 사용 Title text color Title 등의 Point Color Point Color 1 화면 내 강조되는 text 등의 Point Color 공통 Color 변형 가능색

26 5. 구성요소 1. Font 2. Text Font Site 명은 로고 적용
( Resolution : 72pixel/inch 기준 ) Font size : 9 Point Tracking : 0 2. Text Font 해당되는 모든 Text는 이미지처리하지 않음을 기본으로 하나 디자인 적용에 문제가 있는 경우에는 (예:버튼 등) 이미지 문자를 사용할 수 있다. 이미지 사용 시 12 Point Resolution : 72pixel/inch 기준

27 URL : http://파피루스 일산.com
감사 합니다.