2. 인터랙션과 인터페이스

인터랙션

1. 인터랙션(Interaction)의 정의

■ 인터랙션(Interaction)

 interactive [a.] 상호작용적인

 기존: 사람 간의 상호작용을 의미

 현재: 사람 뿐만 아니라 인공 매체와의 상호작용도 포함

 참고) 인터페이스(interface): 인터랙션을 위한 기능을 제공하는 매체

*인공매체 : 컴퓨터, 전자기기를 말함

 

2. 상호작용성(interactivity)

 인터랙션의 정도(magnitude / 양)를 나타내는 단위

 사용되는 분야 / 접근 형태에 따라 서로 다른 정의가 존재

*분야에 따라 뜻이 달라짐. 아래에서 각 분야에 따라 어떻게 정의하는지 보자.

 

■ 사용되는 분야에 따른 정의

공학	 사람이 기계를 얼마나 편리할 수 있는지 나타내는 정도  Usability 라는 의미
HCI	 사람과 컴퓨터가 상호작용할 수 있도록 시스템 설계  작업 수행 능력의 향상을 목적
교육	 온라인 학습 효과의 효율성 측정

 

■ 접근 형태에 따른 정의

조작 가능성	인터페이스, 기기 등을 사람이 얼마나 쉽게 조작, 컨트롤 할 수 있는가?
네트워크 연결성	얼마나 잘 연결되어 있는가? 멀리든 가까이든
정보 교환성	정보가 얼마나 잘 교환되는가?
콘텐츠 인지성	상호작용에 있어, 컨텐츠를 얼마나 잘 이해할 수 있게 되어있는가?

 

 

3. 상호작용성과 웹의 진화

 웹 1.0 → 웹 2.0(개방, 공유, 참여) → 웹 3.0(스마트, 시멘틱) → 웹 4.0(인텔리전트 지능형)으로 진화

*시멘틱 : 검색도 손쉽게해주는 아키텍처

*웹 4.0 : 모든것들이 별도로 얘기하지 않아도 정보가 자동으로 제공된다.

 공급자는 플랫폼(Platform)만 제공, 사용자가 콘텐츠를 제작·유통

 집단지성을 통하여 지식의 생산을 주도 (같이 있지 않아도 같이 연구가 된다 / 혼자가 아닌 모두가 같이!)

 파레토 법칙(롱테일 법칙, Long Tail) 활성화

*유통의 관점에서 파레토 법칙을 보자.

*상위 20%와 하위 80%의 물건 유통량을 보니 비슷하다.

*오히려 잘 팔리지 않는 특성적인 매니악한 물건도 판매하면 상위 20% 잘팔리는 물건처럼 수익이 크다.

*즉 매니악한 컨텐츠(b급 영화, 소수만 소비하는 컨텐츠)도 잘 유통하면 큰 수익이 된다. 

 

 

4. 인터랙션 디자인

 대화형 시스템에서 상호작용을 위하여 디자인하는 것

 커뮤니케이션(소통) 뿐만 아니라 구조와 동작(행동)까지도 전달

 사람과 객체 사이에 다양한 형태로 반응하는 소통이 일어나는 것이 목적

*객체: 여기서 말하는 객체는 꼭 사람만이 아닌, 컴퓨터 등도 포함된다.

 사용자 경험(UX: User eXperience)의 디자인 방법들이 포함

*시각디자인, 인터렉션 디자인, 정보아키텍처 / 개발 / 기술 / 켄텐츠,미디어 등 다양한 관점에서 디자인한다는 뜻

 

■ 인터랙션 디자인의 형태

사람과 객체	 객체에 내재된 작용이 지배하는 인터랙션  인터페이스(interface)
사람과 사람	 사람들의 행위(behavior)와 말(speech), 기호(sign), 의미가 인터랙션의 구성과 해석의 중요 요소
사람과 환경	 휴먼 인터랙션(human interaction)  환경 속 사람의 역할이 중요
사람과 우주	 인터랙션 디자인은 사람의 정신 세계를 기반으로 이루어짐  인터랙션 디자인의 철학적 사고라고 보면 된다.

*최근에는 다중감각 인터랙션이 중요(multimodal interaction) : 시각,청각,미각 등이 복합적으로 결합된 인터랙션

*휴먼 인터랙션 : 나와 자연, 날씨에 대한 설계

 

 

인터페이스

1. 인터페이스(Interface)의 정의

■ 인터페이스(Interface)

 분리된 서로 다른 두 환경 사이에서 의사소통을 위하여 발생하는 공간

 디지털 기기와 사람들의 소통을 위한 중개자 역할

 사용자가 원하는 정보를 빠르고 정확하게 획득하기 위해 필요

 

■ 소프트웨어 인터페이스

 소프트웨어에 대한 사용자 인터페이스(UI, User Interface)

 문자 방식(CUI), 메뉴 방식(MUI), 그래픽 방식(GUI) 등

 

■ 하드웨어 인터페이스

 하드웨어 장치 사이에 상호작용을 가능하게 하는 물리적 장치

 예: 플러그(plug), 인터페이스 카드(interface card), 사운드카드 등 

 

■ 사용자 인터페이스 설계의 원칙

 인터페이스는 반드시 사용자의 기대에 부응하고, 원하는 작업을 지원하여야 함

 인터페이스는 배우기 쉽고, 기억하기 쉽고, 사용하면서 즐거움을 주어야 함

 인터페이스는 시각적으로 커뮤니케이션을 통하여 정보의 획득과 작업 수행을 도와야 함

 

 

2. 인터랙션 디자인과 인터페이스 디자인

■ 인터랙션 디자인과 인터페이스 디자인의 비교

	인터페이스 디자인	인터랙션 디자인
디자인 관점	기능의 시각화	상호작용과 반응
요구사항	시각적인 감각	인터페이스와 행위
디자인 범위	특정 부분 설계	포괄적인 설계
역할	중개자 역할	커뮤니케이션(소통) 역할

*개인적인 생각으로 (인터랙션 디자인 > 인터페이스 디자인)로 인터랙션이 좀 더 큰 범위라 본다.

*윈도우를 예로 보자. 우리는 어떤 프로그램의 아이콘을 클릭하면 뭔가 실행이 된다. 아이콘은 단순한 '인터페이스'다. 하지만 실행함으로서 어떠한 정보가 나오거나 프로그램이 설치가 되고, 작업이 수행이 된다. 이러한 일련의 과정을 '인터랙션'이라 보면 된다. 

 

3. 다양한 인터페이스

■ GUI(Graphical User Interface)

 Apple사의 매킨토시 컴퓨터의 운영체제가 시초

 마우스 = 화면에서 포인터의 이동과 조작의 용이성 제공

 WIMP 방식에 의하여 조작 

 최근에는 노트북의 터치패드가 그 기능을 이어받음

 멀티터치 기능 등이 추가 (스마트폰에서 집게손으로 화면을 확대하는 행동)

 

■ NUI (Natural User Interface)

 사람의 동작이나 음성, 뇌파 등으로 시스템을 조작

 인공지능과 빅데이터 기술을 발전으로 구현 가능

 문화적 차이로 인한 인지의 문제 발생

 

 

4. 사용자 경험(UX: User eXperience)

* 사용자가 시스템, 제품, 콘텐츠, 서비스 등을 이용하면서 느끼고 생각하게 되는 지각, 반응, 행동 등과 관련된 총체적 경험

 

■ 사용자 경험

 어떤 객체와 상호작용하며 나타나는 전체적인 느낌이나 경험

 UI를 통해 사용자가 느끼는 감정으로 평가

 

■ 사용자 인터페이스

*사용자 경험의 산출물이 바로 사용자 인터페이스다. 우리가 초기 스마트폰을 썼다. 근데 화면이 작다보니 안보인다. 어? 화면 확대 기능이 있으면 어떨까? 버튼으로 만들었더니 복잡하고 직관적이지 않아. 그럼 손 제스처를 인식하는 패널은 어떨까? 쉽고 직관적이네! 개꿀ㅋ

 사람과 시스템의 관계 또는 소통 채널을 의미

 접근성, 사용성, 편의성으로 평가

 

■ 사용자 경험의 구성 요소

사용 가능한 usable	버티컬 마우스 써봤는데 별루야.
유용한 useful	버튼 있는 마우스를 썼더니 편하네? 유용해!
바람직한 desirable	이 마우스는 여러가지 관점해서 디자인, 외관도 좋고 사용감도 좋네!
가치있는 valuable	설명 안해주심 -ㅅ-)a
검색 가능한 fidable	설명 안해주심 -ㅅ-)a
접근 가능한 accessible	이 키보드는 블루투스 기능으로 스마트폰도 연결이 되네? 편해!
신뢰 있는 credible	이 마우스는 고장이 안나네! 신뢰도 높은 브랜드 제품이네!

 

 

5. 인간 컴퓨터 상호작용(HCI: Human-Computer Interaction)

*인간이 컴퓨터를 좀더 쉽고 유용하게 사용함으로써 인간과 컴퓨터 간의 상호작용을 개선하는 것을 목적으로 하는 학문

*내가 컴퓨터를 사용하는것, 컴퓨터 입장에서 나로부터 정보를 받고, 컴퓨터가 보여주는 모든 과정을 개선하는 것

 

■ HCI 1.0

 사용자와 컴퓨터 사이의 기술적인 상호작용을 통하여 사용자에게 유익하고 새로운 경험을 제공

 

■ HCI 2.0

 개인과 컴퓨터 간의 관계를 넘어 집단(사회)와 디지털 기기, 서비스, 콘텐츠 등과 상호관계를 맺음

*범위가 확장이 되고, 기술보다 인간이 주도되는 형태를 추구하게 됨. (기술에 지배당해선 안된다!)

 

