UI 썸네일형 리스트형 [Framer] 프레이머 스터디 : tip #1 프레이머 할인 받아 구매하기 프레이머를 구입하는 과정에서 내가 궁금했던 점, 그리고 소소하게나마 팁이랄 게 있다면 팁인 내용들. 프레이머 홈페이지의 'Try Framer for Free' 라는 문구가 유혹적이지만 프로그램을 무료로 사용할 수 있는 기간은 14일이다. - 14일의 체험 사용 기간 - 모든 기능 이용 가능 - 이메일로 간단 가입 - 카드 정보는 필요없어요 - 오직 macOS에서만 구동 예전에 프레이머가 처음 나왔을 때는 프로그램 하나 당 가격을 지불하는 방식이었던 같은데, 현재는 스케치와 마찬가지로 Subscribe의 방식으로 변경되었다. 방법은 Monthly 월간 구독과 Yearly 연간 구독 두가지이고, 연간 구독이 월간 보다 20% 저렴하다. Your total is US$158.40/year (inc. VAT) .. 더보기 [Framer] 프레이머 스터디 : 코드 문법 분석하기 #1 프레이머는 하이 피델리티(High Fidelity) 프로토타이핑 툴이다. 피델리티(Fidelity)란 실제와 얼마나 유사하게 프로토타입을 구현해낼 수 있는가 하는 척도로 Low에서 High로 갈수록 더욱 정교한 인터렉션 구현이 가능하다. 이러한 장점때문에 러닝커브가 높음에도 불구하고 많은 프로토타이핑 툴 사이에서 굳건히 한 자리를 차지하고 있다. 모든것을 수행하는 디자인 도구. 여기에서 알 수 있듯 프레이머는 '디자이너'를 위해 만들어진 프로토타이핑 툴이다. 프레이머는 '커피스크립트'라는 언어를 사용하는데, 커피 스크립트는 '자바스크립트'의 여러 단점을 보완하기 위해 제안되었다. 코딩을 전혀 모르는 사람이 사용하기에 자바스크립트는 다소 진입 장벽이 높아 이를 위해 좀 더 읽고 쓰기 쉽게 만들어졌다고 한다.. 더보기 [Framer] 프레이머 스터디 : 디자인 불러오기 스케치에서 디자인 한 화면을 프레이머로 불러오기 프레이머에서 화면을 구성하는 방법은 세 가지가 있다. 방법1. 프레이머 내부의 디자인 탭을 이용해 직접 디자인하는 방법 방법2. 코드 탭을 사용하여 레이어를 추가하는 방법 방법3. 외부 그래픽 도구에서 화면을 가져오는 방법 프레이머 공식 홈페이지에서는 최적의 프레이머 Work Flow를 위해 디자인 탭에서 직접 디자인을 하는 것을 권장한다. 하지만 실제 업무에서 모든 디자인을 프레이머로 하기에는 다소 무리가 있다. 그래서 오늘은 외부 그래픽 툴로 디자인한 화면을 프레이머로 불러와 인터렉션을 적용하는 방법에 대해 정리해보려고 한다. 방법01 어렵지 않다. 스케치에서 불러오고 싶은 레이어나 아트보드를 선택하고 cmd + c, 프레이머의 디자인 탭에서 cmd +.. 더보기 [Framer] 프레이머 스터디 : Short cut 단축키 2018. 08. 28 업데이트 내용 1. Code cmd⌘ + R reload 다시 불러오기 2. Design - 캔버스 F 프레임 툴 R 사각형 툴 O 원형 툴 T 텍스트 툴 Z 확대 툴 ⌘+ 확대하기 ⌘- 축소하기 ⌘0 실제 크기로 보기 ⌘1 캔버스 중앙으로 보기 - 편집 0 - 9 오퍼시티 변경하기 ⌥ 거리 표시하기 ⌘D 복제하기 ⌥ 드래그복제하기 ⌥⌘C 스타일 복사 ⌥⌘V 스타일 붙이기 ⌃C 컬러 추출하기 ⌘A 모든 레이어 선택하기 - 배열 ⌥⌘↑앞으로 가져오기 ⌥⌘↓뒤로 보내기 ⌘; 숨기기 ⌘L 선택된 요소 잠그기 ⌘Enter 부모 레이어 추가하기 (Group) ⌘Delete 계층 구조 지우기 - 텍스트 ⌘B 볼드체로 바꾸기 ⌘I 이탤릭체로 바꾸기 ⌘U 밑줄 추가하기 ⌘T 폰트 바꾸기 더보기 이전 1 2 3 다음
