brunch

You can make anything
by writing

C.S.Lewis

by 이진재 Nov 13. 2018

아두이노와 프로세싱으로
방 탈출 경험을 디자인하다

스웨덴 디자인 스쿨 하이퍼 아일랜드 유학 이야기 #15

피지컬 컴퓨팅 워크숍


팀 구성에 앞서 아티스트 요나스가 진행하는 피지컬 컴퓨팅 워크샵이 있었다. 피지컬 컴퓨팅은 아날로그 신호를 감지하고, 반응할 수 있는 소프트웨어와 하드웨어를 사용해 인터랙티브(interactive) 시스템을 구축하는 것으로, 말만 들으면 어렵고 복잡하게 느껴질 수도 있지만, 사실은 작은 컴퓨터와 간단한 코드를 이용해 사용자가 직접 만지고 눌러보며 상호작용할 수 있는 무언가를 만드는 직관적인 일이다. 


워크샵은 피지컬 컴퓨팅에 자주 사용되는 미니컴퓨터 아두이노 Arduino 위주로 진행되었다. 이번 수업의 핵심은 컴퓨터 입력과 출력 개념을 이해하는 것으로, 아두이노에 거리, 온도, 가속, 위치, 버튼, 목소리, 터치를 인식하는 센서를 연결해 받은 신호를 가지고 스크린에 단어를 보여주거나, LED에 불을 켜고 끄거나, 모터를 돌아가게 만드는 방법을 배웠다.


하루는 머신러닝 워크샵이 있었다. 머신러닝의 원리를 이해할 필요 없이 위키네이터 Wekinator라는 프로그램으로 사용자 입력을 학습시키고, 프로세싱*과 연동해 시각적으로 표현하는 방법을 배웠다. 머신러닝이 주었던 처음 부담감과 달리 쉽고 간단해서 누구나 따라 할 수 있었다.




Team CLO:CK:ED:IN


2주 차 월요일, 학교에 도착하니 팀이 정해져 있었다. 나를 포함해 크리스티나, 안나 O와 안나 K, 바바라, 존, 빅토리아로 구성된 팀으로, 한국, 스웨덴, 러시아, 네덜란드, 브라질 출신이 모였다. 이번 프로젝트는 기간도 짧고 해야 할 일도 분명했기 때문에, 백 마디 말보다는 직접 만들어 행동으로 보여주기로 했다. 이번에는 개인 목표도 각자 정했는데, 나는 너무 진지하게 생각하지 말고 즐겁게 일하면서 프로세싱 실력을 키워 보기로 했다.


나는 코드도 어느 정도 작성할 줄 알고, 피지컬 컴퓨팅을 해 본 경험도 있기 때문에, 아이디어가 실현 가능한지 확인하고, 기술적인 문제를 해결하는 테크니컬 매니저를 맡았다. 그 외에 프로젝트 매니저, 아트 디렉터, 경험 디자이너로 역할을 나누었다. 8월 초부터 한 주도 못 쉬고 16주째 달리다 보니 다들 피곤한 눈치다. 왜 한 학기가 16주인지 이제 알 것 같다. 하지만 다행히 우리 팀은 차분하고 서로 배려할 줄 아는 사람들이 모여서 큰 어려움은 없었다.



셜록드의 경험 디자인 원칙


셜록드의 빅터 Victor van Doorn와 핌 Pim Schachtschabel은 방 탈출 경험 디자인의 네 가지 원칙을 알려주었다. 우선, 스토리. 잘 짜인 스토리는 체험자가 경험을 하는 이유를 이해하게 하고, 스토리에 자신을 직접 투영하여 경험에 몰입할 수 있게 만들어준다. 스토리의 구성 요소로는 크게 세 가지가 있는데, 경험 목표, 목표 해결에 방해를 주는 장애물, 그리고 목표 달성에 따른 보상으로 나눌 수 있다.


두 번째는, 흐름. 경험 디자인에도 기승전결과 클라이맥스가 있어야 한다. 그리고 시각적 요소는 물론 시간, 소리, 조명 등을 조합하여 목표하고자 하는 분위기를 조성해야 한다. 또한, 경험 목표의 난이도도 중요한데, 너무 어려워 쉽게 좌절해서도 안 되고, 너무 쉬워서 지루해도 안 된다. 체험자가 이야기에 자연스럽게 몰입하고, 해결 과정 내내 즐길 수 있도록 단계적이고 체계적인 설계가 필요하다.


