Quartz Composer를 위한 Origami 소개
원문: https://medium.com/the-year-of-the-looking-glass/f1173d0bd181
아래는 발번역.
FB이 오리가미를 소개했음.
보다 디자이너들이 쉽게 인터랙티브 프로토타입을 만들 수 있도록 쿼즈컴포저를 위한 패치 툴킷과 사례들을 소개하였음
업무를 함에 있어 적절한 디자인툴에 시간을 투자하는 것이 중요할 수 있음.
챗해드와 페북홈을 디자인하는데 쿼즈 컴포저를 사용하였다는 것을 알았으나
흥미로워 보이는 쿼즈 컴포저는 러닝커브가 다소 있어보였음.
우리의 대부분은 어떻게 차를 운전하는지 누군가가 알려주지 않는 상황에서 알아내는건 어려울 수 있다.
이는 쿼즈컴포저도 마찬가지이다.
다행이도 우리는 페북에 브랜든이라는 사람이 있다. 하지만 우리가 기술을 아직 복제하는 것을 이해하지 않는 이상 브랜든은 도전적이 될 것으로 보인다.
여전히 우리는 우리가 배우고 만든 패치, 수정, 문서들을 가져가기를 원하가ㅗ 그것들을 디자인 커뮤니티에 공유하기를 원한다. 우리는 미래에 지속적으로 이 툴이 향상되기를 바란다.
만일 당신이 휴가에 시간이 있다면 오리가미를 체크해보아라.
우리는 페북그룹을 통해 피드백 받는것을 좋아한다.
왜 인터랙티브한 프로토타이핑이 중요할까?
디자이닝 프로세스는 마지막 프로덕트를 반영해야만 한다.
만일 포스터를 디자인하는 중이라면 정적인 캔버스위에 작업하는 것은 말이 된다.
하지만 우리는 계속계속 인터랙션을 위한 디자인을 하는데 우리의 시간을 소비한다.
우리는 스와이프, 프링, 탭, 그리고 프레스와 같은 모바일, 태블릿 UI를 창조해냈다.
우리는 단지 보고 포인팅하고 클리킹하는 것을 넘어서 세상을 디자인하고 있다 하지만 느낌과 조작의 범주안에 들어오게 되었다.
당신은 물질에 대한 생각없이, 어떻게 어떤 것이 손안에서 느껴지는지 혹은 그 환경에서 반응하는지에 대한 것 없이 물리적인 사물을 디자인해낼 수 없다.
이는 앱을 디자인하는 것과도 같다.
코드를 가지고 디자인하는 사람들을 위해 이는 마지막 프로덕트의 중간단계를 바로 작동할 수 있게 해주는 큰 장점이 있다.
하지만 코드를 배우는 것은 큰 배리어가 될 수 있고 심지어 만일 당신이 어떻게 하는지 알더라도 그것은 디자인하는데 효율적인 방법이 아닐 수도 있다.
이는 다가오는 더나은 디자인 툴에 투자하는 것이라고 할 수도 있겠다.
쿼즈 콤포저는 무엇인가?
쿼즈 콤퍼저는 맥을 위한 앱이고 이는 코드를 짜는 것이 아닌 선을 연결함으로써 모션 그래픽들의 조합을 만들어 낼 수 있다. 어떤 사람은 이를 비주얼 프로그래밍 언어라고 한다. 당신은 스크린 상에 다른 패치들을 위치시키고, 몇몇 패치들은 인풋 혹은 아웃풋을 취한다. 그리고 합성을 만들어내기 위해 커넥터들을 다른 패치들과 연결할 수 있다.
어떻게 쿼즈 콤포저가 기술적으로 설명하는 것 보다 더 쉽게 보여지는 이유이다.
사례들을 한번 살펴보시길.
어떻게 쿼즈 콤포저는 다른 인터랙티브한 프로토타이핑과 비교가 되는가?
오늘날 프로토타입을 위해 사용되는 공동적인 방법들이 있다.
1. 라이트웨이브, framer.js와 같은 프로토타이핑 라이브러리를 단순화한.
2. 애펙이나 플래시 같은 모션그래픽 어플리케이션
3. 어플리케이션 코드 짜기 (오브젝트C, 혹은 자바)
장점
1. 쿼즈 콤포저는 에펙과 같은 타임베이스라기 보다는 스테이트 베이스이다.
이는 사용자들이 버튼을 누를 수 있고 버튼을 떼면 어떤 것이 일어나고 변화가 일어나게 된다는 것.
2. 쿼즈 콤포저로써 프로토타이핑은 빠르다.
혼합된 것을 변화할 수 있음. 프로토에서 효과를 얻기 위해 기다리거나 다시 컴파틸할 필요없음.
이는 컴파일, 빌드해야 하는 동안 기다리거나 브라우저 리프래쉬를 해야할 필요가 없다는 장점.
또한 누군가가 쿼즈컴포저에서 잘 만들어놓은걸 함께 던져넣을 수 있음.
3. 쿼즈 콤포저 혼합은 자신이 직접 제작한다고 느껴질 수 있고 따라서 코드를읽는 것보다는 이해하는 것이 더 쉽다.
이는 파라메터와 아웃풋이 즉각적으로 스크린상에 명백하게 나타나기 때문.
4. 쿼즈 콤포저는 파워풀하다. 이는 오픈 GL로 만들어져 있고 맥과 iOS앱에서 그래픽으로 강한 기술이다.
따라서 당신은 다른 툴로는 불가한, 어려운 것들을 디자인할 수 있다.
예를 들면 라이팅, 메쉬, 리플 등.
단점
1. 쿼즈 콤포저는 문서화 하기 매우불편하다.
프로토를 하기 위한 많은 툴과 리소스가 있지 않음.
2. 앱이 오류투성이이다. 일상적으로 하루에도 몇번씩 크래쉬가 난다.
3. 쿼즈 컴포저는 모션 비디오 그래픽을 위한 것이지 디자인프로토타이핑 툴이 아니다.
마음속의 디자인 프로토타이핑 맥락으로 디자인되어지지 않는다.
정확히 오리가미는 무엇인가요?
오리가미는 많은 공통적인 디자인 패턴들과 인터랙션들을 가지고 있는 간단한 시작 패치들의 무료 셋이다.
오리가미는 또한 패치들의 기능들을 시연하기 위한 사례들의 콤포지션들로 부터 이루어진다.
쿼즈 콤포저와 오리가미들로 무엇을 만들어낼 수 있나요?
쿼즈 콤포저와 오리가미 내 제공된 패치들을 사용함으로써 아래와 같은 것들을 쉬게 할 수 있다.
1. 디바이스 템플릿안에 디자인이미지를 드래그할 수 있고 디바이스 내에서 스코롤 가능하게끔 할 수 있다.
2. 스크린 내에 액션이 일어나게 할 수 있는 마우스 인풋과 키보드 커맨드를 쉽게 만들 수 있음.
3. 슬라이딩 pane들과 drawer들과 같은 일반적인 애니매이션들을 실행시킬 수 있음.
업데이트는 계속할 예정인가요?
ㅇㅇ, 보다 많은 사례들, 패치들, 문서들과 비디오들을 제공할 예정이다.
우리는 어떤 업데이트들도 약속할 수는 없지만 우리는 최선을 다할 것이다.
그러는 동안, 만일 함께하길 원한다면 Facebook group에 들어와서 함께 하자.
Drew Hamlin - 많은 패치들에 대한 권한을 가지고 있고 무료료 공개적으로 작업들을 공개하고 있음
Brandon Walkin/Brian Frick - QC를 수정하고 보다 나은 형태의 작업물을 만들기 위해 노력
Austin Bales/Mike Matas, Mac Tyler - 다양한 피드백 등이 필요하다면.
그리고 오리가미를 통해 멋진걸 만들어냈다면 공유해주시길. :)