brunch

You can make anything
by writing

C.S.Lewis

by 송민승 Oct 28. 2016

페이스북 오리가미 소개/사용기


오리가미는 페이스북 내부에서 개발한 디자인 프로토타입 툴이다. 

이미 여러 디자이너들을 통해 알려진 대로, 인스타그램, 페이퍼, 메신저 등 최근 릴리즈 된 거의 모든 페이스북의 제품들은 디자인 단계에서 오리가미를 주요 프로토타입 툴로 사용하고 있다. 

와츠앱팀에서 일하게 된 후 6개월째 거의 매일 사용하고 있기 때문에, 먼저 간단한 소개/사용기를 남긴다. 




1. 쉽다. 적응이 필요하지만.


페이스북 입사 후 x시간 정도 교육 시간이 있는데, 이를 이수만 해도, 간단한 앱은 만들 수 있을 정도로 구성이 간단한 편이다. 다만, 레이어 구성이나, 트렌지션을 만들어가는 과정과 접근법이 기존 프로토타입 툴들과 다르기 때문에 자체 UI를 적응하는 데는 어느 정도 시간이 필요하다. 


오리가미 작업 화면. 좌측에는 미리보기가, 우측에는 각종 효과를 세팅하는 툴바가 자리잡고 있다.




2. 코드 프리. 하지만 거의 실제와 비슷한 퀄리티.


코드를 하나도 몰라도 실제 제품과 거의 유사한 프로토 타입을 만들 수 있다. 특히 iOS에서 보이는 바운싱 효과라던가, 화면 전환류의 모션들이 기존 코드 프리 툴들과는 비교할 수 없을 정도로 정교하게 컨트롤/구현 가능하다. 피드백을 위해 폰을 들고 다니며 오리가미로 만든 프로토타입을 보여줄 때면 (미리 이야기하지 않은 경우 대부분) 코딩이 완료된 제품으로 착각할 정도이다. 


가운데 선으로 연결하는듯한 UI가 주요 인터렉션을 설정하는 작업 공간이다.  기존툴보다 더 다양한 인터렉션 라이브러리를 제공하며, 꽤나 정교하게 컨트롤 가능하다. 




3. 빠르다. 하지만.


전체적으로 정말 쉽고 빠르게 실제와 유사한 프로토타입을 만들 수 있는 건 분명하다. 하지만  Framer 같이 실제 코드를 사용하는 툴과 비교할때 (필요에 따라) 반복/단순 작업을 피할 수없다는 단점이 있다. 이는 코드 프리 툴의 어쩔 수 없는 운명? 이기도 하다. 이미 Framer를 다루는 분이라면 서로 보완하며 사용할만하다. 




4. 실시간. 그리고 확장성. 


모든 인터렉션이 실시간으로 프리뷰 된다. 작업하는 맥 상에서, 혹은 연결해논 폰을 통해 바로 확인하며 작업 가능하다. 테스트하는 장면을 바로 고화질로 녹화해 공유하기도 쉽다. 기존에는 오래된 Quartz Composer를 기반으로, 셋업을 하기 위해 개발자용 Apple ID가 필요하는 등, 접근성 / 확장성이 낮았으나, 이번 공개된 오리가미 스튜디오는 자체 앱으로 기존의 단점들이 모두 사라졌다고 볼 수 있다. 앞으로가 더 기대되는 툴이다. 


실시간으로 바로 결과를 테스트 해볼 수 있다. 다양한 해상도에 맞는 디바이스 커버를 제공해서 실제감이 높다. 물론 오리가미 앱을 다운받아서 디바이스에서도 확인 할 수 있다. 




5. 공짜. 진짜다. 


페이스북의 모든 제품이 그렇듯! 오리가미도 공짜?로 공개되었다. 이는 많은 이들이 사용/소통하게 하자는 회사의 기본 방침을 따른 것이라 생각된다. 공짜 점심은 없다라지만..






일주일에 한 개씩 새로운 프로토타입 툴이 나온다라는 농담을 할 정도로,  프로토 타입 도구들의 홍수 시대이다. 어떤 툴도 아직은 완벽하지 않다. 하지만 오리가미는 이미 우리가 많이 쓰고 있는 제품들의 테스트용으로 수십 개월간 다듬어져 온 툴인만큼, 상당히 잘만들어지고, 검증된 도구라고 생각된다. 새로운 프로토 타입 툴을 경험하고 싶어 하는 분이라면 며칠 정도 끄적거려 보시기를 추천한다.


페이스북 오리가미 다운로드는 여기 

튜토리얼은 여기 











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