UX/UI의 전략적 접근: 스마트 헬스케어 사례 고찰 - 5가지 사례에서 길어 올린 스마트 헬스케어 UX/UI의 전략적 통찰 :Sproutel’s Jerry the Bear & A.C. Camargo Cancer Center’s Justice League :Zeo Sleep Manager Pro :Janssen’s Care4Today App and SMS :AliveCor :Fitness Shirt - UX/UI, 우리에게 시사하는 것

1. 2014.11
성균관대학교 일반대학원 휴먼ICT융합학과 교수 (산학협력중점)/
HEDcentric UX미래융합전략연구소 연구소장
최병호/ BillyChoi@Gmail.com
Research Data: http://www.slideshare.net/BillyChoi/
Twitter/Facebook: ILOVEHCI
휴먼ICT융합 blog: http://humanictconvergence.blogspot.kr/
UX미래융합전략연구소 blog: http://blog.naver.com/soularchitec

2. • 5가지 사례에서 길어 올린 스마트 헬스케어 UX/UI의 전략적 통찰
1. Sproutel’s Jerry the Bear & A.C. Camargo Cancer Center’s Justice League
2. Zeo Sleep Manager Pro
3. Janssen’s Care4Today App and SMS
4. AliveCor
5. Fitness Shirt
© 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
Table of Contents
• UX/UI, 우리에게 시사하는 것
스마트 헬스케어 UX/UI의 전략적 접근
1

5. ① 디바이스를 개발하여 착용시킨다.
② 디바이스로 측정하여 데이터를 전송한다.
③ (빅)데이터를 분석하여 멋있게
인포그래픽 처리한다.
④ 스마트폰 앱으로 정보를 제공한다.

6. ① 디바이스를 개발하여 착용시킨다.
② 디바이스로 측정하여 데이터를 전송한다.
③ (빅)데이터를 분석하여 멋있게
인포그래픽 처리한다.
④ 스마트폰 앱으로 정보를 제공한다.

7. http://youtu.be/FFwCigfzaak

8. © 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
Sproutel’s Jerry the Bear
http://youtu.be/FFwCigfzaak
스마트 헬스케어 UX/UI의 전략적 접근
Jerry is an interactive
teaching toy for children
with type 1 diabetes.
He shows them how to
manage blood glucose
levels, recognize their
symptoms, and maintain a
healthy diet - all through
play. Using games, positive
reinforcement, and real
world scenarios, Jerry
allows children to learn the
skills necessary to take care
of themselves for the rest
of their lives.
http://slidesha.re/1uBY9gv

10. ① 어둠을 알려준다.
② 어둠을 지배하는 방법을 알려준다.
③ 어둠과 공존하는 방법을 알려준다.

11. ① 심리적인 두려움을 스스로 케어하는 방법을 제시한다.
② ‘또래의 동병상련’을 공유하여 ‘외로운 싸움’이 아님을
공유한다.
③ 24시간 동안 또 하나의 신체로서 체화될 수 있는
거대한 환경, 기호를 선물한다. (예) 인형
④ 목표 가속화 효과를 활용하여 행동의 변화를 유도한다.

13. © 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
A.C. Camargo Cancer Center’s Justice League
http://youtu.be/KC2y3s-MCMs
스마트 헬스케어 UX/UI의 전략적 접근
They transformed the
children’s ward into a
superhero paradise,
complete with a
“Hall of Justice” game
room and superhero-themed
decorations.
The intravenous
chemotherapy bags
became magic power
against cancer when they
were concealed in colorful
superhero cases and
rebranded as
“Superformula.”
http://slidesha.re/1uBY9gv

16. ① 수면패턴을 정확하게 측정할 수 있는 형태의
디바이스를 개발하여 착용시킨다.
② 디바이스로 측정하여 데이터를 전송한다.
③ (빅)데이터를 분석하여 멋있게 인포그래픽
처리한다.
④ 스마트폰 앱으로 정보를 제공한다.

17. ① 수면패턴을 정확하게 측정할 수 있는 형태의
디바이스를 개발하여 착용시킨다.
② 디바이스로 측정하여 데이터를 전송한다.
③ (빅)데이터를 분석하여 멋있게 인포그래픽
처리한다.
④ 스마트폰 앱으로 정보를 제공한다.

18. http://bit.ly/11uJkFx

19. http://youtu.be/j3Y7PGhHR20

21. http://bit.ly/1pnoH9v

22. 각성
성과
Susan M. Weinschenk, 2011
여크-도슨 법칙은 난이도가 높은 과업은 최적의 성과를 위해 적은 각성을
필요로 하며, 각성 수준이 너무 높으면 붕괴되기 시작한다. 비교적 단순한
과업은 상대적으로 많은 각성이 필요하고, 빠르게 감소하지 않는다.

