[Sketch] 스케치 파일의 레이어를 애프터 이펙트로 Sketch2AE


맥에서 스케치 파일의 레이어를 애프터 이펙트로 옮겨주는 플러그인 Sketch2AE

https://google.github.io/sketch2ae/

이런 훌륭한건 도대체 누가 만드나 봤더니 역시 구글이었다..

디자이너들의 암을 깨끗히 낫게 하여주시는 감사한 존재








1. 다운받아서 스케치 플러그인 설치 - 새로운 파일에 아트보드에 원하는 스케치 레이어 넣고 플러그인 메뉴에서 세이브 






2. jsx 파일을 응용프로그램 내부에 애펙 ScriptUI Panels 폴더에 넣기! - 아까 저장한 sketchae 파일 불러오기

근데 여기서 json parse 에 에러가 뜬다 

........


여러 시도를 해봤는데

안보이게 가려둔 안쓰는 레이어는 다 지우고.. 

텍스트는 왠만하면 create outline (그럼 텍스트 애니메이션은 애펙에서 못해보는건가)


레이어를 한꺼번에 다 옮기는것보다는 그룹별로 따로 옮겨서 콤포지션을 만들고 그걸 합쳐서 하나의 파일로 만드는걸 추천!



-- 

지금 가장 확실한 방법은 텍스트 레이어를 깨는건데

홈페이지 샘플 영상을 보면 텍스트가 그대로 살아있다. 폰트와 텍스트를 영어로 바꾸었는데도 효과 없음

그냥 create outline 이 답인듯 

어차피 bodymovin - lottie 로 가려면 텍스트를 깨서 하는게 낫겠다 싶기도 하다.

아래는 깃허브에 로그인데 이번 버젼에서 따옴표 안에 텍스트 에러나는거랑 빈 오브젝트 에러가 고쳐지긴 했다고 한다




[책] 인터랙션 디자인 Interaction Design


인터랙션 디자인 - UX 프로페셔널 시리즈 1

저자
댄 새퍼 지음
출판사
에이콘출판 | 2008-12-29 출간
카테고리
컴퓨터/IT
책소개
제품과 서비스가 사용자에게 어떤 가치를 줄 수 있는지, 이젠 '...
가격비교




31     디자이너들의 디자인 접근 방법
- 사용자에게 집중한다 : 디자이너들은 사용자들이 제품이 어떻게 만들어졌는지 이해하지도 못하고 신경쓰지도 않는 사실을 잘 알고 있다. 사용자들은 자신의 업무와 목표를 해당 제품의 한계 내에서 달성할 수 있는지에만 신경 쓴다. 디자이너는 최종 사용자의 대변인이다.
- 대안을 찾는다 : 디자인은 다양한 옵션 중 하나를 선택하는 것이 아니라 선택지를 새로 만들어내고, 두 개의 적당한 옵션 중 하나를 고르는 것이 아니라 세 번째 옵션을 선택하는 일이다. 다양한 가능성을 창조해내는 것이야말로 디자이너들을 다른 사람들과 차별화하는 요소다.
- 모델링과 프로토타이핑을 이용한다 : 디자이너들은 브레인스토밍을 통해, 또한 가장 중요하게는 해답을 테스트해볼 수 있는 모델을 실제로 만들어봄으로써 해답을 찾는다. 물론 과학자나 건축가, 심지어는 회계사도 모델을 만들지만 다른 분야의 모델과는 달리 디자인 프로토타입은 확정된 것이 아니다. 어떤 특정한 프로토타입도 해답 그 자체를 만들어낼 필요는 없다. 이는 단지 많은 해답 중 하나일 뿐이고 하나의 제품에 들어맞는 다양한 프로토타입을 만드는 건 드문 일이 아니다.
- 협력하고 제한을 설정한다 : 혼자 일하는 디자이너는 거의 없다. 일반적으로 자신이 상상하는 물건을 만들어내기 위해 (돈, 재료, 제작자, 프린터 등 )다양한 자원이 필요하며 이런 자원을 공동으로 소유한다. 그들은 제품의 목표, 팀원과의 협조, 그리고 마감 기한을 설정한다. 디자인은 대부분 팀워크의 결과물이다.
- 적절한 해답을 만들어낸다 : 대부분 디자이너들은 특정 시간에 사용되는 특정 프로젝트를 충족시키기 위한 해답을 만들어낼 뿐이다. 물론 한 프로젝트에서 얻어진 경험과 지혜가 다른 프로젝트에 적용될 수도 있지만, 결국 궁극적인 해답은 해당 문제와 상황에만 맞을 뿐이다. 물론 이들이 얻은 해답(제품)이 다른 상황에서 사용할 수 없는건 아니지만 그대로 복제될 수는 없다. 디자인은 상황을 만족시켜야만 한다.
- 다양한 분야의 영향을 받는다 : 디자인은 심리학, 인간 공학, 경제학, 기계공학, 건축학, 예술 등의 대단히 많은 분야에 맞닿아 있으므로 영감을 얻고 해답을 찾으려면 이런 다양한 분야의 아이디어를 차용한다.
- 감성을 섞는다 : 분석적인 사고에서 감성이란, 논리와 올바른 해답을 선택하는 일을 방해한다고 여겨진다. 감성적인 구성요소가 결여된 디자인은 생명력이 없고 사람과 연결되지 못한다. 감성은 디자인 결정에 사려깊게 추가되어야 한다.

