NUI : Interaction De-sign
User Experience Designer, Sungwook Baek
2013.01.12
아이디어 인터렉션 알고리즘Conclu-sion사용성 평가Definition
It’s as simple as nature herself
What is the Natural User Interface?
A natural user interface is a user interface designed to use natural human behaviors for interacting directly with content.
Joshua Blake
Bill Buxton
NUIs are designed
NUIs reuse existing skills
NUIs have direct interaction with content
NotNATURAL USER INTERFACE,
butNATURAL USER INTERFACE
Daniel Wigdor, Dennis Wixon
아이디어 인터렉션 알고리즘Conclu-sion사용성 평가Definition
History 인터렉션 알고리즘 결론사용성 평가Definition
1965, Engelbart
1981, Xerox Star
1966, Engelbart's Workstation
1982, Apple Lisa
1974, Xerox Smalltalk
1984, Apple Machintosh
Brief history of WIMP technology
History 인터렉션 알고리즘 결론사용성 평가Definition
Brief history of NUI technology
Ivan Sutherland, Sketchpad in 1962 Alan Kay, Dynabook in 1972Donald Bitzer’s PLATO in 1967
Bolt’s Put That There in 1979 Myron Kruger’s Video Place in 1986
History Now Design Q&AConclusionDefinition
Ivan Sutherland, Sketchpad in 1962
History Now Design Q&AConclusionDefinition
Donald Bitzer’s PLATO in 1967
History Now Design Q&AConclusionDefinition
Alan Kay, Dynabook in 1972
What you see is what you get(WYSIWYG)
History Now Design Q&AConclusionDefinition
Bolt’s Put That There in 1979
History Now Design Q&AConclusionDefinition
Myron Kruger’s Video Place in 1986
History Now Design Q&AConclusionDefinition
Apple, Knowledge Navigator in 1987
History Now Design Q&AConclusionDefinition
History Now Design Q&AConclusionDefinition
History Now Design Q&AConclusionDefinition
사람들은 기술에 대한 기대치가 상당히 높다
History Now Design Q&AConclusionDefinition
History Now Design Q&AConclusionDefinition
History Now Design Q&AConclusionDefinition
Microsoft illumiroom
History Now Design Q&AConclusionDefinition
History Now Design Q&AConclusionDefinition
Emotiv
Definition History Now Design Q&AConclusion
Newton vs Palm
Definition History Now Design Q&AConclusion
NUI 정의 : 특별한 노력과 연습 없이도 기술을 습득하고이뤄내야 한다 .
NUI Interaction 의 3 가지 고려요소- 재미- 기술 향상을 이끌어냄- 문맥에 적절함
NUI 를 표현하기 위한 새로운 형태의 GUI 를 작업해야 된다 .
Definition History Now Design Q&AConclusion
3D Interface
Definition History Now Design Q&AConclusion
Seamless
Suspension of disbelief
-> Interaction 과정을 방해하는 모든 요소들을 제거 , 기술적으로 해결해야 될 문제
Self Monitoring-> 액션을 수행하기 위해 필요한 패턴 또는 템플릿과 유저의 행동을 비교하지 않고 수행
행동과 오브젝트 간의 연관성을 고려
상태와 전이 변화 : 애니메이션 , 질량 , 가속 , 마찰 , 중력을 활용한 표현
Definition History Now Design Q&AConclusion
Definition History Now Design Q&AConclusion
Definition History Now Design Q&AConclusion
Definition History Now Design Q&AConclusion
유저 인터페이스 컨트롤을 통하지 않고 직접 콘텐트를 조작하도록 하자 .
사용자가 상호작용 하지 않는 동안에도 동작 중이라는 사인을 주자 .
초보자에서 전문가로 이동할 수 있는 자연스러운 과정을 제공할 메커니즘을 만들자 . 전문가용 사용패턴을 별도로 두어 전문가용에서 좀 더 효과적으로 Interaction 할 수 있도록 하자 .
Definition History Now Design Q&AConclusion
Scaffolding Instruction: 학습과 수행의 통합 .
커다란 문제를 잘게 나누어 해결하게 하는 교수법이다 .
잘게 나눈 뒤 특정 프롬프트 힌트 유도질문과 같은 방식으로 설명해라 .
EX)
커다란 문제점
어떻게 전체 시스템이 작동하는가 ?
시스템이 가지고 있는 가능성에는 어떤 것이 있는가 ?
작은 문제점이 액션을 어떻게 초기화할 것인가 ?
다음으로 무엇을 해야 하는가 ?
참조정보에 대한 사용을 삼가고 즉각적이고 간단한 큐를 통해 사용자의 다음 행동을 알려주도록 한다 .
모든 콘텐트를 터치 가능하도록 만들어 사용자가 스크린 어디를 터치하더라도 피드백을 주자 .
피드백 정말로 중요함
Definition History Now Design Q&AConclusion
OORGesture Registra-
tion
Gesture Continua-
tion
Gesture Termination
Action Movement Lift
Movement
Movement
State Transition Diagram
Definition History Now Design Q&AConclusion
Fat finger problem
-> Contact Visualization-> 모든 UI 구성요소를 크게 만들자-> iceberg target-> Ridgedpad
Definition History Now Design Q&AConclusion
Designer 가 반드시 알아야 될 것 ! NUI Technology 를 이해하자
< 헤일로 : 레전드 > 는 전 시리즈에 걸쳐 밀리언 셀러 (100 만개 ) 를 달성했을 뿐만 아니라 , 타임즈에서 뽑은 100 개의 히트 상품 중 하나로 선정되고 , 1,2,3 편 모두 모든 매체에서 90 점 이상의 호평을 받은 명작 . 헤일로의 세계를 펼쳐나간 작품 .
사용자가 총을 겨눌 수 있는 영역을 넓히고 적에 적중하도록 하자 .
총이 적이 있는 방향을 겨누고 있으면 움직임 속도를 약간 줄여 사용자로 하여금 여전히 상대편을 겨눈 상태로 조이스틱을 놓을 수 있는 시간을 만들어 준다 .
Definition History Now Design Q&AConclusion
NUI 에서 커서는 어떻게 해야 될까 ?
커서의 존재와 사용자의 입력에 대한 반응을 통해 활성화 상태 혹은 추적 혹은 명령을 받을 준비가 되었는지에 대해 피드백을 얻는다 .
시스템상에서 사용자의 입력을 이해하고 있음을 표현하는 방식의 필요성은 매우 분명하다
Definition History Now Design Q&AConclusion
원거리에 있는 물체에 대한 터치
물리조작의 제한 , 거리가 있는 컨트롤과의 상호작용
Beyon constraint
Definition History Now Design Q&AConclusion
false negative and false positive errors
Action
제스쳐 인식을 시작하거나 멈추는 것을 알려주는 역할 제스쳐인지 비제스처인지를 구분할 수 있도록 정확도를 높여준다 .
Clutch
시스템에서 사용할 제스쳐 Action.
Definition History Now Design Q&AConclusion
Chassis Gesture
가속기 , 자기계 , 자이로스코프
Definition History Now Design Q&AConclusion
MDA Framework
: 게임을 개선하고 디자인하는 데 검증된 도구이다 .
: Microsoft Studio 의 User Research 팀에서도 검증된 방법
ActionObject Conclusion
Definition History Now Design Q&AConclusion
RITE(Rapid iterative test evaluation methodology) : NUI 의 메타포 디자인 방법론
RITE 의 목표는 최고의 메타포어를 찾는 것 .
시스템 디자인 요소가 사용자에의 메타포어와 상호작용 하는가 ?
그 메타포어가 사용자로 하여금 납득할 수 있는 것이며 시스템을 학습 할 수 있도록 도와주고 있는가 ?
대표적인 NUI Metaphor
MAGNET, SHEPER,E UNFOD
디자인 팀은 다양하고 실현 가능한 메타포어와 디자인을 만들어야 한다 .
팀은 가장 독특한 메타포어를 선택해야 한다 . 그래야 더 좋은 피드백을 받을 수 있다 .
메타포어를 정제하는 데 목표를 두어야 한다 . 정제의 목적은 상호소통의 장애물을 제거하고
메타포어를 더 분명히 묘사하는 것이다 .
긍정오류와 부정오류를 인식하는 것을 빠르게 반복하여 언어를 향상시키는 RITE 방식이 중요하다 .
Definition History Now Design Conclusion Q&A
Right now is the time to create a practice of ubiquitous computing user experience design.
The Technology is ready.
Consumers are ready.
Manufacturers are ready.
The world is ready.
Now it is up to designers to define what that practice will mean.
Q & A
Definition History Now Design Conclusion Q&A