24. ① ‘Here and Now’를 알려준다.
② 스트레스와의 공존 가치를 알려준다.
③ 널 미치게 하는 것을 발견하게 한다.

25. ① 수면장애의 심리적인 이슈를 스스로 케어하는 방법을
제시한다.
② 숙면 가능한 환경으로의 전환을 지원한다.
③ 인위적이고, 숙면을 방해하는 유형의 착용을 지양한다.
(예) 존재감 없는 스마트 밴드

30. Susan M. Weinschenk, 2011
회상해야 할 항목의 개수가 많을수록 기억력의 정확도는 떨어진다

31. 망각 곡선으로,
Susan M. Weinschenk, 2011
장기 기억에 저장돼 있는 정보임에도 얼마나 빨리 기억을 잊어버리는지 보여준다

32. 정보를 인식하는 것이 기존의 기억을 회상하는 것보다 훨씬 쉽다
• 사용자에게 정보를 회상(recall)하게 하는 것은 지양한다. 기억의 저편에서 정보를
끌어오는 것(recall)보다 재인(recognize)시켜 주는 편이 사용자에게 훨씬 쉽다.
• 재인(recognition)은 맥락(context)을 이용한다. 맥락은 우리의 기억을 돕는다.
© 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
스마트 헬스케어 UX/UI의 전략적 접근
31

33. © 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
Janssen’s Care4Today App and SMS
http://youtu.be/65Ri11jYaTc
스마트 헬스케어 UX/UI의 전략적 접근
Care4Today pairs image-driven
reminders with incentives and
social support. Through an app or
text messaging (user’s choice), the
program helps support daily
adherence to treatment plans.
Care4Today has a refill reminder and
a two-way secure messaging
platform. It also has images of over
20,000 pills – making it a lot easier
to know exactly what to take. To
motivate users, it can alert a
designated “caregiver” if a user
misses a dose or give 5¢/day to a
chosen charity when the user
confirms a dose.
http://slidesha.re/1uBY9gv

34. © 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
Zero Effort UX/UI Strategic Framework
Zero Effort
UX/UI Strategy
스마트 헬스케어 UX/UI의 전략적 접근
Law of
conservation of
complexity
복잡성 보존의 법칙
I.C=0%, S.C=100%
사용자 인터페이스의
복잡성(Interface
Complexity),
시스템의
복잡성(System
Complexity)
CLI
GUI
NUI
NEST-like UI
(Deep UI)
Interface
Complexity
System
Complexity
0% 100% 0%
http://youtu.be/L8TkhHgkBsg
33
“인지/시각/운동
부하와 인터페이스
복잡성을 혁신적으로
줄이고, F패턴에
부흥하며, 높은
사용품질을
내재화하는 것”
by Billy Choi
(@ILOVEHCI)

35. ① ZEC(Zero Effort & Connected) UX/UI 전략을 구사해야
한다. (예) 병원에서 알람 규칙 자동 제공, 약 열람 현황
식별 가능한 smart drug box 서비스, Deep learning 기술이
적용된 손자의 먹거리 챙기기 서비스
② 패밀리와 유관 에코시스템의 협력 서비스를 도입해야 한다.
③ Gamification을 적용해야 한다. (예) 약속 어길 시 기부
④ 실버의 신체적/심리적 제약 조건에 부합하는 UI 디자인

37. • 캘리포니아주의 얼라이코사는 전극이 장착된 아이폰용 케이스를 통해 심전도를 측정할
수 있는 앱 개발함
• 앱을 작동시킨 후에 손으로 아이폰용 케이스를 가슴에 대면 심전도를 측정하고,
그래프와 수치를 확인할 수 있으며, 정보를 의사에게 전송할 수 있음
• 자체 내장 배터리 전원으로 측정하며, 데이터는 무선으로 스마트폰에 전송함.
FDA(식품의약국) 승인 받아 미국에서 199달러 판매 중임
See how it works - AliveECG by AliveCor http://youtu.be/0pE_InOy1mk
생체인식 기술, 시장동향과 참여업체 사업전략, 편집부, 임팩트, 2014년 10월 10일
© 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
AliveCor (심전도 모니터링)
스마트 헬스케어 UX/UI의 전략적 접근
36