41     인터랙션 디자이너가 인터랙티브하지 않은 도구에서 무얼 배울 수 있을까요?
인터렉션 디자이너가 도구 하나의 사용을 관찰하는 것은 대화를 관찰하는 일과 똑같다고 생각한다. 모든 것에는 어쨌든 입력과 출력이 있으며, 이런 관점에서 ‘인터랙티브’와 ‘인터랙티브 하지 않은’ 도구 간의 경계는 사라져야할 것 같다.
인터랙션 디자인이란 사람들이 어떤 사물과 이벤트를 어떻게 받아들이는지 그 의미에 대한 것이며, 사람들이 자신의 의미를 어떻게 표현하는지에 대한 것이기도 하다. 그러므로 그 도구가 인터랙티브하든 그렇지 않든 간에 사람들의 모든 도구에 대한 반응에서 배울 수 있다. 사람들이 도구에 말을 거는 것을 들을 수 있고, 사람들이 그 도구의 형태, 색깔, 포지셔닝, 소리, 자국, 동작 등 모든 영역을 어떻게 받아들이는지 발견할 수 있을 것이다. 사람들은 도구가 닳아 해질 때까지 소중히 아낄 수도 있고, 싫어하고 무시하거나 던져버리고 팔아버릴 수도 있을 것이다. 또한 자신이 한 번도 생각해본 적이 없던 방식으로 생각하는 누군가를 만난다면 그로부터 많은 점을 배우게 될 것이다.


57     인터렉션 디자인의 네 가지 접근법
사용자 중심 디자인
     - 사용자의 요구와 목표 중시
     - 사용자는 디자인의 방향을 제시
     - 디자이너는 사용자의 요구와 목표 해석

활동 중심 디자인
     - 성취돼야 하는 목표에 대한 작업과 활동 중시. 
     - 사용자는 활동 수행
     - 디자이너는 활동을 위한 도구 제공

시스템 디자인
     - 시스템의 구성요소 중시. 디자인에 대해 총체적인 접근
     - 사용자는 시스템의 목표 지시 및 설정
     - 디자이너는 시스템의 모든 조각들을 제자리에 맞춤
     - 목표 : 시스템의 목표는 사용자의 목표와는 다르다. 사용자의 목표에서 시스템의 목표가 생겨나지만 사용자의 목표는 시스템과 환경 사이의 이상적인 관계 안에서 충족된다. 가령 난방장치의 목표는 실내온도를 21도로 유지하는 것
     - 환경 : 시스템이 어디에 존재하는가? 디지털인가, 아날로그인가, 혹은 두 가지가 통합된 환경인가?
     - 감지자(센서) : 시스템이 어떻게 환경의 변화를 감지하는가? 
     - 방해자 : 변화는 방해자로 분류할 수 있다. 지속적으로 의도하거나 혹은 의도치 않은 방향으로 변화하는 것은 환경의 속성이다. 난방 장치의 예에서는 외부 기온이 뚝 떨어지는 날씨가 방해자이다.
     - 비교자 : 비교자는 시스템 안에서 목표를 잡는다. 현재의 상태(환경)와 원하는 상태 (목표)를 비교하고 이 둘 사이에서 차이점이 발생한다면 시스템은 이를 오류로 간주하고 상황을 바로잡을 방법을 찾는다.
     - 활동자 : 감지자가 방해자를 발견하면, 비교자는 차이가 발생했음을 선언하고 활동자에게 명령을 보낸다. 활동자는 환경에 변화(결과)를 일으킨다. 앞의 상황에서는 활동자인 보일러가 난방을 시작한다.
     - 피드백 : 결과는 다시 피드백으로 돌아온다. 피드백은 목표가 성취됐는지 아닌지. 혹은 감지됐는지 아닌지를 알리는 메시지다.
     - 컨트롤 (지시자) : 컨트롤은 환경을 제외한 시스템 일부를 수동으로 조작하는 것을 말한다. 사람은 컨트롤을 사용해 원하는 실내 온도를 맞출 수 있다. 혹은 컨트롤이 직접 활동자를 유도해 보일러를 켜게 만들기도 한다. 
     - 다시 말해, 시스템 디자인에서 고려해야할 질문들
          : 이 상황에서 어떤 것이 시스템인가?
          : 환경은 어떤 것인가?
          : 환경과 관련한 시스템의 목표는 무엇인가?
          : 시스템이 활동을 수정하는 데 이용하는 피드백 루프는 무엇인가?
          : 시스템이 목표를 성취했는지 여부는 어떻게 측정하는가?
          : 시스템, 환경, 목표 등을 정의하고 점검하는 이는 누구인가?
          : 시스템이 필요한 관계를 유지하기 위해 이용하는 자원은 무엇이 있는가?
          : 이 자원들은 시스템의 용도에 적합한가?