세 번째는, 인터랙션. 여기서 말하는 인터랙션은 체험자가 목표를 달성하기 위해 해결해야 하는 문제라고 생각하면 된다. 이는 크게 두 가지로 나눌 수 있는데, 몸이나 물건을 움직이고 조작하면서 문제를 해결하는 ‘물리적 인터랙션’과 수학 문제나 퍼즐 등 머리를 써서 문제를 해결하는 ‘논리적 인터랙션’이 있다.


네 번째는, 제약사항. 방 탈출 게임마다 제약사항이 조금씩 다른데, 때에 따라 경험을 차별화하는 요소가 되기도 한다. 셜록드는 다른 여러 방 탈출 게임에서 빈번하게 사용되는 공포나 폭력 요소를 배제하고, 자물쇠나 어두운 조명도 사용하지 않았다.




스토리 만들기


시작에 앞서 방 탈출 게임에 관해 더 알아보기 위해 다 같이 시내에 있는 방 탈출 카페에 갔다. 1시간 동안의 체험 동안 우리는 방 탈출 게임의 개념, 시간 배분, 난이도 설정, 방 내부 디자인, 시각과 청각적 요소를 이용한 분위기 조성 방법 등 다양한 인사이트를 얻었다. 비록 15분짜리 비교적 짧은 체험을 만드는 것이지만, 맨땅에 헤딩하려니 만만치가 않았다. 그래서 우리는 첫 스토리 아이디어 회의에서 간단한 원칙을 정했다. ‘클리셰(cliché)에서 벗어나 신선하게 만들기’, ‘이해하기 쉽게 만들기.’ 


아이데이션은 먼저 클리셰를 뒤집고, 부정하고, 확장하는 방법으로 시작했다. 방 탈출 게임하면 생각나는 클리셰를 포스트잇에 적어 한쪽 창문에 가득 붙이고, 왼쪽 창문에는 이를 뒤집은 아이디어, 오른쪽 창문에는 이를 부정하는 아이디어, 반대쪽 벽에는 이를 확장하는 아이디어를 나열했다. 덕분에 우리가 피하고 싶은 클리셰가 무엇인지는 알게 되었으나, 생각보다 적용할 만한 아이디어가 바로 나오지는 않았다.


셜록드의 빅터는 영화 줄거리에서 모티브를 가져오는 것도 좋은 방법이라고 귀띔해주었다. 그래서 우리는 곧 개봉하는 영화 중 ‹신비한 동물들과 그린델왈드의 범죄 Fantastic Beasts: The Crimes of Grindelwald›를 선택했고, 팀 멤버 안나 O는 영화 속 주인공이 들고 다니는 가방 안에 또 다른 세상이 있다는 점에서 영감을 받아, 방 안에 있는 사람과 밖에 있는 사람이 소통하는 과정을 통해 탈출하는 스토리를 만들어보자고 제안했다.


우리는 곧바로 상자를 이용해 가방을 만들고, 핸드폰을 집어넣어 마치 가방 안에 있는 사람과 이야기하는 것 같은 기분을 주는 프로토타입을 만들었다. 피드백을 얻기 위해 인더스트리 리더 요나스와 다른 팀 친구에게 테스트를 진행했다. 아이디어 자체는 재미있으나, 스토리를 직관적으로 이해하기 어렵고, 과정이 너무 복잡하다는 피드백을 주었다. 이를 바탕으로, 우리는 두 공간으로 나누는 아이디어는 살리되 다른 종류의 스토리를 제작해 보기로 결론지었다.


우리는 커피를 마시며 잠시 숨을 돌렸다. 시간도 부족한데 어떡하지. 시간이 더 있으면 좋겠다. 그러던 찰나, 몇몇 눈이 번뜩였다. ‘시간으로 스토리를 만들자! 방 안과 밖의 시간을 다르게 설정하고, 이를 체험자들이 고치게 만들자.’ 아이데이션에 불이 붙기 시작하자, 스토리 완성까지는 하루도 채 걸리지 않았다. 제목은 ‘시간에 갇혔다’는 의미로 CLO:CK:ED:IN으로 정했다. 이어서 완성한 스토리는 다음과 같다.


