ProtoPie 프로토타이핑으로 Dribbbler 되기

Leuo
leuokim
Published in
7 min readAug 27, 2017

Becoming a Dribbbler with ProtoPie prototyping.

근래에 ‘사이드 프로젝트’ 에 대한 개념이 조금씩 서고 나서부터 소소하게라도 평가를 벗어난 내 작업을 해보고 싶다는 생각을 하기 시작했다. 회사 일 아닌 개인작업 경력은 신입이나 마찬가지였던 나의 첫 목표는 ‘드리블러 되기'

사실 내가 이걸 목표로까지 세우게 된 것은 말하기 조금 굴욕적일 정도로 단순한데 초대장이 없으면 개인 작업물을 올릴 수 조차 없는 드리블의 가입 방식 때문이었다. 신입 때부터 하루 수십번을 드나들던 사이트였는데 초대장이 없으면 내 작업을 올릴 수 없다니…거기다 그 사실을 이제야 처음 알게 되다니.. ;ㅅ;

Trying to bag a colleague for a dribbble invitation

내 주변 사람.. 아무도 모르는 사실이었구나. 나만 모른 건 아니군… 흠 하지만 지인이 없으니 모르는 분에게 이미지를 보내서 정정당당하게 어필해야 하겠군.(너무 당연한 것인데 그 때 당시엔 이런 생각을…)

이런 창피한 동기를 떠나 드리블러가 되고자한 다른 이유는 상대적으로 작고 단시간에 작업한 아이디어를 핵심만 주목시켜 보여줄 수 있다는 사실 때문이었다. 개인적으로 인터랙션 프로토타이핑 작업물들이 눈에 많이 들어왔는데 코드와 함께 사용을 한 경우에는 Codepan이나 FramerJS, 애니메이션 이미지 작업은 After Effect나 프로토타이핑 툴인 Principle을 사용한 경우가 많았다.

그렇다면 나에게 적합한 툴은 어떤 것일까 고민하던 중 모바일 트렌드 세미나에서 한국회사가 만든 ProtoPie라는 툴이 있다는 사실을 처음 알게 되었다. 우리나라 사람이 만든 프로토타이핑 소프트웨어가 존재 한다는 것, 디자이너 입장에서 진입장벽이 낮은 쉬운 툴이라는 것에 이끌려 튜토리얼로 사용법을 익히고 작업물을 제작했다.

50 Days of ProtoPie라는 이름을 붙여 영상 캡쳐를 프로토파이 코리아 그룹에 업데이트 하기도 하고 혼자보다는 주변 사람 여럿이 함께하면 좋겠다는 생각으로 사내 스터디그룹을 개설했다.(ing…) 빼도박도 못하게 모든 환경이 세팅된 셈. 그렇게 한 10개 정도의 작업물을 제작했는데 기능 공부용이 아니라 게시까지 가능한 수준의 디자인 작업물은 7개 정도.

My 1st prototyping — Sign in UI concept

작업물을 어느 정도 모았으니 다음 단계는 현재 누가 초대장을 가지고 있는지 알아내는 것이었다. 원래는 dribbbleinvite.co에 가면 공지를 모아서 볼 수 있는데 그 사실을 잘 모르던 나는 dribbble invite를 직접 키워드 검색해 초대자들을 찾았다. 요구하는 기준은 조금씩 달랐지만 평균적으로 3장 이상의 작업물 이미지 외 포트폴리오 유알엘이 필요했다. 개인 사이트는 있었기 때문에 프로토타이핑 작업을 업데이트하고 비헨스도 포함시켜 마치 이력서를 쓰는 기분으로 5명 남짓한 해외 디자이너에게 메일을 보냈다. 한 2,3일쯤 지났을까.. 한 분에게 답장이 왔다. 긍정적인 것 같지만 초대장은 아닌.

계정을 Prospect로 설정해 놓으면 초대를 해주겠다는 내용이었다. Prospect…가 뭐지? 검색을 해서 찾아보니 드리블 계정 가입만 되어 있는 것이 아니라 계정 정보에서 Prospect를 체크해 초대장을 받을 수 있는 상태로 세팅을 해놓는 과정이 필요했다. 그렇게 하면 초대자가 Prospect 목록에서 나를 찾아 초대장을 보내줄 수가 있다. 뒤늦게 세팅 하고 확인 답장을 보냈지만 하루가 지나도 소식이 없는 애매한 상황을 맞이하고 말았다. 성격이 좀 급한 편이라서 결국 10명 정도의 다른 디자이너에게 추가적으로 메일을 보냈다. 다음 날쯤 또 한명의 디자이너에게 메일이 오긴 했는데 내용이 긴 것이…..

마치 회사의 불합격 메일을 받은 것 같은 기분… 하지만 초대장 개수는 한정되어 있고 Candidates가 많기 때문에 답변까지 주지 않는 경우가 대부분이다. 불합격이지만 고마운 이메일이었다. 그래도 다행인 것이 생각보다 일찍 같은 날 저녁 아주 간결하고 쿨한 메일이 하나 도착했다.

독일출신 브랜드 디자이너 한 분이 전혀 연고가 없는 한국에 살고 있는 나에게 초대장을 보내주었다. Aye~30일 동안 받지않으면 파기되어 버리지만 한창 신경을 곤두세우고 있던 내가 받고 있지 않을 리는 만무했고 그렇게 난 첫 소기의 목표인 Dribbbler가 되었다.

드리블은 첫 샷을 올릴 때 그만의 가입방식 때문에 특별한 문화가 존재하는데 초대를 해준 디자이너에게 고마움을 전하는 내용이 담긴 디자인 작업물을 올리는 것.

좀 급하게 작업했지만 튀는 컬러 덕분에 반갑다는 댓글을 생각보다 많이 받았다;; .. 또 한번 Nils Hensel에게 감사의 마음을 표하며.. Nils씨는 마지막까지 조금 시크하게 Welcome이라는 짧은 댓글만을 남겨주셨다. (튀는 컬러 때문이라고 단정지은 것은 이 단촐한 첫 샷만큼 기록이 좋은 작업물이 아직 나오지 않았기 때문에…ㅎ)

사람마다 작업하는 방식이 다를 수 있겠지만 나의 경우에는 스케치로 작업물을 뽑고 프로토파이에서 인터랙션 작업을 하고 프로토파이 플레이어 상에서 구동해보는 장면을 퀵타임플레이어로 캡쳐한 다음 After Effect에서 JPG시퀀스를 뽑아 포토샵에서 다시 Animated GIF로 변환해 올리고 있다. 말로 굉장히 복잡하지만 계속 하다보면 단순한 작업인데 드리블 규격에 맞춰 GIF를 뽑는 작업이 생각보다 시간이 소요되는 편이다. 물론 사이즈는 가이드 대로 800x600 픽셀.

E-book concept prototyping made with ProtoPie
Making an animated dribbble shot with After effect
Completed animated GIF less than 8MB

드리블이라는 서비스가 워낙 노출력이 있다보니 모르는 사이 해외 온라인 사이트에 참고 게시물로 소개되기도 하고 생각지 못한 뿌듯한 일이 일어나기도 했다. 현재는 Muzli에 Featured 되는 그날을 기대하면서 차곡차곡 업데이트 진행중. 소소하게 사이드 프로젝트를 시작해보고 싶다면, 평소 가지고 있던 아이디어를 가지고 해외 디자이너들과 소통해 보고 싶다면 드리블러가 되어보는 것도 괜찮은 시작일 것 같다. 내 작은 작업물이 누군가의 영감이 된다는 것.. 얼마나 가치있는 일인가:)

http://dribbble.com/fluosoup

--

--