38. • 독일 프라운호퍼 집적회로연구소에 의해 설계된 실험 셔츠로, 건강과 체력을
모니터링하고 스마트폰과 무선으로 교신하는 스포츠 셔츠 개발함
• 직물 전극(천의 도전 부분)은 가슴 둘레의 탄성 밴드로 호흡을 측정하고, 심근에서
나오는 전기 신호를 픽업함. 심박, 호흡능력, 혈중산소포화도, 자세와 이동 등 각종
의학적 및 신체적 지표들을 추척함. 전자 유닛은 셔츠에 끼우고 모니터링을 하고, 세탁
시 쉽게 분리함. 유닛은 배터리를 내장하고 있으며, 데이터를 저장하고 무선으로 전송함.
셔츠는 원래 ECG 녹음을 모니터링하는 스포츠 셔츠로 설계됨
생체인식 기술, 시장동향과 참여업체 사업전략, 편집부, 임팩트, 2014년 10월 10일
© 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
Fitness Shirt (심박/호흡능력/혈중산소포화도)
스마트 헬스케어 UX/UI의 전략적 접근
37

40. (출처: http://slidesha.re/1sp6mrT)

41. 가슴 뛰는 가치를 정의하는 것이 vision이죠.
그 비전을 남들이 아무리 노력해도 베낄 수 없도록
대체와 모방이 불가능한 독보적인 방법을 규정하
는 것이 strategy이죠.
고객이 기대하는 그러나 그 이상의 놀라움을 포장
하여 제공할 수 있는 선물을 고르는 것이
proposition이죠.
그 선물을 누구라도 이해할 수 있는 스토리텔링이
라는 옷을 입히고 끄덕끄덕 거리는 것이 concept
이죠.
고객에게 가장 실체화될 수 있는 concept을 직접
적으로 보여주는 것이 information이죠.
그 information을 고객의 멘탈모델과 태스크모델에
부합되도록 조직화하고 구조화하는 것이 structure
이죠.
고객의 목적을 달성할 수 있도록 눈에 보이지 않는
usage process을 설계하는 것이 interaction이죠.
보자마자 숨이 멈출 것 같은 총체적인 감성을 제공
하는 것이 appearance이죠.
이 모든 것이 동작되도록 기술력을 투영하는 것이
front-end이죠.
지금까지 순차적으로 언급했던 핵심 단어는 상위
가치로부터 상세 가치까지 이어지는 일련의 흐름
을 가지고 있다는 것을 잊지 않으면 위대한 작품을
만드는데 기여할 것이죠.^^
(이미지 출처: UX South Africa 2014 - Keynote/ http://slidesha.re/1tr7rSk )

42. 41

43. (출처: http://www.uie.com/articles/ux_strategy_blueprint/ )

44. (이미지 출처: http://slidesha.re/1qosi1H )
Martin Granstrom의 UX전략 프레임워크

45. (이미지 출처: http://slidesha.re/1qosi1H )
Martin Granstrom의 UX전략 프레임워크

46. Martin Granstrom의 UX전략 프레임워크
(이미지 출처: http://slidesha.re/1qosi1H )

47. (이미지 출처: http://slidesha.re/1qosi1H )
Martin Granstrom의 UX전략 프레임워크

48. (이미지 출처: http://slidesha.re/1qosi1H )
Martin Granstrom의 UX전략 프레임워크

49. (이미지 출처: http://slidesha.re/1qosi1H )
Martin Granstrom의 UX전략 프레임워크

50. (이미지 출처: The ux of user experience/ http://slidesha.re/1qolLUN )

53. © 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
http://youtu.be/JLOzF0Y4Mqw
Things
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
ZEC UI Strategic Framework
ZEC* UI/UX
Strategy
(*ZEC=Zero Effort &
Connected(IoT/IoE))
스마트 헬스케어 UX/UI의 전략적 접근
UI
Connected
Shortcuts &
Defaults
Thing to Service
Shortcuts Defaults
Internet
Internet
Things
Things
Services
Services
Connecting
Physical Shortcuts
Invisible Shortcuts
• Amazon Dash
• iBeacon
Internet
Things
Services
Logical Shortcuts
• Nymi
http://youtu.be/c3h0eKGfUfI
http://youtu.be/jUO7Qnmc8vE
• Smart Glasses
상품 내비게이터,
상품 정보 열람,
카트 정보, 쇼핑
목록 관리, 즉시
결제
52
http://youtu.be/xnIoGzur0h4
“기본적인 사용성과
커넥티드 기반의
사용성을 충족하면서
현실에서 제공하지
못하는 차별화된
가치와 생태계를
디자인하여 구매자의
숨은 니즈에
부합하는 것”
by Billy Choi
(@ILOVEHCI)

54. © 2014 성균관대학교 일반대학원 휴먼ICT융합학과 교수/
HEDCENTRIC UX미래융합전략연구소 소장 최병호 All rights reserved.
BJ Fogg's Behavior Model(FBM)
스마트 헬스케어 UX/UI의 전략적 접근
53

55. 경청해주셔서
고맙습니다!