“전시 준비로 모두 바쁜 12월 어느 날, 우리 팀은 스토리조차 결정하지 못한 채 헤매고 있었다. 시간이 너무 부족했다. 어떻게 할지 고민하다 일단 시간을 더 만들어보기로 했다. 그런데 무언가 잘못되었다. 방 안 시간이 뒤틀렸다. 우리는 이미 한 번 방에 들어갔다 왔기 때문에 다시 오랫동안 들어가 있으면 목숨을 잃을 수도 있다. 하지만 다행히도 우리에게 15분이라는 시간이 허용된다고 한다. 방 안에 들어가 원래 시간으로 되돌려야 한다. 당신만이 이 문제를 해결할 수 있다.”




실제 제작 과정


실제 제작 과정은 스토리 개발보다 순탄하게 흘러갔다. 15분이 그리 넉넉한 시간은 아니었기 때문에 각 인터랙션은 체험자가 쉽게 이해할 수 있도록 원리는 간단하고, 피드백은 정확하게 만들어야 했다. 첫 번째로 숫자 10개가 쓰여 있는 자전거 체인에 자석을 숨겨두고, 체인을 돌려서 자석이 붙는 지점에 적혀 있는 숫자를 찾는 인터랙션을 만들었다. 그다음은, 숨겨진 단서에 적혀있는 숫자에 따라 시계 여섯 개를 돌려 하나의 큰 숫자로 만드는 인터랙션을 제작했다. 


마지막 인터랙션을 만들기 전 셜록드의 중간 리뷰가 있었는데, 빅터는 스토리와 인터랙션을 둘러보더니 스토리는 탄탄하고 쉬워서 좋은데, 공간의 몰입감과 인터랙션 간의 연결이 부자연스럽고, 체험자 두 명이 참여해서 해결하는 인터랙션이 있으면 좋겠다는 피드백을 주었다.


우리는 그의 피드백에 따라 두 사람이 동시에 노브(손잡이)를 돌려서 숨겨진 숫자를 찾는 인터랙션을 추가했다. 먼저 아두이노에 노브 두 개를 연결하고 여기서 받은 노브 위치 값에 따라 이미지가 움직이도록 만들었다. 여기에 맞는 숫자를 찾아 모션 그래픽을 만들었고, 이를 프로세싱으로 옮겼다. 마지막으로는 노브가 손목시계 태엽 꼭지처럼 보이도록 카드보드로 시계를 만들어 방 안에 설치했다.



우리는 크게 세 가지 인터랙션에서 시, 분, 초에 해당하는 숫자를 하나씩 찾아, 방 중앙에 위치한 시계에 그 값을 입력하면 탈출에 성공하는 구조로 인터랙션들을 연결 지었다. 시계 속 바늘이 계속 비정상적인 속도로 움직이다, 체험자가 올바른 숫자를 입력하면 정상 속도로 돌아올 수 있게 아두이노에 모터, 화면, 버튼을 연결해 제작했다.


마지막으로 스토리 몰입감을 더하기 위해 방 안을 시계 내부처럼 보이도록 꾸몄다. 검은 블록을 얼기설기 쌓고, 전선 다발을 여기저기 산발적으로 깔아서 방 안이 마치 고장 난 기계 내부처럼 보이도록 연출했다. 내부 조명은 주황색 셀로판 지로 덮어 적당한 긴장감을 주고, 텅스텐 조명을 추가해 위압감을 더했다. 여기에 프로젝터로 한쪽 벽면에 프로세싱으로 만든 사각형이 계속 빨려 들어가는 것 같은 그래픽을 투사해 시계 안으로 들어가는 듯한 느낌을 주었다. 




전시


정신없는 한 주가 지나고 어느새 전시 당일 아침이 되었다. 방 탈출 게임을 진행하기 위해서는 체험자에게 스토리와 룰을 소개하는 게임 마스터와 방에 있는 인터랙션을 초기화시키는 게임 매니저가 필요했다. 우리는 인원을 반으로 나누어 돌아가면서 4명은 게임 마스터를, 3명은 게임 매니저를 하기로 했다. 이어서 요나스와 빅터가 스튜디오에 있는 모든 방을 돌며 전시 리허설을 진행했다.


