brunch

You can make anything
by writing

C.S.Lewis

by Niboos May 12. 2017

게임 UI 개발 속의 프로토타이핑툴

무엇을 어떻게 써야할까?

그 동안 실무를 하면서 게임 UI 개발 환경 속에서 나름 프로토타이핑툴 활용에 대한 고민들을 해왔다.

invision부터 framer까지 low-fi에서 hi-fi툴 전반적으로 조금 씩 사용해보고, 활용의 여지에 대한 그 동안 해왔던 생각들을 이 글에 정리해보았다.


고민을 하면서 두가지 기준을 세웠다.

1. 프로토타이핑을 위한 프로토타이핑이 되면 안된다. (비효율성의 문제)
2. 어떤 상황에서 어떤식으로 사용할 것인가? (사용에 대한 명확한 목적)

새로운 툴을 써보고 싶은 개인적인 욕구는 있었지만, 실무에서는 결국 효율성이 중요했기에 위와 같은 두가지 기준을 정한 것이다. 

각 툴들의 특성을 가진 기능들에 환호했고, 특히 framer 같은 경우에는 개인적으로 큰 흥미와 재미를 느꼈지만 앞에서 정했던 기준 덕분에 '과연 우리 환경(게임 개발)에선 효율적인가?'에 대해 냉정히 생각할 수 있었다.






어디서 무엇을 어떻게 쓰는 것이 좋을까?

게임 개발 환경에선 프로토타이핑 툴은 자신이 어떤 조직에 속했는지에 따라 활용의 방식이 크게 달라지는 것 같다.



1. 프로젝트 내부 개발팀일 경우 

게임 개발팀의 UI디자이너 일 경우, 서비스 앱 같이 개발자의 구현 작업을 위해 디자이너가 인터랙션 모션 가이드를 위한 프로토타이핑은 필요없다고 생각한다.  게임 속의 UI 인터랙션 모션 구현 담당은 개발팀 내부의 UI디자이너가 담당하기 때문이다. 모션을 코드로 구현해야 하는 앱/웹과는 달리 게임 쪽은 디자이너가 쉽게 인터랙션 모션을 구현할 수 있는 비주얼라이징된 툴이 있는 환경에서 작업한다. 


때문에 이런 경우 디자이너가 hi-fi 프로토타이핑툴을 이용하여 디테일한 모션작업을 한다면 다시 UI 개발툴에서 구현을 위한 작업을 또 해야하기 때문에 두번 작업하게 된다.(어짜피 작업해야 한다면 해당 ui개발툴로 만들어보는 것이 효율적이다. 하지만 ui개발툴로는 공수가 크고 자신이 다른 툴에 매우 숙달되어 있어 최소한의 시간으로 작업이 가능하다면 말은 달라진다.) 

이 경우는 설계 과정에서 기획자와 엔지니어와의 커뮤니케이션을 위한 프로토타이핑이 적합하다. 화면 설계 과정에서 와이어프레임이나 제작된 시안으로 빠르게 프로토타이핑을 할 수 있는 low-fi 툴이 적합하다. 이에 적합한 대표적인 툴로 인비전(invision)이 있다.


때때로 몇몇 화면의 인터랙션의 경우 ui 구조상 모션을 구현하기 위해 엔지니어의 도움이 필요한 경우가 있다. 이럴 때 mid-fi / hi-fi를 활용 할 수도 있지만 무조건적이지는 않다. 그 때 상황과 조건을 고려해 툴을 선택하는 것이 좋다. 오히러 에펙 같은 영상툴로 빠르게 영상으로 보여주는 것이 효율적일 때도 많다. (ex. 영상을 보고 엔지니어가 구조를 제작해주면 디테일한 부분은 디자이너가 작업 가능한 경우)




2. 개발팀을 서포트하거나 제안하는 내부 UX팀일 경우

규모가 큰 기업에는 UX실이 따로 존재하는 곳이 있다. 이런 곳은 개발실에 속하지 않고 회사 내부 개발실에 대한 UX/UI 관련 자문, 솔루션 제안, 사용자 리서치 등 UX 관련 컨설팅 업무를 주로 한다.

전해들은 바로는 직접 개발에 참여하지는 않기에 산출물들이 제안서나 프로토타입인 경우가 많다고 한다.

실제 개발된 상황에 가깝게 보여지기 위해 디테일한 작업이 가능한 hi-fi 프로토타이핑 툴도 많이 활용한다. 여기서 나온 산출물로 각 개발실에 제안도 하고, 선행 작업을 통한 UT도 진행하기 때문이다.

앞 경우와 마찬가지로 상황과 조건에 맞게 커뮤니케이션을 위해서 또는 제안을 위한 구현을 위한 산출물을 위해서 low-fi부터 hi-fi까지 프로토타이핑 툴을 다양하게 활용한다고 한다. 

이런 환경에선 다양한 툴을 사용 할 줄 안다면 프로젝트에서 담당하는 파트에 효율적인 시너지를 낼 수 있을 것 같을 것 같다.






프로토타이핑툴들을 공부하면서 느낀 것은 잘못된 방향으로 몰입하다간 배보다 배꼽이 더 큰 상황이 생각보다 쉽게 올 수 있다는 것이다.

원성준님의 '회사에서 티 나게 딴짓하기'를 읽어보면 프로젝트를 하면서 프로토타이핑을 위해 작업하는 상황과 프로젝트의 성향을 먼저 고려하고 거기에 맞는 툴과 언어를 찾고, 작업들을 하셨다. (매 글마다 무엇을 어떻게 보여주는 것이 효율적이었기에 이런 툴을 선택했다고 적어주셨다. 파워포인트부터 안드로이드 개발 언어까지 다양하게..)


툴을 따라가는 것이 아니라 해당 프로젝트에 효율적으로 쓸 수 있는 툴이나 방법을 선택하는 것이 올바르다고 생각한다. 





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