안녕하세요, 바이오메카트로닉스학과/전자전기공학부 김지환입니다.
저희는 eBook App의 유용성과 사용성 위주로 개선해보았습니다.
밀리의 서재, Yes24 eBook, 교보문고 Sam 모두 넷플릭스같은 구독형 서비스인데요, 플랜별 가격이 있긴 하지만 Yes24의 저가 플랜이 가장 저렴하여 (월 5500원) 이 서비스를 선택하게 되었습니다.
가입 후 첫 한 달은 무료이니 한 번 사용해보셔도 좋겠습니다! 제 팀원인 이병운 님 덕분에 프로젝트 하면서 알게 된 앱인데 전공 관련한 책도 많아 정말 유용해요.
저희의 앱 개선을 위한 메인 테마는 집중 학습입니다. Yes24 eBook 서비스는 eBook 카테고리에서는 아직 선두를 잡지 못한 상태이기에, 유저에게 좋은 UX를 제공하고, 나아가 business level에서 성공하기 위한 저희가 생각한 전략입니다.
개선한 부분은 다음과 같습니다
- 내 서재 메뉴 간단화
- 필기 UI 통합 및 그래픽 개선
- 책 검색 시 검색어 자동완성 제공 및 화면 개선
- ePub File은 드래그해서 페이지 넘기기
- 한 줄평 대신 게시판(커뮤니티) 기능 생성
- IoT 기술을 이용한 집중모드 제공
- 영상처리 기술을 이용한 핸즈프리모드 제공
인터랙션 디자인, 프로토타입 디자인 모두 Adobe XD 로 실행하였습니다.
내 서재 메뉴 간단화
사용자들이 이용하면서 정신없는 UI배치를 비판했는데, 저희는 책을 읽을 때 뿐 아니라, 책을 읽기 전에 선택하는 부분부터 고쳐야 한다고 생각했습니다. 내서재 메뉴에서 읽고 있는 책, 책장, 모든 책 세 가지로 나누는 것이 불필요하다고 판단되어 하나로 합치고, 저장된 eBook 을 삭제하는 방법도 터치 후 슬라이드를 이용해 할 수 있게끔 하였습니다.
Before
After
서재에서 책을 터치해 들어가면 다음과 같은 화면이 뜹니다.
페이지 이동 일관화
책을 기기로 내려받을 때 ePub 또는 PDF 두 가지로 받을 수 있는데, ePub의 경우 부드러운 페이지 이동이 불가했고 양쪽 화면을 짧게 터치해 페이지 이동을 합니다.
eBook 리더기의 경우 버튼을 눌러 페이지 전환을 하는 방법을 고수하지만, 아이패드를 이용하는 사용자는 아이패드가 eBook리더기처럼 작동하는 것에 익숙치 않을 것이라 생각해 드래그하여 부드럽게 페이지가 움직이는 UI를 일관적으로 제공하는 것이 좋을것이라 생각했습니다.
필기 UI 통합
기존에는 형광펜 기능과 펜 기능이 나뉘어져 있었고, 형광펜의 경우 1초 이상 텍스트를 손가락으로 누르고 있어야 했습니다. 또한 손으로도 펜을 사용하게끔 되어 있는데, 의도치 않게 책에 낙서가 되어 상당히 불편했습니다. 필기가 원할 때 제대로 되지 않는것도 집중력을 상당히 저하시킨다는 것을 Goodnote 앱을 쓰며 깨달았기 때문에 이 부분을 개선하고자 합니다.
저희는 이를 하나로 통합하고 펜과 하이라이트는 애플펜슬로만 가능하게끔 했습니다.
또한, 하이라이트는 텍스트 위에 올라갈 시, 덮어지는 텍스트는 자동으로 하이라이트된 목록에 들어가, 사용자가 칠했던 부분으로 쉽게 돌아갈 수 있습니다.
Before
After
화면 상단에서 펜 툴을 설정하면 필기 박스가 화면 위에 띄워져 툴을 바로 선택할 수 있게 합니다. 드래그해서 내려 더 많은 설정에 빨리 접근할 수도 있습니다.
책 검색 시 검색어 자동완성 제공 및 화면 잘림 개선
원래는 타이핑할 때 제공되지 않던 자동완성을 다음과 같이 제공합니다. 또한, 기존의 서재 화면에서는 측면 부분이 잘리는 문제가 있었는데, 이 또한 Full Screen 으로 변경해 더 많은 정보를 담을 수 있고 미적으로 만족스럽도록 하였습니다.
Before
After
게시판(커뮤니티) 기능 생성
기능 수정 전에는 한줄 평만 남길 수 있었습니다. 저희는 사람들이 책마다 서로의 인사이트를 공유할 수 있는 커뮤니티를 만들어 사람들이 공익에 도움이 되는 지식을 공유하거나, 남의 글을 읽고 공감할 수 있도록 하는 공간을 기획했습니다.
Before
부의 추월차선에 대한 한줄평입니다. 안타깝게도 요즘은 서행차선만 타도 상위 10프로입니다.
After
각 책마다 책에 할당된 게시판을 만들었고, 게시판 안에는 세 가지 내부 메뉴가 존재합니다.
IoT 기술을 이용한 집중모드 생성
아이패드를 이용하면 SNS, Game 등에서 알림 폭격을 받게 됩니다. App을 실행하는 기기 뿐만 아니라, 네트워크를 통해 모든 기기의 알림을 꺼버릴 수 있는 기술을 생각해보았습니다. 또한, 사용자의 취향에 따라 구글 계정에 연결되어 있는 인공지능 스피커의 소리를 차단시키거나, 클래식 음악이 나오게끔 할 수 있습니다.
영상처리를 이용한 모션인식 및 핸즈프리 모드
책을 찾는 사람들의 이유는 다양합니다. 저같이 회로도를 책보면서 만들어보거나 코드를 짠다던가, 요리책을 참고하는 주부도 있습니다. 무엇을 들고 있거나, 손에 뭐가 묻으면 화면을 터치하기가 힘든데요, 그래서 영상처리를 이용한 핸즈프리모드를 기획하게 되었습니다.
사람의 턱 특징을 추출해서 턱이 움직이는 방향과 속도가 특정 범주 안에 들어가면 책 페이지를 넘깁니다. 정확히는, 턱이 오른쪽으로 갔다가 재빨리 정면으로 돌아오면 페이지 이동이 일어납니다.
앞페이지 방향, 뒷 페이지 방향 모두 있으며, 물론 기능을 쓰고싶지 않을 때에는 끌 수 있습니다. 아래는 페이지 이동을 위한 모션에 대한 그림입니다.
마지막으로
교수님께서 시간 없으니 하지 말라고 하셨는데 이병운님이 Adobe XD에서 제공하는 인터랙션 툴을 이용해 시뮬레이션을 해보았습니다. 글로만 읽는것 보다는 이해에 도움이 될 것이라 생각합니다.
'Others' 카테고리의 다른 글
| AUTOSAR BSW & ASW (0) | 2022.03.15 |
|---|