직관적 디자인
     - 제품을 만드는 디자이너의 기술과 지혜에 의존
     - 사용자는 결과물 인정
     - 디자이너는 영감의 원천


76     인터랙션 디자인 요소 : 움직임, 공간, 시간, 외관, 질감, 소리
- 움직임 : 다양한 제품과 이를 사용하는 사람들이 만들어내는 행동을 설계. 제품이 행동하는 방식에 따라 사람들이 행동한다. 움직임은 태도, 문화, 개인적 특성과 상황에 따라 다르게 나타난다
- 공간 : 물리적 공간과 디지털 공간. 공간은 움직임을 위한 컨텍스트를 제공한다. 모든 상호작용은 공간 안에서 벌어진다
- 시간 : 모든 인터랙션은 공간에서 시간을 들여 일어난다. 공간을 이동하는 데는 시간이 걸린다. 시간은 리듬을 만들어 낸다.
- 외관 : 균형, 구성, 크기, 형태. 무게, 컬러

88     테슬러의 복잡성 보존의 법칙
개별 프로세스에서의 복잡성은 지속된다. 모든 프로세스에서는 더 이상 단순화시킬 수 없는 지점이 있으며, 거기서 복잡성은 더 줄어들지 안고 단지 다른 곳으로 옮겨간다

91     포카 요케의 법칙
우연한 실수(포카)를 회피(요케루)한다는 뜻. 디자이너들은 포카 요케를 이용해 제품 기능에 제한을 둠으로써 실수를 막고 사용자들의 행동을 제어하고 제품을 조작할 때 올바른 방식으로 실행하도록 한다.

209     적응하는 제품을 위한 가이드라인, 디자이너 샐리 에반슨 & 존 레인프랭크>
- 사용자에게 맡기라 : 사용자가 수행하는 행동이 정말로 가치 있음을 확신하라. 사용자의 행동과 이에 따른 어플리케이션과 디바이스의 변화가 사용자 개개인을 위해 디자인된 것처럼 느껴지게 하라
- 방향 : 사용자에게 그들의 여행을 하게 하라. 몰고 가려 하지 마라. 그보다는 사용자들이 달성하려는 목표와 지향하는 지점을 시가화하는 방법을 도와주는 지도를 제공하라.
- 사용자가 이기게 하라 : 무언가를 달성하면 보상을 하라.
- 등을 토닥여 주라 : 사용자가 배우는 것을 도와라. 달성하는 것으로 끝나지 않고 스스로 잠재력을 드러내도록 도와라. 실행을 이해와 결합시켜라. 사용자에게 사용 가능한 기능을 주라.
- 느끼고 반응하라 : 사용자가 인공물이 살아있는 것처럼 느끼게 하라. 그것들이 투명하게 동작하게 하라.
- 연결 : 사용자가 대상과 연결되거나 다른 사람들의 지향점과 교차하도록 도와라.
- 몰입 : 사용자를 체험에 빠뜨려서 디바이스와 일체감을 느끼게 하고 자신의 일부처럼 느끼게 하라.

215     해킹 가능한 제품을 만드는데 필요한 기법들
- 어포던스와 틈새가 명확하고 순응성이 있어야 함
- 특정 레이어의 조사, 복제, 조작이 가능하게 한다.
- 순응성, 객체 지향적 본질, 코드의 사회적 행동으로부터 배운다.
- 행동/사용의 관점에서 자신을 스스로 감지하고 이를 다시 사용자에게 되돌리는 제품을 만든다
- 디자인 연구뿐 아니라 이런 행동으로부터 제품이 나오도록 한다.
- 제품을 둘러싼 사회적 인터랙션이 가능하게 한다.

