R enewal

1. 01 Renewal Concept

2. 02 목차 01. INTRODUCE 02. REQUIREMENT 요구사항 및 분석 요거프레소 소개 웹사이트 방문자 분석 타겟 설정 페르소나 03. ANALYSIS 04. BENCH MARKING 05. RENEWAL CONCEPT 검찰청 웹사이트 분석 검찰청 웹사이트 장단점 경쟁사_ 웹사이트 분석 경쟁사웹사이트 장단점 SWOT 분석 구체적 구현 방안 아이디어 스케치 와이어 프레임 사이트 맵 스토리 보드

3. 03 INPRODUCE 2005년 기업사업본부 설립 1호점 오픈 YOGERPRESSO소개 + + trendy tasty together 2013년 ‘제10회 웹 어워드 코리아’ 최우수상 수상 INDEX 01 2014년 2014 ‘우수프랜차이즈’ 수상 시그니처 메뉴’메리딸기100만잔 판매돌파 요거프레소는 시대의 변화(Trendy)에 따라 최상의 재료로 만든 맛있는 음료(tasty)를 가장 합리적인 가격에 제공하며 가맹점과 더불어(Together) 성장하는 ‘따뜻한 기업’ 입니다. 2018년 1300개의 지점 오픈

4. 04 REQUIREMENT 요구사항 및 분석 곧 이벤트가 많이 시작 될 예정이니 이벤트 창이 잘 보이게 해주세요 이벤트 배너의 위치를 사이트의 상단으로 올리고 크기조정으로 강조 시키겠습니다 INDEX 02 요고프레소만의 느낌을 강조 시켜주세요 요고프레소의시그니처메뉴인‘메리딸기’ 의 색상을 사용하여 포인트컬러로 사용하겠습니다 창업자가 많이 늘어나고 있습니다 창업을 위한 창이 잘 보여졌으면 좋겠습니다 창업관련 배너를 글씨와 함께 배너를 따로 만들고 이벤트배너와 어우러지게 배치 하겠습니다

5. 05 ANALYSIS 방문자 분석 INDEX 02 검색으로 방문하는 접속자가 57.24%로 가장 높은 수치를 기록함 출처 : https://www.similarweb.com

6. 06 ANALYSIS 방문자 분석 INDEX 02 SNS로 유입되는 방문자가 Twitter와 Facebook으로 확인되면서 젊은층의 방문자가 많은것을 알 수 있다 출처 : https://www.similarweb.com

7. 07 ANALYSIS 방문자 분석 INDEX 02 어플리케이션과 앱이용자가있으며 다시 한번 젊은층의 방문자가 많은것을 알 수 있다 출처 : https://www.similarweb.com

8. 08 ANALYSIS 타겟 설정 MAINTARGET SUBTARGET INDEX 03 가맹점 위치와 이벤트를 알아보기 위해 방문한 20대 여성 요거프레소창업을 희망 하는 30대 남성

9. 09 ANALYSIS 페르소나 MAINTARGET SUBTARGET INDEX 03 이름 : 안지영 나이 : 25세 방문목적 : 요거프레소의신메뉴를 알아 보기 위해 방문 이름 : 윤두준 나이 : 31세 방문목적 : 요거프레소 창업을 희망 하여 정보를 얻기 위해 방문

10. 10 BENCH MARKING 홈페이지 분석 Color MAIN: #ffffff INDEX 04 POINT: #c40e24 Font NotoKR-Medium "Noto Sans",돋움 SIZE :12 – 18px

11. 11 BENCH MARKING 홈페이지 장점 INDEX 04 젊은 방문자들을 위해 트렌드에 맞게 디자인 되어있다

12. 12 BENCH MARKING 홈페이지 장점 INDEX 04 배너들이 정리정돈이 잘 되어 있어 깔끔하다

13. 13 BENCH MARKING 홈페이지 장점 INDEX 04 탑메뉴의 폰트 크기가 크고 보기 좋으며, 메인메뉴리스트와색상을 다르게 주어 다른 메뉴인것을 알기 쉽게 배치 하였다

