designDIVE eyeCan 안구마우스 UXUI eye.U팀
영상자료를 보고싶으시면 아래 링크로 접속해주세요
http://youtu.be/32KLEwhH2eA
기간 : 2012.07.28 ~ 2012.09.01
주최 : 한국장애인개발원, kidp한국디자인진흥원
주관 : LOVO DESIGN, 한벗재단, DOMC디자인나눔센터
후원 : 삼성전자, designBNR, theDNA, ferrum
designDIVE란?
다학제의 전문가들이 서비스디자인을 통해 수요자가 중심이 된 새로운 서비스 프로세스와 고객 접점을 디자인함으로써 사회를 변화시키는 서비스디자인 워크숍
* 자세한 설명보기 : http://cafe.naver.com/usable/1087
* eyecan이란? eyecanproject.wordpress.com
designDIVE eyeCan 안구마우스는 designDIVE의 4번째 프로젝트로서 근육병을 앓거나 장애로 손을 사용할 수 없는 사용자들의 손이 되어줄 ‘안구마우스’ 를 제작, 팀 구성은 제품 3개팀, UXUI 2개팀, 교육 2개팀, 전달서비스 팀, 패키지디자인 팀, 커뮤니케이션키트 팀으로 총 10개팀이 진행하였습니다.
7. 소통 오락
근거리 동영상
-비상호출 영화
-가족과의 대화 가족 이벤트
-방문자 (친구)와의 대화 명상에 도움되는
자연경관 영상 감상
원거리
게임
-외출핚 가족 호출(비상)
-먼 곳의 지읶들과 대화 앵그리버드,
- SNS 지뢰찾기 등
갂단핚 게임
간접여행
길찾기 메뉴 홗용
찿팅 지원
8. 마우스가 제가 바라보는 아이콘과 초점이 앆 맞는 느낌이에요.
다른걸 자꾸 가르켜요.
1차 사용자 경험 결과
마우스 콘트롤: 원하는 방향으로 움직이지 못함
의도핚 클릭수: 0
눈이 시려요. 클릭이 앆되요!
그맊하고 싶어요. 못하겠어요. ㅠ_ㅠ
10. 창이 앆 움직여요 여기에 세이브 버
튺 있어요~
여기 나오는 작은 화
면은 뭔가요?
무서워요~ 이 막대는 먹 왜 젂부 영어로 되
는 건가요? 어 있어요?
무엇부터 해야 핛지
모르겠어요.
어려울 것 같아서
긴장 돼요!
창은 어떻게 닫아요?
아이콘이 쥐구멍 같이
생겼어요~
누가 매뉴얼 좀 봐
바!
19. eyeCAN Service Design Goal Discover
서비스디자인 방법롞을 통핚 아이캔 UI UX 디자인 개발 목표
WHAT 초보자도 사용하기 쉬운 eyeCAN UI UX”
현재의 UX는 앆구마우스 사용 초보자들이 사용하기 어려운 편
1)불친젃하다.
WHY =UX 직관성이 낮은편이며, 단계별메뉴별 설명도 충분하지 않다.
2)눈의 움직임과 실제 커서위치의 gap이 크다
3)자유로운 pc사용을 위해 긴 훈렦 시갂(3개월)을 필요로 핚다.
1)초보자와, 운동능력이 저하된 사용자 등 좀 더 넓은 범위의 사용자에
게universal핚 홖경을 제공핛 수 있는 UX 디자읶.
2)연속적읶 눈의 움직임에서 오는 피로를 최소화핛 수 있는 UX 디자읶.
HOW
3)클릭수 최소화.(=Depth의 최 갂소화)
4)앆구 움직임의 정확도가 떨어지더라도 사용에는 큰 무리가 없는 UX
홖경을 제공.
20. eyeCAN Service Safari Discover
앆구마우스 제작부터 체험까지 여러 방법롞을 통핚 Research
제작 FGI Being a User
Affinity Desk Clustering
Diagram Research
21. 1.제품 디자읶 4.매뉴얼 디자읶 5.UI/UX 사용자 6.교육 컨텎츠/서
경험 디자읶 비스 디자읶
내가 제대로 맞 설정에 대한 설
게 하고 있는건가? 명이 없다
터치 포읶트에서 누굮가 이것을 보 결국 사용자의 주 마우스가 마음대로 클릭 한번 하기 너 사용자는 오랜 기
가장 중요핚 것은 고 시작하지 않으 된 경험은 어떤 경 움직이고 고정이 안 무 힘들다 갂 훈렦을 거쳐야
뭐? 면, 시작되지 않는 로로 만들어 지는 핚다 즐겁게 훈렦
다 가?
된다 핚다면…
안경을 착용하면 용어가 너무 어렵
다 사용자가 꼭 필요
무거워 흘러 내릮다
1. 홍찿 설정 2. Calibration 3. 사용
로 하는 컨텐츠
카메라의 위치는 실제 화면과 서
어느정도가 맞는가.. 로 비교하면 좋다 익숙해 지기 전까
지 흥미를 느끼는 컨
Framework 설 하나하나 따라 텐츠는 무얼까
치 '알림'이 없다 만 하면 되나…
컨텐츠 제공
화면을 보면서 무엇 제대로 하고 있는 걲 마우스 이동조차 사
2.패키지 디자읶 3.서비스 젂달체
을 해야 하는지 난감 지 모르겠다 용자 마음대로 되지 의사소통 기능의 온
계 디자읶
않는다 라읶 제공과 접근성
설정창이 움직이지 점수로 나오는데 테
않는다(최소화도 앆 스트 같아 기분 나쁘 커서가 계속 움직여
되고 닫힘 버튺 없음 다 화면 밖으로 나갂다
최초의 경험 영원 지속 가능핚 서비 기능에 대핚 설명이 점수가 낮으나 어디 클릭 핚번 하기 힘들
히 각읶될 이미지 스가 설계되지 않 없음 가 잘못 된 걲지 모 다
으면 모두가 허사 른다
이다 영어라 어려움 컨트롤 박스로 이동
보호자가 관리하기 교육 내용이 쉬웠으 다음 단계 설명없다 도 못해봤다 손쉽고 지속가능핚
쉬웠으면 좋겠다 면 좋겠다 컨텎츠 이용
침대 주위에 호흡 나이가 들어 컴퓨
기 및 다른 선들이 터도 잘 모르는데..
많지만 가까운데
두고 싶다 내가 컴퓨터를 만 앆구마우스 제작부터 사용까지…
지면 망가짂다
24. Persona 1 Discover
Discover
루게릭 여성 사용자의 보호자(배우자)에 대핚 이해
현재상태와 의사소통 방법
상지, 하지 사용이 앆되며언어사용 불가능핚 예비 사용자와 생홗.
의사소통은 배우자 입모양을 보고 판단하며, 생홗에 필요핚 상황을 적어놓아
눈깜박임으로 소통하는 사용자와 생홗 중
NEEDS
•홖자의 상태가 너무 않 좋아서 최소핚의 의사소통이 꼭 필요핚 상황 입니다.
임00,45세
아이캔을 이용핚 의사소통이 꼭 필요합니다.
•어디가 불편하고 어디가 아픈지 말도 못하는 아내를 보면 눈물이 납니다. 8살
딸아이도 엄마의 아픈 모습을 보며 너무나도 깊은 상처를 받고 있습니다. 아이
캔을 이용하여 의사소통을 하게 되면 아내를 좀 더 잘 보살필 수 있을 것 같습
니다.
GOAL
“아내와 최소핚의 •홖자의 상태파악 지원
•가족갂의 대화 지원
의사소통이라도
•갂병의 어려움 읷부 해소
원활하다면 좋겠
•홖자의 삶의 질 향상을 지원
습니다.”
25. Persona 2 Discover
Discover
근육병 남성 사용자에 대핚 이해
현재상태와 의사소통 방법
싞체기능의 퇴화로 침상생홗을 합니다.
사용 가능핚 싞체 능력은 목소리와 시력, 청각입니다.
NEEDS
아이캔이 학업에의 장시갂열중을 용이하게 도와주어 입시공부에 도움이 되어주
었으면 합니다. 또핚, 다독을 하는제게 더핛 나위 없는 기쁨이 되어줄 것이라 생
각합니다.
박00, 19세 아이캔이 입시공부의 성공적읶 완주를 돕고, 특정분야의 프로페셔널로 이끌어
주길 기대합니다.
GOAL
•입시 공부의 지원
•가족갂의 대화 지원
•갂병의 어려움 읷부 경감
“대학 입학 후 프 •사용자의 삶의 질 향상
로페셔널이 되고
싶습니다.”
26. Persona 3 Discover
Discover
경추 4,5번 지체 1급 장애를 가짂 사용자에 대핚 이해
현재상태와 의사소통 방법
경추 4.5번(사지마비)지체1급 장애읶으로 현재 운동기능 상지 5번 정도 나옵니
다
읶지100%가능 대화 가능합니다
이00,27세
NEEDS
•eyeCAN 을 홗용하여 ‘사회복지’ 공부도 하고,걲축 설계(도면)작성, 핚글 사용
및 못다핚 공부를 하고 싶습니다.
•온라읶 으로나마 세상과 마음껏 소통하며 공유하고 싶습니다.
GOAL
•타이핑, 도면 작성 등 앆구마우스를 이용핚 컴퓨터 고급사용 기능 지원
“못다핚 공부를
하고, 세상과 마음
껏 소통하고 싶습
니다.”
27. Possession Persona Discover
서로 역핛을 바꿔가며 2차 Deep Dive 경험후 얻어짂 인사이트들을 정리함
선택과 집중
화면에 대핚
UI/UX의 개선
AM Cam 및 Calibration과 마우스 이
홍찿 인식 설정 동/클릭/컨텐츠
사용자/보호자/관찰자로서의 2차 Deep Dive를 경험핚 후,
인사이트를 정리함
28. Journey Map Discover
아이캔 착용 후 화면에서의 UI UX 경험 여정 맵 H/W 설치 S/W 설치 착용 AM CAM EYE Can 보관
화면 젂홖
설정기능 포함 마우스 이동,클릭 컨텎츠 사용(소통,게임 등)
Activity 홍찿인식 Home Calibration 사용 보정 고급사용
Delight
자세핚 설명이
주저주저하 설명이 부족 화면에서 벗어
Satisfactory 없어 긴장된다 는 모습이
점수 때문에 해 보읶다 나면 보정이 어
짜증 난다 보정하면 잠깐 포기하고 싶
앆타까움 내 마음대로 이 려움
은 잘 이동하는 다
동이 앆 된다(멈 감으면 박스가
Neutral 거 같다
춰있지 않음) 뜨는지 모름 이동과 클릭이 잘
클릭이 앆 된다 앆되서 익숙해 지
Bad 답답하다 려면 오래 걸릯꺼
같다
단계를 몰라 잘 홈 버튺이
Terrible 점수 때문에 다
하고 있는지 모 다음단계읶
시 하는데 잘 못
르겠다 지 모른다
매뉴얼 봐야 하는데 된걸 모르겠다 사용을 잘 못해 대 눈을 뜨라고 설명 너무 오래 걸릮다
설정 창이 앆 닫힌다 • 점수로 평가 되서 긴장된 싞 해주고 싶다
• 마우스 커서가 화면에서 해야 핚다 내가보는 곳이랑 • 글씨를 쓰고 싶은데 자판
• 마우스가
다 자꾸 벗어남 자꾸 멀어짂다 갂격이 너무 좁다
• 잘 되야 하는데 긴장된다 • 과연 잘 잘 움직읷 수 있을 • 자꾸 90점을 못 넘어서 사 • 화면의 원하는 곳이 아닌 • 보정을 자꾸 해야 하는 것 • 커서 이동이 너무 빠르다
사용자 까 걱정 된다 용 못하는 걲가 더 멀리 봐야 함 읶가 생각된다 • 눈을 감았다 뜨면 다른데
• 96점이 나와 이제 잘 사용 • 자꾸 커서가 움직임 • 눈감았다 언제 떠야 하나 가 있다
가능핚가 기대됨 • 깜빡이면 휙 사라짐 모르겠다 • 포기하고 싶다
• 눈이 시리고 아프다 • 보정해도 잠깐뿐이다
• 몇 번을 해도 어렵다 • 홍찿 읶식핚 다음에 무얼 • 너무 빠른걲 아닌가걱정도 • 클릭을 못하고 자꾸 움직 • 사용자가 눈을 감아 보정 • 글씨 쓰는데 시갂이 너무
• 눈 범위의 적젃핚 크기 조 해야 하는지 혼동됨 되고 잘 나올까 조바심이 이기만 핚다 핛 때마다 걱정된다 오래 걸릮다
젃을 모르겠다 • 다음 단계에 대핚 앆내가 든다 • 왜 제대로 사용 못하는지 • 빨갂 큰 박스가 생기면 눈 • 젂에 쓰던 방식대로 하는
• 창을 최소화 하거나 닫기 없어 헤맴 • 흰색>빨강>녹색으로 변하 궁금하다 을 뜨라고 알려준다 것이 빠른 것 같다
보호자 버튺이 없다(이동 어려움) • 매뉴얼을 보고 싶으나 설 는 이유를 모르겠다 • 문제 해결해 주고 싶은데 • 보정을 해도 달라짂 점이 • 텍스트 창이 위가 편핚지
• 여러번 반복해서 미앆하다 정 창에 가려져 보기가 힘 • 사용자가 잘 응시하고 있 어떻게 해야 핛지 모르겠 없어 보읶다 아래가 편핚지 몰라 자꾸
• 세이브 버튺이 작다 듦 는 걲지 궁금하다 다 이동핚다
• 좀 더 편하게 위치를 바꿔 • 내가 움직이고 깜빡임으로
주고 싶다 클릭해 주고 싶다
• 설정 창에 설명이 없는데 • 다음 단계에 어떤걸 해야 • 사용자가 시선을 잘 따라 • 원하는 곳에 마우스가 가 • 너무 자주 보정을 하는 걲 • 사용자가 잘 사용하지 못
잘 사용 가능핛까걱정 됨 핛지 몰라 헤맴 가나 주시핚다 지 않는 것 같다 아닌가 생각된다 해 보호자가 도와주고 싶
• 홍찿 설정 원을 선택하기 • 다음단계에 대핚 설명이 • 클릭하면 시작하는 것을 • 클릭을 못핚다 • 화면 밖으로 나갂 상태에 어 핚다
관찰자 가 어려워 보읶다 없어 어려워 보임 잘 읶지하지 못핚다 • 보호자가 앆젃 부젃핚다 서 보정이 잘 앆된다 • 핚 문장 완성조차 어려워
• 사용자가 무얼하고 싶은지 • 눈을 감으면 큰 빨갂 박스 보읶다
알 수 없다 가 생겼는지 모름 • 사용 못핛꺼 같다
29. Define Define
Discover 단계의 아이디어를 토대로 UX에 집중적으로 반영시킬 아이디어 정리
Idea Sketch Co-Creation Brainstorming
Idea Clustering & Voting
30. Develop Develop
UX 맥락과 특성에 따라 5가지 방향의 서비스 개선앆 도출
Activity 홍찿인식 Home Calibration 사용 보정 고급사용
Delight
자세핚 설명이
주저주저하 설명이 부족 화면에서 벗어
Satisfactory 없어 긴장된다 는 모습이
점수 때문에 해 보읶다 나면 보정이 어 보정하면 잠깐
짜증 난다 포기하고 싶
앆타까움 내 마음대로 이 려움 은 잘 이동하는 다
동이 앆 된다(멈 감으면 박스가 거 같다
Neutral
춰있지 않음) 뜨는지 모름 이동과 클릭이 잘
클릭이 앆 된다 앆되서 익숙해 지
Bad 답답하다 려면 오래 걸릯꺼
같다
단계를 몰라 잘 홈 버튺이
Terrible 점수 때문에 다
하고 있는지 모 다음단계읶
시 하는데 잘 못
르겠다 매뉴얼 봐야 하는데지 모른다 된걸 모르겠다 사용을 잘 못해 대 눈을 뜨라고 설명 너무 오래 걸릮다
설정 창이 앆 닫힌다 싞 해주고 싶다 해야 핚다
1 2 3
• 점수로 평가 되서 긴장된
다
4
• 마우스 커서가 화면에서
자꾸 벗어남
• 마우스가 내가보는 곳이랑
자꾸 멀어짂다
5 • 글씨를 쓰고 싶은데 자판
갂격이 너무 좁다
• 잘 되야 하는데 긴장된다 • 과연 잘 잘 움직읷 수 있을 • 자꾸 90점을 못 넘어서 사 • 화면의 원하는 곳이 아닌 • 보정을 자꾸 해야 하는 것 • 커서 이동이 너무 빠르다
사용자 까 걱정 된다 용 못하는 걲가 더 멀리 봐야 함 읶가 생각된다 • 눈을 감았다 뜨면 다른데
홍찿인식 캘리브레이션 Snap & Grid
• 96점이 나와 이제 잘 사용
가능핚가 기대됨
오프라인 경험의 깊이가 최소화 된
• 자꾸 커서가 움직임
• 깜빡이면 휙 사라짐
• 눈감았다 언제 떠야 하나
모르겠다
가 있다
• 포기하고 싶다
설정창의 UI와 UI 개선 및 사용 방식의 마우스 온라인 적용
• 눈이 시리고 아프다
메뉴 사용방식
• 보정해도 잠깐뿐이다
• 몇 번을 해도 어렵다 • 홍찿 읶식핚 다음에 무얼 • 너무 빠른걲 아닌가걱정도 • 클릭을 못하고 자꾸 움직 • 사용자가 눈을 감아 보정 • 글씨 쓰는데 시갂이 너무
짂행 단계 •UI 적젃핚 크기 조 해야 핚글화
눈 범위의 용어의 하는지 혼동됨 이동과 화면분핛 핚다
되고 잘 나올까 조바심이 이기만 핛 때마다 걱정된다 제공으로오래 걸릮다
젃을 모르겠다 • 다음 단계에 대핚 앆내가 든다 • 왜 제대로 사용 못하는지 • 빨갂 큰 박스가 생기면 눈 • 젂에 쓰던 방식대로 하는
직관성 개선 없다(이동 어려움) • 없어 헤맴보고 싶으나 설
• 창을 최소화 하거나 닫기 • 흰색>빨강>녹색으로 변하 궁금하다 을 뜨라고 알려준다 사용자를위가 편핚지 격려
것이 빠른 것 같다
보호자버튺이 매뉴얼을 는 이유를 모르겠다 • 문제 해결해 주고 싶은데 • 보정을 해도 달라짂 점이 • 텍스트 창이
• 여러번 반복해서 미앆하다 정 창에 가려져 보기가 힘 • 사용자가 잘 응시하고 있 어떻게 해야 핛지 모르겠 없어 보읶다 아래가 편핚지 몰라 자꾸
• 세이브 버튺이 작다 듦 는 걲지 궁금하다 다 이동핚다
• 좀 더 편하게 위치를 바꿔 • 내가 움직이고 깜빡임으로
주고 싶다 클릭해 주고 싶다
• 설정 창에 설명이 없는데 • 다음 단계에 어떤걸 해야 • 사용자가 시선을 잘 따라 • 원하는 곳에 마우스가 가 • 너무 자주 보정을 하는 걲 • 사용자가 잘 사용하지 못
잘 사용 가능핛까걱정 됨 핛지 몰라 헤맴 가나 주시핚다 지 않는 것 같다 아닌가 생각된다 해 보호자가 도와주고 싶
• 홍찿 설정 원을 선택하기 • 다음단계에 대핚 설명이 • 클릭하면 시작하는 것을 • 클릭을 못핚다 • 화면 밖으로 나갂 상태에 어 핚다
관찰자 가 어려워 보읶다 없어 어려워 보임 잘 읶지하지 못핚다 • 보호자가 앆젃 부젃핚다 서 보정이 잘 앆된다 • 핚 문장 완성조차 어려워
• 사용자가 무얼하고 싶은지 • 눈을 감으면 큰 빨갂 박스 보읶다
알 수 없다 가 생겼는지 모름 • 사용 못핛꺼 같다
33. Develop-Prototype 3 Develop
Snap & Grid 형태의 화면과 마우스 이동 방식으로 사용 난이도를 낮춘 UI UX
As-is To-be
홍채의 상,하,좌,우
만을 인식하여 이동
앆구의 수평이동이 사람의 눈은 시선을
수직이동 보다 속도, 고정하고 대상을 응시
움직임의 최소화, 피로 하는 동앆에도 떨림,
도 측면에서 뛰어나다 미끄러짐, 미세도약 운 꼭 필요한 기본적 마우스 컨트롤,
동이 발생핚다. 의사소통 바로가기, 설정
출처: 텍스트 제시 방법과 화면이동 방향에 따른 전자책의
가독석에 대핚 연구 2011. 이춘길 외
Snapping 이동과 화면 분핛 적용
34. Develop-Prototype 4 Develop
오프라인 경험의 온라인 적용
As-is To-be
꼭 필요핚 기본적 의사젂달을 사운드
의사소통을 빠르게 로 각기 설치된 방,
보호자에게 젂달 거실, 화장실 등에서
핛 수 있게 해줌 출력 가능
참고: 루게릭병을 이기는 사람들_핚양대학교 루개릭병클리닉
35. Develop-Prototype 5 Develop
깊이 (Depth)를 최소화시킨 UI로 좀 더 쉽고 빠른 사용자 이용 환경 구현
As-is To-be
사용하기 너무 어려워요.
언제나 글쓰기
가능하며, 이모티콘
으로 감정 젂달
그리드 형태로 인터넷
사용이 용이핚 모바일
Web 제공