215      적응하는 디자인에서는 사용자의 경험 혹은 오브젝트가 학습할 수 있어야 하며, 사용자는 이런 경험/오브젝트를 가르칠 수 있어야 한다. 그러므로 양방향 인터렉션이며, 이것을 통해 사용자는 자신에게 유용하도록 제푸을 개조하길 원한다. 따라서 디자이너는 그들에게 직접적으로 유용한 경험을 제공하기보다는 유용한 경험을 달성하는데 집중하기 위한 적응성에 집중해야 한다. 제어보다는 가능성을 열어주어야 한다.

216     Ambient Device (배경 디바이스), Calm Technology (컴퓨터 과학자 마크웨저 & 존 실리 브라운)
배경 디바이스는 사용자의 주의를 요구하지 않는다. 인간의 감각 말단에 의존해 정보를 제공하지만 사람들이 이에 대해 주목하거나 그 정보에 따라 움직여야 한다고 주장하지 않는다. 경보음을 울리지 않으며, 만약 아무도 알아채지 못한다고 해도 상관없다. 

225     서비스 디자인 요소 (터치포인트 ) : 환경, 오브젝트, 프로세스, 사람
- 환경 : 서비스가 행해지는 장소. 환경은 사용자에게 무엇을 할 수 있는지 어포던스를 만들어준다. 제품과 달리 서비스는 종종 한 장소에서 구매되고, 전달되고, 사용되고, 소비된다. 따라서 서비스를 위한 환경은 서비스의 구매와 생산, 소비를 위한 자원 등을 고려해 설정해야 한다.
- 오브젝트 : 환경의 일부를 구성하는 인터랙션이 벌어지게 하거나 참여하게 할 가능성을 제공하는 물건들
- 프로세스 : 어떻게 서비스가 실행되는가. 어떻게 주문되고, 만들어지고, 운반되는가, 사용하는 말에 이르기까지 디자인될 수 있다. 프로세스는 고정되어 있지 않다. 고객은 서비스에 반복해서 노출되면서 매번 다양하고 변화되는 경험을 하게 된다. 대부분 같은 서비스에서도 여러 가지 경로가 있다. 사람들이란 한 가지 방식으로 대하기엔 너무나 중구난방이므로 꼭 하나의 방식에 맞출 수가 없다. 디자이너는 서비스 프로세스를 만들 때 제어하려는 노력을 (제어에 대한 환상을) 그만둬야 한다. 디자이너가 모든 경험을 통제할 수는 없다. 그러나 인터랙션 디자이너는 최소한 몇 가지 서비스 경로를 정의하거나 디자인해야 한다. 이 경로들에는 서로 연결되어 서비스와 서비스의 경험을 구성하는 순간 - 작은 경험 단위들-을 포함한다.
- 사람 : 대부분 서비스에서 가장 중요한 부분. 주로 소비자와 종업원이라는 두 부류의 사용자를 디자인하게 된다. 각각 특정 결과를 달성하기 위해 서비스의 다른 역할을 수행한다. 마샬 맥루한에 따르면 사람들은 목표가 아니라 역할에 집중한다. 역할은 이에 따른 업무와 필요한 기술 명세가 정해져 있으므로 누구에게 그 역을 맡겨야 할지 쉽게 알 수 있다.

279      디자인 윤리, 리처드 부캐넌
윤리는 인간이 결정을 내리는 과정에 대한 것이다 (왜 그리고 어떻게 우리가 그런 결정을 내렸는가?). 윤리란 특정한 환경 내에서 무엇이 옳은 일인가를 결정한다. 리처드 부태년은 주어진 제한을 고려해 옳은 결정을 내리는 일이야말로 바로 인터랙션 디자이너들이 해야하는 일이라고 했다

279     디자인 윤리와 원칙
인터랙션 디자이너는 사람들의 상호작용이 어떤 모습이어야 하는지를 결정한다.
사람들이 책임감 있게 다뤄져야 하는가?
어떤 사람들이 다른 사람들보다 더 많은 책임을 져야 하는가?
혹은 몇몇 사람들이 다른 사람들보다 더 중요한 존재인가?
어떤 제품이 일부의 사람들을 위해서는 아주 좋은데 그 밖의 사람들에게는 그다지 좋지 않아도 될까?
별로 그렇지 않아도 괜찮은가?
이 디자인 도구가 특정한 프로젝트에서만 사용되어야 하는가?
이런 것들이 디자이너가 계속 맞닥뜨리는 문제들이며 이들을 골라낼수있는 원칙이 필요하다