Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

[Rightbrain UX Academy] Megabox UX/UI개선

3,471 views

Published on

라이트브레인 2020 UX 아카데미 10기 Open Project입니다.
이번에 소개해 드릴 결과물은 'Megabox - UX/UI 개선 프로젝트'입니다.

올해 초에 진행된 UX 아카데미 10기 교육 기간 동안 정규과정의 수업뿐만 아니라 별도의 조별 모임을 통해 과제와 프로젝트를 진행하며 만들어 낸 신선한 아이디어를 Rightbrain lab을 통해 공개합니다.

라이트브레인 아카데미 수강생들이 어떤 과정을 통해 아이디에이션하고 또 인사이트와 컨셉을 도출했는지 궁금하시다면 지금 바로 슬라이드쉐어로 내용을 확인하세요.



UX 아카데미 ‘라이트브레인 U –

미래의 UXer들을 위한 교육으로 UX전문가로서 성장할 수 있는 발판이 되는 교육입니다. UX에 대한 기초지식이 있는 학생과 직장인들을 대상으로 하며 정규 과정은 보통 15회 강의로 구성됩니다. UX 개념, 필드 리서치, 모델링, 서비스 디자인, 프로토타이핑과 같은 구성으로 UX디자인의 주요 프로세스를 모두 경험하고 최종 결과물을 발표하는 것을 목표로 합니다. 2019년 상반기 배출된 8기부터 아카데미 정글과 함께 UX Academy를 개설하여 보다 전문적이며, 밀도 있는 교육을 UX에 관심있는 분들에게 제공하고 있습니다.

Published in: Design
  • Be the first to comment

  • Be the first to like this