오후 1시가 되자 사람들이 하나둘 모이기 시작했다. 처음에는 한가하던 우리 전시장에도 사람들이 줄을 서기 시작했다. 한 팀이 체험하고 나가면 게임 매니저가 들어가서 방을 초기화시키고, 그 사이 게임 마스터는 새로운 팀에게 게임을 설명해주는 식으로 쉴 틈 없이 돌아갔다. 다른 프로그램 학생, 학교 스태프, 친구 등 40여 명 정도가 참여한 우리 전시는 6시가 되어서야 끝이 났다. 셜록드의 빅터는 돌아가기 전 우리 팀 방 탈출 게임이 가장 신선하고 좋았다며 방 안에 들어가서 사진을 찍었다.


전시가 끝나고 뒤풀이 자리에서 요나스로부터 피드백을 받았다. 그는 디지털과 물리적 경험을 자연스럽게 엮기가 쉽지 않은 일인데 다들 잘 해냈고, 이 모듈은 꼭 기술적 측면이 아니어도 경험 디자인에서 각자 본인이 집중하고 싶은 영역을 찾고, 거기에 집중하게 만드는 것이 목표였다고 했다. 우리 팀은 구성원 모두가 전 과정에 참여해 하나의 연결된 경험을 만들어냈다는 점이 인더스트리 리더로서 인상적이었다고 말했다. 그리고 혹시 경험 디자인이나 인터랙션 디자인 쪽으로 일을 찾고 싶다면 자기가 나서서 도와주겠다고 덧붙였다. 뿌듯한 밤이었다.




에필로그


익스피리언스 디자인 모듈은 협업의 즐거움과 놀라움을 알게 해 준 소중한 경험이었다. 좋은 아이디어는 팀원 모두가 참여하고 서로 의견을 주고받는 과정에서 만들어진다는 것을 깨닫게 되었다. 안나 O가 상자로 프로토타입을 만들어 두 공간으로 나누는 실험을 해보지 않았다면, 시계 안에 갇히는 스토리를 만들어 낼 수 없었을 것이고, 크리스티나와 바바라가 방 내부를 시계처럼 보이도록 아트 디렉션을 하지 않았다면, 체험자에게 몰입감을 줄 수도 없었을 것이다. 또, 안나 K가 모션 그래픽을 잡아주지 않았다면 나는 프로세싱으로 어떤 코드를 작성해야 할지 알 수 없었을 것이고, 전시에서 우리 모두 게임 마스터 혹은 게임 매니저가 되어 게임을 운영하지 않았다면 5시간 동안 체험자에게 즐거운 경험을 선사할 수 없었을 것이다. 


또, 당장은 구현 방법을 알지 못하더라도, 어떻게 헤쳐나가야 하는지를 배웠다. 아두이노와 프로세싱을 접한 건 이번이 처음이 아니었지만, 과거에는 문제에 부딪히면 금세 포기하기 일쑤였고, 이내 흥미가 없어져 손을 놓곤 했다. 이번에도 아두이노와 프로세싱으로 코드를 작성하면서 수많은 문제에 부딪혔다. 그러나 이번에는 조금 달랐다. 누군가 이미 같은 문제에 관한 해결 방법을 고민했고, 그 해결책이 인터넷에 공유되어 있다는 것을 알게 되었다. 나는 누군가가 올린 해결책을 한 줄 한 줄 꼼꼼히 살피며 내 문제를 해결하는 데 사용했다.


마지막으로 내가 하고 싶은 일이 무엇인지 조금이나마 알게 되었다. 이번 모듈에서는 아두이노와 센서, 그리고 프로세싱과 연동한 프로젝션 매핑으로 미디어 아트에 근접한 작업을 할 수 있었다. 사용자의 입력에 반응하는 센서에서 신호를 받아 실시간으로 움직이는 그래픽을 코드로 만드는 작업에서 형용하기 어려운 만족감과 성취감을 느꼈다. 아마도 디지털과 물리적 경험을 연결해 사용자에게 새로운 경험 제공하는 인터랙션 디자인은 내가 앞으로도 계속해야 하는 일이 아닐까 싶다.



+

디자인 매거진 CA에 실린 하이퍼 아일랜드의 기록 4부 익스피리언스 디자인 모듈 기사의 일부입니다. 

원고 전문은 CA 2018년 5-6월호에서 확인하실 수 있습니다. 

매거진의 이전글 중고거래 플랫폼, Sellpy의 UX 개선하기 (하)

작품 선택

키워드 선택 0 / 3 0

댓글여부

afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari