Intro to HCI Design 과목 정리

유학 두번째 쿼터가 오늘 시작되었다. 15~6주짜리 학기가 아닌 10주짜리 쿼터제이기 때문에 정말 정신없이 한 쿼터가 지나버린 것 같다. 내가 지난 쿼터에 한 것들을 되돌아볼 겸 과목별로 간략하게 정리해 보았다.

우선 CS147 – Intro to HCI Design 과목이다. 이 과목은 150명 가량의 학생이 수강했던 대형과목으로, HCI Design Process 에 대해 배우고 또 직접 쿼터 프로젝트를 통해 경험해 보는 것이 핵심이다. Design Process 라는 것이 명확히 정해져 있는 것은 아니지만 이 과목에서는 과정 중에서도 Prototyping 을 굉장히 강조한다. 반복적인 Prototyping 을 통해 프로세스의 초기부터 큰 그림을 놓치지 않으면서 피드백을 통해 지속적인 발전을 꾀하는 것이 핵심이다.

수업은 매주 50분짜리 강의 두번과 한번의 Studio 세션으로 구성되었다. 강의는 말그대로 교수님이 슬라이드를 띄워놓고 날마다 HCI 와 관련된 다양한 주제들에 대해 이야기하는 식이었다. 다만 슬라이드에는 설명이나 텍스트가 거의 없고 그림과 비디오가 대부분이다. 또한 이론에 대한 설명보다는 학생들의 토론이 주가 되었다. 150명 수업에서 토론이 가능할 것이라고는 생각하지 못했는데, 학생들이 매우 적극적으로 의견을 발표하는 것이 한국과는 다른 점이었다. 이론에 대한 보충은 수업마다 제공되는 Reading 을 통해 이루어졌다. 보통 한 강의마다 50쪽 가량의 Reading을 해야 했고, Reading 의 내용이 중간고사에 출제되었다.

Studio 는 12명정도의 학생이 매주 한 번씩 모여 그 주의 프로젝트 과제에 대해 발표하고 서로 피드백을 교환하는 시간이었다. 프로젝트는 Food, Remembering, Place 라는 세 개의 넓은 주제 속에서 학생들이 자유성을 발휘해 주제를 정해서 진행하는 방식이었다. 모바일 어플리케이션을 디자인하는 것이었고, 거의 모든 팀이 팀별로 제공하는 Nokia 의 N95 또는 개발속도가 빠른 iPhone 을 사용했다. 3인 1조.

우리 조는 Instant Food Messnger 를 주제로 주위의 친구들과 30분, 1시간 이내의 식사약속을 잡을 수 있게 도와주는 서비스를 디자인했다. 과정에 대해 간단히 정리해 보았다.

1. Inspirational Design: What are inspirations?

image 

주위의 사물이나 서비스 중에서 프로젝트에 영감을 줄 수 있는 디자인을 찾아본다. 우리의 경우 빠른 속도를 부각시킨 FedEx 나 컵라면 등에서 영감을 얻었다.

2. Discovery : What do people need?

image

휴대폰 사용자를 대상으로 사용행태를 관찰하면서 잠재적인 니즈를 찾아낸다. 관찰 결과 우리는 여러 친구들이 모여 식사를 할 때 연락하는 사람이 반복적으로 전화를 걸거나 문자를 보내야 하는 상황, 또 위치를 모르는 친구들에게 위치를 매번 설명해야 하는 상황에 개선의 니즈가 있음을 확인했다.

3. Storyboard: When do we need FoodEx?

IMG_0002 IMG_0003

두번째 단계에서 발견한 니즈를 구체적인 사용 시나리오로 연결시켜 본다. 만화를 그려서 실제 상황에서 우리 서비스가 어떻게 사용될 수 있는지를 자연스러운 스토리로 만들어 보는 것이다. 이 과정을 통해 서비스가 제공해야 할 요소들을 뽑아내고 사용의 흐름을 설계할 수 있다.

4. Paper Prototype: What will FoodEx look like?

image

만들어 본 가상 스토리를 토대로 실제 서비스의 형태를 디자인한다. 다만 컴퓨터를 사용하지 않고 종이를 가지고 오리고 붙여 Paper Prototype 을 만든다. 위의 사진처럼 휴대폰 틀을 만들어서 바닥의 여러 스크린을 이동해 가면서 실제 서비스와 유사한 느낌을 줄 수 있다. 컴퓨터를 사용하지 않기 때문에 특정 도구에 의존하지 않으면서 보다 유연한 설계를 할 수 있다.

5. Video Prototype: What is the context of use?

image

http://www.mcpanic.com/2008/10/31/why-dont-you-foodex/ 포스팅에 실제 비디오 클립을 링크해 두었다. 실제 비디오를 촬영하여 우리 서비스가 유용하게 사용되는 상황을 묘사한다. 이를 보는 사람에게 서비스의 유용성을 설득을 할 수 있어야 한다. 무엇을 강조할 것인가, 또 어떻게 강조할 것인가에 대한 고민을 많이 했다.

6. Functional Prototype: How is it designed?

image

이제 실제 구현이다. Flash 와 ActionScript 를 가지고 구현을 했고, 사용자가 만드는 이벤트 별로 데이터를 저장하고 또 자동 문자전송을 지원하기 위해 PHP 와 MySQL 로 서버 부분을 작성했다. Google Map 도 연동해서 사용자가 이벤트 위치를 찾는 데에 도움이 되도록 했다. 우리 조가 가장 빛났던 부분인데, 디자인 과정에 초점이 있는 과목이라서 실제 구현을 제대로 하지 않은 조가 많았던 반면에 우리 조는 모든 기능을 실제로 구현했다. 데모를 보여줄 때 사람들의 반응이 뿌듯했더랬다.

7. User Test: What do users think?

image

이제 완성된 서비스를 사용자들이 직접 테스트해보면서 피드백을 준다. 이를 위해 사전, 사후 설문과 핸드폰 사용 방법 소개, 그리고 다양한 측정 및 기록을 했다. 5명 가량의 사용자 테스트를 통해 혼란을 줄이고 사용이 보다 편하도록 부분적인 수정을 했다. 설계자와 사용자의 간극을 느낄 수 있는 의미있는 시간이었다.

8. 1-Minute Presentation

FoodEx

이제 완성된 서비스를 세상에 내놓을 시간이다. 최종 발표는 위의 1페이지짜리 슬라이드를 띄워놓고 1분동안 서비스에 대해 소개하는 1-minute madness 형식으로 진행됐다. 수업에 스폰서를 한 어도비와 노키아, 그리고 다른 교수들과 학생, 실리콘밸리의 다양한 외부인사들이 구경을 와서 200명 가량의 관중이 모인 앞에서 발표를 했다.

photo

완연한 축제 분위기 속에서 각 조는 창의적인 방법으로 1분동안 관중들의 관심을 구애한다. 연극을 하기도 하고 춤을 추기도 하고 감동적인 연설을 하기도 하고… 확실히 유머코드가 우리나라와는 좀 다르다; 그런 리스크 때문에 우리 조는 획기적인 방법보다는 정공법을 택해서 무난하게 했다. 1분 중에 내 분량이 30초 정도 됐었는데, 대사가 잘 외워지지도 않는데다 떨려서 죽는 줄 알았다.

9. Poster Session

poster_session1 poster_session2

1-minute madness 가 끝나고 각 조는 전시장소로 이동하여 서비스 디자인 과정과 핵심 요소를 담은 포스터를 전시한다. 관객들은 전시회처럼 포스터들을 오가며 질문도 하고 아이디어 교환도 한다. 이런 자리에서 의외의 인턴십 제의를 받거나실제 고용이 되는 경우도 심심치 않게 발생한다고 한다. 우리 조 포스터는 생각보다 깔끔하게 잘 나와서 많은 칭찬을 받았다는 ㅋㅋ

이렇게 해서 10주간의 대장정이 마무리되었다. 많은 시간과 노력을 들였던만큼 얻은 것도 많은 수업이었다. 단순히 서비스를 설계하고 구현하는 것이 아니라 그 아이디어를 시각적으로 설득력있게 구성해서 만화, 비디오, 실제 데모, 포스터, 1분발표 등의 다양한 형태로 present 하는 과정이 인상적이었다. HCI 디자인 과정은 결국 밀실에 갇혀있다가 출시일에야 모든 것을 공개하는 폐쇄적이고 직선적인 과정이 아니라 rapid prototyping & iterative feedback 을 기반으로 끊임없이 세상과 사용자와 소통함으로써 보다 매력적인 과정으로 진화하는 역동적인 것이 아닐까.

Author: mcpanic

어떻게 하면 보다 사람냄새 나는 기술을 만들 수 있을까 고민하는 Human-Computer Interaction (HCI) 연구자 / 컴퓨터과학자 / 새내기 조교수