[Rightbrain UX Academy] Megabox UX/UI개선

  1. 1. Megabox 어플리케이션 UXUI 개선 강성은 김혜진 방민아 유희연 라이트브레인 UX아카데미 10기 / 2020.04
  2. 2. 유희연 yuui0505@gmail.com 방민아 bangma1206@gmail.com 김혜진 kimdini87@gmail.com 강은성 eunsung933@gmail.com
  3. 3. Contents ∙ 목표수립 ∙ 필드리서치 ∙ UX모델링 ∙ 프로토타이핑
  4. 4. 목표수립 • 대상선정 • 필드리서치 목적 & 이슈 도출 • 질문지 작성 • Key finding
  5. 5. 필드리서치 • 대상선정 • 필드리서치 목적 & 이슈 도출 • 질문지 작성 • Key finding
  6. 6. 목표수립 • 감독/배우의 정보가 텍스트로만 제공됨 (유용성, 감성 pleasure) • 한줄평 정렬 기능이 숨겨져 있고, 그 기준이 너무 많고 명확하지 않 아 헷갈림 (사용성 usable, 신뢰성) 문제발견 영화 앱 이용자의 앱 사용시의 문제점 파악을 위해 크게 다음 4가지 기준을 가지고 경험요소 분석을 진행 (1/2) • 큐레이션 카테고리가 어떤 기준으로 제공되는지 확인 할 수 없어 크게 의미 있는 정보로 다가오지 않음 (신뢰성) • 무비 포스트의 경우 한줄평과 다른 특별한 요소가 느껴지지 않음 (유용성) 메인화면 컨텐츠 탐색 영화 상세 화면 [ 컨텐츠 탐색 Flow ] 유용성 신뢰성 사용성 감성
  7. 7. 목표수립 [ 예매하기 Flow ] • 선택한 영화관에서 상영 중인 영 화 수가 많을 경우, 상영 영화&시 간 정보 리스트가 길어져 빠른 탐 색이 어려움 (사용성 usable) • 영화관 다중선택이 가능 여부와 영화관 변경 가능 여부를 인지하 기 어려움 (신뢰성 Recognition) • 상영시간 선택 시, 선택항목 UI에 변화가 없어 내가 어떤 시간대를 선택했는지 알기 어려움 (사용성 usable) • 스크린과 좌석사이의 뷰를 가늠 하기 어려움 (사용성 convenient) • 좌석선택 중에도 인원 재선택이 가능하다는 것을 인지하기 어려 움 (신뢰성 Recognition) • 할인 수단 리스트가 텍스트로 나 열되어 있어 아쉬움 (유용성) • 즉시할인카드에 대한 종류를 결 제 단계에서 바로 확인이 어려움 (사용성 (시용성 efficient) 문제발견 • 영화 예매 시 무조건 <영화별 예 매> <극장별 예매> 중 하나를 선 택하여 진행해야 하며, 순차적으 로만 선택이 가능하여 영화별/영 화관별/시간대별 등 비교 선택이 어려움 (사용성 usable) 예매 방법 선택 상영관/시간대 선택 인원/좌석 선택 결제 영화 앱 이용자의 앱 사용시의 문제점 파악을 위해 크게 다음 4가지 기준을 가지고 경험요소 분석을 진행 (1/2)
  8. 8. 영화관 이용 경험 영화 APP 이용 경험 메가박스 이용 경험 목표수립 문제발견 사용자 경험을 수집하는 동시에 인터뷰 대상자 섭외를 위한 스크리닝 설문을 진행함 선호하는 영화관 브랜드는? 그 이유는 무엇인가요? '영화관'에서 영화를 보는 목적은 무엇인가요? 영화관람을 위한 앱(cgv, 메가박스, 롯데시네 마)은 언제(시간대, 장소 포함) 주로 사용하시 나요? 영화관 앱에서 주로 사용하는 기능은 무엇인가 요? 영화관 APP은 얼마나 자주 이용하시나요? 메가박스에 대해서 딱 떠오르는 이미지는 무엇 인가요? (씨지비, 롯데와 비교) 영화예매 서비스를 이용하신다면, 가장 선호하 는 서비스와 그 이유를 알려주세요 메가박스 앱의 이용 경험 전반적인 만족도는 어떤가요?
  9. 9. “ 반면 메가박스는 규모가 작고 접근성이 떨어지지만 상업 영화 외 다양성 제공 측면에서 긍정적인 이미지를 가지고 있음” “ 타사 브랜드 영화관 선호 이유 중 가장 큰 이유는 높은 접근 성과 포인트 적립/할인 ” 문제발견 사용자 경험을 수집하는 동시에 인터뷰 대상자 섭외를 위한 스크리닝 설문을 진행함 목표수립
  10. 10. “ 모바일에서 주로 접속하며 앱 접속시간과 장소에 일정한 패턴은 없지만 사용자들 중 많은 이가 영화 관람 전날 또는 당일(관람 몇 시간 전)에 접근한다고 응답 ” “ 때문에 영화 예매와 예매내역 확인 필요 시에 불규칙하게 접속하며 빈번히 접근하지 않음” 목표수립 문제발견 사용자 경험을 수집하는 동시에 인터뷰 대상자 섭외를 위한 스크리닝 설문을 진행함
  11. 11. “영화 티켓 예매 ” 라는 목적달성을 편리하게 도와주는 내 손안의 메가박스 ✓ 빠른 예매가 가능하도록 어플리케이션 내 화면 영역을 효율적으로 구성한다. ✓ 영화 정보 탐색 과정에서 사용자 멘탈모델에 상응하는 자연스러운 정보의 배치와 위계를 제공한다. ✓ 적절한 시점에 사용자에게 필요한 정보를 제공해 편익을 제공한다. ✓ 정보를 빠르게 선택/확인/수정이 용이하게 만들어 유용성과 신뢰성을 줄 수 있는 UI를 제공한다. 목표수립 문제발견 사용성 분석과 설문조사를 토대로 이번 메가박스 앱 사용성 강화를 위하여 다음의 목표를 선정함 ① 물리적인 접근성을 보완 ② 사용자들은 영화앱 이용시 불규칙한 앱 사용패턴을 가지고 있기 때문에 앱은 더 직관적이어야함
  12. 12. 결과 분석필드리서치 리서치 대상 범위 설정 - Y 세대 - 20~30대 남녀 리서치 대상 세분화 - 메가박스 &타 브랜드 이용자 - 동반인 여부 사용자 파악리서치 대상 선정 설문조사 - 브랜드에 대한 태도 - 앱 이용 목적 - 앱 이용 빈도 - 앱 이용 컨텍스트 목표 & 이슈 도출 - 사용성 평가를 통해 도출된 이 슈를 기반으로 질문지 작성 필드리서치 수행 - IDI - 5WHYS - 관찰조사 - cognitive map 어피니티 다이어그램 - Keyfinding 발굴 및 핵심가치 선정 대상자 섭외 - 8명의 사용자와 인터뷰 진행 필드리서치 필드리서치 개요 영화앱 이용자의 앱 이용행태 및 Painpoint를 파악하기 위해 대상자를 선정하여 1:1인터뷰를 준비함
  13. 13. 리서치 대상 Y세대 (2~30대) 남녀 선정 이유 영화관 산업의 충성고객이며 디지털 기기를 자유자재로 사용하는 디지털 원주민 세대를 특징짓는 제품이 태블릿과 스마트폰 커뮤니케이션 시 온라인 및 모바일(메시지)을 주로 이용 필드리서치 필드리서치 대상선정
  14. 14. 조사 방법 필드리서치 목적 5 Whys 영화 앱 접근 동기 및 컨텍스트 파악 관찰조사 예매 과정에서 발생하는 어려움 확인 (Think Aloud) Cognitive map 영화 앱 이용 컨텍스트 및 서비스 이용흐름에 대한 멘탈모델 파악 Card sorting 영화 앱에서 제공하는 영화 상세정보의 우선순위 확인 IDI 관찰조사, 카드소팅 결과를 기반으로 앱 사용 각 단계에서의 사용자들의 생각, 태도, 우려의 원인 파악 필드리서치 필드리서치 목적 & 이슈 도출 이슈에 대한 해답을 얻기에 적합한 조사방법을 설정함
  15. 15. 인터뷰 질문조사 포인트 앱 접속 동기 영화를 보기로 결심한 순간부터 앱에 접근하기 전의 사용자의 맥락, 필요로 하 는 정보, 앱 접근 목적 홈 화면에서 컨텐츠 접근성 앱 진입 직후 사용자가 사용하고자 하는 기능 또는 메뉴. 원하는 메뉴까지 접근 이 빠르고 직관적으로 가능하지 않다면 그 이유는 무엇인가. 1. 최근 관람한 영화는 무엇인가요? 2. 언제, 누구와 함께 보셨나요? 3. 어느 영화관에서 보셨나요? 해당 영화관을 선택하신 이유가 있나요? 4. 영화관은 주로 같은 장소를 많이 방문하시는 편인가요? 5. 영화관까지는 어떻게 이동하셨나요? 6. 영화관에서 영화를 보고자 (동기가 생겼을 때)할 때, 가장 먼저 무엇을 하시나요? 7. 영화 앱은 언제 열어보시나요? Think Aloud (각 사용자의 앱 사용상황에서) 앱을 열어서 원하는 정보에 접근하는 방법을 보여주 세요. 1. 원하는 메뉴를 쉽고 빠르게 찾을 수 있었나요? 2. 컨텐츠를 탐색함에 있어 불편함은 없었나요? 필드리서치 인터뷰 질문지 작성 목적에 따라 인터뷰 질문지를 작성하고 인터뷰 방법을 구체화함
  16. 16. 큐레이션 카테고리 내 제공 정보의 적절성 일반 대중영화 다른 성격의 큐레이션 영화 (예술,독립영화)에 관심을 가질만한 정보는 어떤 것일지? 메인화면 제공 컨텐츠의 적절성 메인화면에서 원하는 컨텐츠를 제공하고 있는가. 그렇지 않다면 사용자들이 첫 화면에서 무엇을 탐색하고 싶어하는가. 동영상 컨텐츠 재생에 대한 반감이 있는지, 반감이 있다면 그 이유는? Cognitive map 영화 앱 사용시 원하는 영화를 예매하기 위한 순서 및 단계를 간단하게 적어주세요. Think Aloud 앱을 켜서 메인 화면을 탐색해 보세요. 1 .메인 화면에서 원하는 컨텐츠를 제공해주나요? 2. 메인 화면에 제공되는 동영상 컨텐츠를 살펴보셨나요? 3. 동영상 재생 시 불편함은 없으셨나요? 인터뷰 질문조사 포인트 1. 큐레이션 메뉴에 있는 컨텐츠가 예상하신 것과 비슷한가요? 2. 예술/독립영화를 예매한다면 어떤 정보를 알고 싶나요? 3. 해당 메뉴의 연상되는 네이밍을 새로 카드에 적어주세요. 필드리서치 인터뷰 질문지 작성 목적에 따라 인터뷰 질문지를 작성하고 인터뷰 방법을 구체화함
  17. 17. 평점/한줄평의 유용성 • 평점/한줄평에 대한 신뢰도 및 관심도 • 현재의 평점과 한줄평이 사용자가 영화에 대한 정보를 얻는데 도움이 되고 있는 가? 또 이해하기 쉬운 분류기준으로 제공되고 있는가? 영화 상세정보 내 우선순위 영화 상세정보 탐색 단계에서, 사용자가 주요하게 보는 영화 상세 정보들 간의 우선 순위 Card sorting 영화 상세 정보들이 적혀 있는 카드입니다. 영화 예매 전 가장 주요하게 보는 우선순 위대로 카드를 정렬해주세요. 유사한 카드들끼리 묶고 그 이유를 말씀해주세요. 1. 영화 상세 정보들 중 주의 깊게 본 항목이 있나요? 그 이유는 무엇인가요? 인터뷰 질문조사 포인트 1. 한줄평에서 주로 확인하는 내용은 무엇인가요. 그 이유는 무엇인가요? 2. 영화예매 전 앱 내에서 평점(별점)/한줄평/리뷰를 확인하지 않는다면 그 이유는 무엇인가요? 필드리서치 인터뷰 질문지 작성 목적에 따라 인터뷰 질문지를 작성하고 인터뷰 방법을 구체화함
  18. 18. 무비포스트 인지와 활용도 무비포스트는 사용자들의 영화 선택에 얼마나 많은 영향을 미치고 있는가 1. 해당 기능이 예매 시 영화 선택 여부에 도움을 주나요? ㄴ 어떤 기능이라고 생각되시나요? 기대하신 기능과 동일한가요? 어떤 기능이 된다면 도움이 될 것 같은가요? 2. 관람 영화에 대한 감상/ 여운 등을 어떻게 저장 및 공유하시나요? 인터뷰 질문조사 포인트 인원/ 좌석 선택 예매 시 인원 좌석 선택 단계에서 사용자가 겪는 어려움은 없는가 Think Aloud 인원/ 좌석 선택 단계 탐색 해보세요. 1. 영화관 좌석이나 환경이 내 생각과 달랐던 경험이 있다면 그 이유는 무엇인가요? 2. 좌석 선택 시 본인이 주요하게 고려하는 정보는 무엇인가요? 부가 정보 제공시점의 적절성 마케팅 정보, 연령제한 안내, 주차안내 등 부가정보 제공시점이 적절한가 Cognitive map + Card sorting 해당하는 안내정보가 제공되는 시점을 Cognitive map에 표시해주세요. 필드리서치 인터뷰 질문지 작성 목적에 따라 인터뷰 질문지를 작성하고 인터뷰 방법을 구체화함
  19. 19. 리서치 기간 2019년 2월 (약 2주 동안) 리서치 인원 8명 진행시간 약 1시간 내외 필드리서치 1:1인터뷰 진행
  20. 20. 영화 앱 접근 동기 예매의 신속성을 기대 • 대부분 보고 싶은 영화를 머리속에 생각하고 앱을 켜는 편이다. • 영화 앱은 영화를 빨리 예매하는 단발성 목적이 크다. • 영화 선택에 있어 다른 사람의 의견을 고려하는 성향의 사람의 경우, 박스오피스 순위와 입소문 (SNS등을 통한)을 주요하게 본다. • 홈화면과 상세페이지에서 [바로 예매] 버튼에 대한 접근성을 중요시 여긴다. • 영화를 접할 수 있는 플랫폼이 다양하기 때문에 일부 사용 자는 영화 앱 내에서 영화 상세정보를 탐색할 필요성을 못 느낄 수 있다. 필드리서치 Key finding 앞서 질문을 던졌던 표면적 / 본질적 이슈에 대한 사용자들의 경험, 원인, 이유를 발견함 (1/5)
  21. 21. 예매 과정에서 발생하는 어려움 • 메인 화면의 정보 그루핑이 모호하고 배경과 텍스트의 명도차가 커 텍스트가 잘 인지되지 않는다. • #000 카테고리 메뉴를 인지하지 못하는 사용자가 일부 존재한다. 큐레이션 카테고리의 문제점 • 큐레이션을 개인화 영역이라고 생각해 네이밍이 적절하다고 생각하지 않 는다
 사용자들은 추천, 매니아,전문가,명작과 같은 단어들을 떠올렸다. • 큐레이션이 탭인지 인지하지 못해 주제별로 영화가 나뉘어 있다는 걸 알 지 못했다 • 큐레이션 영화 선택 기준은 박스오피스 영화 선택시와 다른 양상을 보인 다 필드리서치 Key finding 앞서 질문을 던졌던 표면적 / 본질적 이슈에 대한 사용자들의 경험, 원인, 이유를 발견함 (2/5)
  22. 22. • 영화선택 후 극장선택에 대한 멘탈모델을 가지고 있으며, '영화' 보다는 '장소’ 변경에 대한 가능성과 여지가 크다. • 홈화면에서 영화를 바로 선택할 수 있기 때문에 영화별 예매 /극장별 예매 기 능 구분을 특별히 인지하고 앱을 사용하지는 않는다. • 특정장소를 중심으로 영화예매를 하는 경우가 있어, 장소를 먼저 선택할 수 있 게 옵션을 주는 것에 대해 긍정적이다. • 예고편은 ⓐ스포일러 우려, ⓑ앱 외부 (TV, 유투브, 옥외광고) 등에서 자연적으 로 시청하게 되므로, 굳이 앱 내에서까지 찾아보지는 않는다. • 예고편 등의 영상은 능동적 재생되지 않고 선택하면으로 볼 수 있게 해야 한다. • 영화 선택 시, 기본적으로는 본인이 좋아하는 장르와 영화가 담고 있는 주제를 중요시한다. 서비스 이용흐름에 대한 멘탈모델 영화 상세정보의 우선순위 필드리서치 Key finding 앞서 질문을 던졌던 표면적 / 본질적 이슈에 대한 사용자들의 경험, 원인, 이유를 발견함 (3/5)
  23. 23. 한줄평 인원 선택/좌석 선택 • 영화 선택에 있어 다른 사람의 의견을 고려하는 성향의 사람의 경우, 평점과 관람평을 주요하게 본다. • 남은 좌석 대비 전체 좌석을 분수로 한눈에 확인하고 싶어한다 • 영화관의 크기/좌석간의 간격/ 실제 시청 뷰가 가늠이 안되는 경우 (특히 작은 영화관일 경우) 영화관 좌석이 예상과 달라 만 족도가 떨어진 경험이 있다. • 그러나 스포 위험성, 댓글 알바 의심 등으로 100% 신뢰하지 는 않는다. • 한줄평의 세세한 내용에 집중하기 보다는 평의 갯수나 전반적 인 평가를 중시한다 • 인원 변경시 인원변경 버튼을 인지하지 못해 재진입 하였다. 하 지만 인원수정을 자주하지는 않는다. 필드리서치 Key finding 앞서 질문을 던졌던 표면적 / 본질적 이슈에 대한 사용자들의 경험, 원인, 이유를 발견함 (4/5)
  24. 24. • 현재의 무비포스트는 컨텐츠의 내용적인 면에서 기대한 것과 다르다. (기 대한 이미지는 블로그, 브런치) • 사람들은 영화를 공유할 때 장면과 대사를 매칭시켜 떠올리고 그렇지 않 은 단순 포스터 노출은 의미가 없다고 생각한다. • '무비포스트'와 '한줄평의 차이가 느껴지지 않는다. (스틸컷 모음 같지 않 고 한줄평과는 차별성이 있어야 한다) • 영화에 대한 감상이나 후기를 공유하는 플랫폼이 나눠져 있으며, 각 플랫 폼에 기대하는 컨텐츠의 전문성과 깊이가 다르다 • 유투브: 전문적, 전문 리뷰어 (세밀한, 배우는, 새로운 정보) • 네이버 : 명대사와 배우 중심 (공감 및 공유의 시발점, 가벼운 유머) • 무비포스트: 후기 (가벼운, 누구나 쓰는) • 사용자들은 영화 예매 앱에서 후기를 남기거나 능동적으로 공유하지 않 는 경향이 있다. 영화의 감상 공유방식에 대한 태도 무비포스트의 낮은 활용도 필드리서치 Key finding 앞서 질문을 던졌던 표면적 / 본질적 이슈에 대한 사용자들의 경험, 원인, 이유를 발견함 (5/5)
  25. 25. UX 모델링 • 인사이트 도출 • Idaetion
  26. 26. UX모델링 인사이트 도출 Key finding을 기반으로 사용자의 경험을 분석하여 기회요소 발굴 및 인사이트를 도출함 • 이미 외부 플랫폼에서(SNS, 유투브) 영화에 대한 정보를 충분히 접하고 앱에 접근하는 사용 자가 많기 때문에 홈화면에서는 빠르게 예매를 할 수 있는 UI구성을 (재배치,메뉴 구조 변경) 를 제공해야 한다. • 홈화면에서 각 요소별 우선순위 및 특성에 맞는 UI구성과 배치를 제공해야 한다. (카테고리 메뉴, 섬네일, 예매율, 기대평 등) • 예술 영화는 (박스오피스 영화와는 달리) 컨텐츠 추천 이유나 줄거리,내용, 분위기 등 에 대한 관 심도가 높기 때문에 상업영화와는 다른 정보와 UI구성을 제공해야 한다.(동영상 재생방식도 포 함) • 박스오피스 영화의 예고편은 외부 플랫폼에서 접하는 경우가 많아, 영화 앱 내에서는 원하는 사 람만 선택적으로 볼 수 있게 해야한다. • 사용자들이 주의깊게 보는 항목(다양한 이미지, 영화의 장면, 배우 등)를 돋보일 수 있도록 상세 페이지를 구성해야한다. • 영화 선택부터 극장선택까지의 자연스런 플로우를 제공해야 한다. • 영화 예매단계(날짜,장소선택,시간 선택을) 뎁스를 줄여 한 화면에서 비교할 수 있도록 제공한다 • 박스오피스,독립영화 등 카테고리 구분이 명확한 UI 제공하며 독립/예술 영화는 박스오 피스와는 다른 정보기준(ex.감독, 줄거리, 전문가평, 수상내역, 주제 키워드 등)을제공 해 영화선택에 도움을 준다. • 홈화면에서 (플로팅 영역) 근처 영화관을 빠르게 설정할 수 있게 한다. • 영화 상세정보와 한줄평에 대한 정보를 중요하게 보는 사용자가 나뉘기 때문에 상단 에 영화정보,한줄평 두개의 탭으로 원하는 정보를 바로 확인 할 수 있게 한다 insight ideation
  27. 27. UX모델링 인사이트 도출 Key finding을 기반으로 사용자의 경험을 분석하여 기회요소 발굴 및 인사이트를 도출함 • 무비포스트가 사용자의 기대에 못미치는 컨텐츠를 제공한다면 기능을 축소시키거나 다른 방식으 로 제공해야한다. • 한줄평 내에서 관람포인트에 대한 주요 키워드들을 추출하여 보여준다 • 전체 좌석 대비 남은 좌석을 한눈에 파악한 후 극장을 선택할 수 있도록 정보를 구성해야한다. • 스포일러를 담은 한줄평을 선별해 선택적으로 볼수 있게한다 • 많은 영화상영 시간대 중에서 원하는 시간대를 빠르게 찾을 수 있게한다. (2D/자막/4dx 등의 구 분, 시간대별 나열 • 총좌석 대비 잔여좌석 수를 바로 확인가능할 수 있도록한다. • 영화 예매 전 다른 사람들의 의견을 참고하고자 하는 사용자와 그렇지 않은 사용자가 존재하기 때 문에, 스포의 위험성이 있는 한줄평/무비포스트는 능동적으로 노출되지 않도록 해야한다. • 필요한 컨텐츠를 선별하여 보여준다 insight ideation
  28. 28. 프로토타이핑 • 전략&컨셉 • Idaetion Prototype
  29. 29. “영화 티켓 예매 ” 라는 목적달성을 편리하게 도와주는 내 손안의 메가박스 ✓ 빠른 예매가 가능하도록 어플리케이션 내 화면 영역을 효율적으로 구성한다. ✓ 영화 정보 탐색 과정에서 사용자 멘탈모델에 상응하는 자연스러운 정보의 배치와 위계를 제공한다. ✓ 적절한 시점에 사용자에게 필요한 정보를 제공해 편익을 제공한다. ✓ 정보를 빠르게 선택/확인/수정이 용이하게 만들어 유용성과 신뢰성을 줄 수 있는 UI를 제공한다. 목표수립 문제발견 사용성 분석과 설문조사를 토대로 이번 메가박스 앱 사용성 강화를 위하여 다음의 목표를 선정함 ① 물리적인 접근성을 보완 ② 사용자들은 영화앱 이용시 불규칙한 앱 사용패턴을 가지고 있기 때문에 앱 UI는 더 직관적이어야함
  30. 30. 「영화 티켓 예매」 라는 목적달성을 편리하게 도와주는 내 손안의 메가박스 한큐에! 가끔 들어와도 직관적으로 사용할 수 있는 프로토타이핑 전략 & 컨셉 전략, 컨셉, 가치 그리고 각 컨셉에 대한 가치와 상세 아이디어 정의 사용자 친화적인! 사용자의 맥락에 따른 유동적인 UI 예상 가능한 위치에! 정보의 배치와 위 계가 예상 가능한 서비스
  31. 31. 「영화 티켓 예매」 라는 목적달성을 편리하게 도와주는 내 손안의 메가박스 예상 가능한 위치에! 정보의 배치와 위 계가 예상 가능한 서비스 한큐에! 사용자 친화적인! 가끔 들어와도 직관적으로 사용할 수 있는 사용자의 맥락에 따른 유동적인 UI 가끔 들어와도 영화 예매를 가장 쉽 고 빠르게 할 수 있다. 맥락에 따라 나타나고 변화해 사용자가 고민할 필요가 없다. 영화 예매 시 적절한 시점에 도움 을 주어 사용자의 우려를 없앤다. • 영화 예매단계 (날짜,장소선택,시간 선택을) 뎁스를 줄 여 홈화면에서 바로 예매 • 가까운 영화관 하단 플로팅 배너 • 좌석 선택 시 VR 기능 제공 • 잔여좌석과 미니맵 기능 제공 • 예술영화에는 평론가 점수 / 수상 내역 기 재 • 한줄평 스포 방지 • 영화/영화관/날짜 중 원하는 순서대로 선 택 가능 (본인이 선택한 값에 따라 그 나머 지 기능은 자동으로 가능한 선택지만 노 출) • 선호 영화관 / 시간 (오전 오후) 토글로 on- off 기능으로 영화시간 비교 용이 가치 & 아이디어 프로토타이핑 • 예매의 프로세스에서 무리한 팝업은 지양 전략, 컨셉, 가치 그리고 각 컨셉에 대한 가치와 상세 아이디어 정의
  32. 32. 시나리오 1 컨셉 & 시나리오
  33. 33. 영화 탐색부터 예매까지 화면이동없이 한화면에서 가능 사용자는 이미 보고싶은 영화를 선택하여 예매만을 위해 메가박스앱에 진입. 빠른예매를 원하는 사용자 니즈를 반영하여 한 화면에서 영화 탐색부터 예매까지 자연스럽게 이어지도록 구성. 영화 포스터 카드뷰 선택 영화제목, 예매율, 평점, 상영시간 👆 영화관 선택 예매 날짜 선택 예매 시간 선택 홈화면 자체가 예약진행 화면이 되는 UI 한번에 직관적으로 예매할 수 있는 서비스 Concept / Idea / Prototype 프로토타이핑 • 모든 선호 영화관 선택된 상태가 default • 보고싶은 영화관만 on/off 활성화 가능 • 오늘날짜 default • 오전/오후 선택 후 해당 영화관의 상영타입별 시간대 노출
  34. 34. 선호극장과 나만의 영화관 선호극장 설정으로 나만의 영화관 등록하여 예매시 선호극장내에서 빠르게 예매까지 위치기반으로 나와 가까운 영화관을 추천 나와 가까운 극장 Concept / Idea / Prototype 프로토타이핑 원하는 영화를 찾아 예매하고자하는 사용자 영화, 장소, 날짜/시간 모두 정한 후 앱을 이용하여 예매
  35. 35. 원하는 영화를 찾아 예매하고자하는 사용자 영화, 장소, 날짜/시간 모두 정한 후 앱을 이용하여 예매 Concept / Idea / Prototype 프로토타이핑 예매과정이 진행됨에 따라 선택에 집중할 수 있도록 포커싱된 영역은 단계별로 축소되어 보여져 현재 선택에 집중할 수 있도록 표현 자연스러운 예매흐름 scroll
  36. 36. Concept / Idea / Prototype 프로토타이핑 👆 예매단계 진행 중 시간 선택 후 하단 레이어 팝업으로 빠르게 시간대별 원하는 좌석까지 확인 가능 자연스러운 예매흐름 좌석 미니맵으로 예매가능 좌석 확인 스와이프로 상영타입별 시간 확인 인원선택 후 하단 버튼명은 좌석선택으로 변경되어 다음행동 유도 원하는 영화를 찾아 예매하고자하는 사용자 영화, 장소, 날짜/시간 모두 정한 후 앱을 이용하여 예매 좌석선택 후 결제하기
  37. 37. Concept / Idea / Prototype 프로토타이핑 고객에게 맞는 가장 저렴한 금액의 할인쿠폰 및 혜택을 추천하여 적용 결제버튼영역에 할인적용 금액과 결제할 금액을 함께 노출 사용자가 앞으로 해야할 행동에 집중할 수 있도록 도와줌 결제 후 예매정보 확인까지 ! 할인쿠폰 및 혜택 추천 원하는 영화를 찾아 예매하고자하는 사용자 영화, 장소, 날짜/시간 모두 정한 후 앱을 이용하여 예매 결제 후 예매정보 확인까지!!
  38. 38. 시나리오 2 컨셉 & 시나리오
  39. 39. Concept / Idea / Prototype 프로토타이핑 정보및 리뷰등을 탐색 후 예매여부를 택하고자함 영화정보를 홈화면, 상세화면 등 둘러보고 예매 영화 포스터 카드뷰 내 상세보기 버튼으로 상세화면 진입 영화정보/ 한줄평 탭을 통해 정보 확인 전체보기 버튼으로 스틸컷 및 동영상 한번에 보기 감성적인 UI
  40. 40. Concept / Idea / Prototype 프로토타이핑 한줄평을 남긴 사용자의 성별과 선택한 관람포인트의 통계를 요약하여 제공 한줄평에서 많이 언급된 키워드를 추출하여 노출 실제 영화의 분위기를 직접적으로 느 낄 수 있도록 함 한스포일러가 포함된 한줄평은 사용자의 동의를 얻고 이후 노출하도록 함 정보및 리뷰등을 탐색 후 예매여부를 택하고자함 영화정보를 홈화면, 상세화면 등 둘러보고 예매 화면보러가기

×