■ 정의의 확대

 디지털 기술의 발전 → 사용자, 컴퓨팅, 인터페이스 등의 정의로 확대

 

■ HCI의 중요성

 컴퓨터와 디지털 기기의 보급 → 일반인의 흥미 필요

 기기의 소형화 경량화 → 기기의 유용성이 증대되는 디자인 필요

 편리성 향상, 만족감 증대, 비즈니스 성능 향상

 

■ HCI 발전의 예시(스마트폰 보안의 진화)

 

 

6. 생체 인식 인터페이스

*개인이 가지고 있는 생체 정보를 디지털화하여 개인을 식별하거나 인증하는 데에 사용하는 기술

 

■ 특징

 복제가 불가능, 분실 위험이 없음, 제3자 도용 불가능 → 보안 분야에 적합

 

■ 분류

 지문, 얼굴, 홍채 등과 같이 신체 특징을 이용하는 방식  음성, 서명 같은 행동 특징을 이용하는 방식

 

■ 다양한 생체 인식 인터페이스

손바닥 인식	손금의 형태와 독특한 패턴을 이용한 인식 기술
지문 인식	지문에 존재하는 특징점을 파악한 후 일치 여부 판단(안전성, 편리성, 단순성, 저비용)
얼굴 인식	카메라와 각종 센서를 이용하여 손쉽게 확인 가능, 비접촉 방
홍채 인식	홍채의 고유한 특징을 이용, 비접촉 방식
정맥 인식	손등 또는 손목의 혈관 형태를 인식
음성 인식	사람의 억양과 말하는 습관 등 음성의 고유한 특징을 이용

 

■ 스마트폰의 생체 인식 기술

*위 여자 : 화면을 보다가 다른 곳을 보게 되면 화면이 정지한다. 다른곳 보고 있어? 잠시 멈춰줄게!

*위 오른쪽 : 눈을 아래로 슬쩍내리면 화면 스크롤 다운이 된다. 보는 방향으로 계속 진행이 되네!

*아래 남자 : 스마트폰하다가 전화가 오면 우리는 귀에 폰을 댐. 그러면 자동으로 화면이 꺼져서 불필요하게 버튼이 눌리는걸 방지해줌. 반대로 통화중, 문자가 와서 급하게 확인할려고하면 화면이 켜지면서  버튼을 누룰 수 있게 

*아래 오른쪽 : 손바닥 제스쳐 인

 

 

 

인터랙션과인터페이스사례

 

1. 인터랙션 디자인의 사례

■ 마우스(mouse)

 화면(screen)이라는 공간을 문자가 아닌 기능(function)으로 간주

 사용자와 화면이 인터랙션할 수 있는 도구를 디자인

 

■ GUI Graphical User Interface)

 시각적으로 제시되는 요소를 이용

 WIMP(Windows창, Icons아이콘, Menus메뉴, Point Devices포인)

 Windows 운영체제, Mac OS 등의 기본 철학

 

■ 기타

 닌텐도 위(Wii)의 모션 플러스

 소니 플레이스테이션의 MOVE 컨트롤러

 X박스의 키넥트(Kinect) 등

 

 

2. 인터페이스 사례

■ NUI 제품의 사례

 Apple사의 아이폰(iPhone)

 MicroSoft사의 서피스 컴퓨팅(Surface computing)

 Google사의 구글 글래스(Google glass)

 

■ 미래 인터페이스 기술(MicroSoft사)

*라이트 스페이스 : 손동작을 이용한 인터페이스

*옴니터치 : 빛이 비춰지는 곳에 인터페이스가 나옴. 

*키넥트 : 사람의 모습을 복제, 다양한 핸드제스쳐 인식

 

 

 

학습정리

1. 인터랙션

• 인터랙션: 사람과 사람 뿐만 아니라 사람과 인공 매체 간의 상호작용도 포함하는 개념
• 웹의 시대가 변화하면서 공급자는 플랫폼을 제공하고 사용자가 콘텐츠를 제작하는 시대에 돌입
• 인터랙션 디자인이란, 대화형 시스템에서 상호작용을 위한 디자인이며, 커뮤니케이션(소통) 뿐만 아니라 구조와 동작(행동)까지도 전달하는 것을 목적으로 함

2. 인터페이스

• 인터페이스: 분리된 서로 다른 두 환경 사이에서 의사소통을 위하여 발생하는 공간
• 인터랙션 디자인과 인터페이스 디자인은 서로 구분하여야 함
• 사용자 경험(UX): 사용자가 인터페이스를 이용하며 느끼고 생각하게 되는 총체적 경험
• 인간과 컴퓨터 상호작용(HCI): 인간이 컴퓨터를 좀더 쉽고 유용하게 사용함으로써 인간과 컴퓨터 간의 상호작용을 개선하는 것을 목적으로 하는 학문
• 다양한 생체인식 인터페이스를 통하여 사용성을 극대화하고 사용자 경험을 향상시킬 수 있음