14. 14 BENCH MARKING 홈페이지 단점 메인페이지에서 사진의 비중이 크고 글씨가 없어서 스크롤을 끝까지 안내려 보게 된다 INDEX 04 사진의 크기를 조절하고 글씨와 조합하여 배너들의 가독성을높힌다

15. 15 BENCH MARKING 홈페이지 장점 INDEX 04 상품페이지에서 상품을 호버하거나클릭시구분이 안되어 있어서 무엇이 선택되는지 헷갈린다 메인메뉴바에서 마우스 호버했을시, 폰트의 변화를 준다

16. 16 BENCH MARKING 홈페이지 단점 창업배너나 이벤트 등 중요 배너들의 위치가 맨 아래에 있어 찾기 힘들다 INDEX 04 창업배너와 이벤트등의 배너의 위치를 조절하여 찾기 편하게 배치한다

17. 17 BENCH MARKING C27 홈페이지 분석 Color MAIN: #ffffff INDEX 04 POINT: #222222 SIGNATURE: #444444 Font basic "Nanu-Gothic",돋움 SIZE :13 – 24px

18. 18 BENCH MARKING C27 홈페이지 장점 INDEX 04 전체적인 디자인이 깔끔하고 보기 편한하다

19. 19 BENCH MARKING C27 홈페이지 장점 INDEX 04 상품들의 구분이 잘 되어 있어 선택하기 편하다

20. 20 BENCH MARKING C27 홈페이지 장점 INDEX 04 로그인창과 회원가입 창이 새페이지로 열리게 해서 페이지 이동 횟수를 줄였다

21. 21 BENCH MARKING C27 홈페이지 단점 색상이 하얀색과 검은색 회색계열의 색상으로 이루어져 고급스럽지만 카페의 이미지와는 거리가 멀다 INDEX 04 브랜드의 시그니처 메뉴의 치즈케이크의 색상인 노랑계열을 사용하여 시그니처 컬러를 추가한다

22. 22 BENCH MARKING C27 홈페이지 단점 INDEX 04 sns의 오류로 로딩으로 넘어가고 페이지가 뜨지않는다. 주소수정이나 css를 다시 재조정한다

23. 23 BENCH MARKING C27 홈페이지 단점 INDEX 04 폰트가 너무 작아서 가독성이 떨어지면서 너무 단조롭고 심심한 느낌을 준다 폰트의 크기를 늘리고, 폰트의 종류를 좀더 트랜드 하게 변경한다

24. 24 BENCH MARKING SWOT 분석 Strength SNS홍보와 어플케이션, 앱 등 접하기 쉽게 편리하게 이용 할 수 있게 운영 하고 있다 Opportunity 요거프레소의 시그니처 메뉴인 ‘메리딸기’가 강한 이미지를 주어 인지도가 높다 INDEX 05 가맹점을 많이 보유하고 있지 않아 찾기 여러 지역에서 보기 쉽지 않다 최근 요거프레소의 가맹점주가 직원의 성차별적인 갑질로 인해 논란이 일어 났다 S O T W Weakness Threat

25. 25 Renewal concept 구체적인 구현방안 Color MAIN: #ffffff INDEX 05 POINT: #c40e24 SIGNATURE: #ef92a9 Font Nanum-Square "Noto Sans",돋움 SIZE :12 – 18px

26. 26 Renewal concept 구체적인 구현방안 요거프레소의시그니처메뉴인‘메리딸기’와 어울리는 색상을 추가하며 글꼴을 Nanum-Square로변경하여 상쾌한 이미지로 변화를 준다 배너의 크기와 위치를 변경하고 가독성을 위해 이벤트 배너와 창업배너를 이미지배너들 사이에 배치시킨다 INDEX 05 SNS홍보 배너를 탑메뉴에서 내리고 어플리케이션과 앱의 아이콘도 만들어 같이 배치시킨다 커피와 디저트등 미리 볼 수 있는 상품페이지에서 마우스 호버시 변화가 없는 것을 구분하기 위해 호버시 선이 생기는것, 크기변화를 추가한다

27. 27 Renewal concept 아이디어 스케치 INDEX 05

28. 28 Renewal concept 와이어 프레임 INDEX 05

29. 29 Renewal concept 사이트맵 INDEX 05

30. 30 Renewal concept 스토리 보드 INDEX 05