피그마
-
출처: figma 공식 사이트 컴포넌트 , 반복 재사용 가능한 UI 요소 컴포넌트를 사용하는 이유 디자인 자산 운용으로 작업 효율성 증대하기 만들어 놓은 디자인 자산을 다시 재활용 할 수 있습니다. 메인 요소를 수정하면 복제된 디자인에도 수정사항이 반영 되어 반복 작업을 줄여줍니다 라이브러리 기능을 활용해서 디자인시스템운용 컴포넌트로 제작한 UI 요소들을 라이브러리로 보내놓고 다른 프로젝트 파일에서도 라이브러리를 통해 불러와서 재사용 가능합니다. 요소들을 전부 합쳐 거대한 디자인 시스템으로 규격화 할 수 있습니다. 1. 컴포넌트 만들기 1-1. 마우스 우클릭후에 'Create component' 실행 component를 생성하면 메인 컴포넌트가 생성됩니다. 메인 컴포넌트(부모)를 복제한 것을 Instan..
[Figma] 컴포넌트 만들기 1탄출처: figma 공식 사이트 컴포넌트 , 반복 재사용 가능한 UI 요소 컴포넌트를 사용하는 이유 디자인 자산 운용으로 작업 효율성 증대하기 만들어 놓은 디자인 자산을 다시 재활용 할 수 있습니다. 메인 요소를 수정하면 복제된 디자인에도 수정사항이 반영 되어 반복 작업을 줄여줍니다 라이브러리 기능을 활용해서 디자인시스템운용 컴포넌트로 제작한 UI 요소들을 라이브러리로 보내놓고 다른 프로젝트 파일에서도 라이브러리를 통해 불러와서 재사용 가능합니다. 요소들을 전부 합쳐 거대한 디자인 시스템으로 규격화 할 수 있습니다. 1. 컴포넌트 만들기 1-1. 마우스 우클릭후에 'Create component' 실행 component를 생성하면 메인 컴포넌트가 생성됩니다. 메인 컴포넌트(부모)를 복제한 것을 Instan..
2023.06.14 -
피그마에서도 gif이미지를 넣는게 가능한데 움직이는 형태의 이미지를 보려면 Present모드에서 보는게 가능하다. 발표용 ppt를 만들거나 디자인 프로토타입 버전에서 움직이는 애니메이션 이미지를 보여줘야 할 필요가 있을 때 활용해 볼 수 있다. 부가설명은 피그마 가이드 문서 내용 참고. https://help.figma.com/hc/en-us/articles/360041486873-Add-animated-GIFs-to-prototypeshttps://help.figma.com/hc/en-us/articles/8878274530455 Add animated GIFs to prototypes Who can use this feature Supported on any team or organization pl..
[Figma]피그마 프로토타입에서 영상과 Gif 이미지 넣기피그마에서도 gif이미지를 넣는게 가능한데 움직이는 형태의 이미지를 보려면 Present모드에서 보는게 가능하다. 발표용 ppt를 만들거나 디자인 프로토타입 버전에서 움직이는 애니메이션 이미지를 보여줘야 할 필요가 있을 때 활용해 볼 수 있다. 부가설명은 피그마 가이드 문서 내용 참고. https://help.figma.com/hc/en-us/articles/360041486873-Add-animated-GIFs-to-prototypeshttps://help.figma.com/hc/en-us/articles/8878274530455 Add animated GIFs to prototypes Who can use this feature Supported on any team or organization pl..
2022.10.03 -
[공지]티스토리 스킨 변경으로 인해 keyboard 단축키 구분 스타일이 삭제 되었습니다. 가독성이 매우 떨어져 곧 업데이트 할 예정입니다. 방문자 분들 단축키 보기가 조금 불편하시겠지만 조금만 기다려 주세요. [업데이트&오타 수정 내역 ] 더보기 2024.1.4 티스토리 스킨 변경으로 인해 keyboard 단축키 구분 스타일이 삭제 되었습니다. 곧 업데이트 할 예정입니다. 방문자 분들 불편하시더라도 조금만 기다려 주세요. 2023.04.27 - section을 selection으로 오기입해서 수정했습니다. - 사용 빈도수가 낮았던 단축키를 업데이트했습니다. - ETC: 실시간 대화하는 기능 단축키 추가 - Cursor: 움직이면서 실행하는 단축키 추가 2022.11.30 section 툴 추가 2022..
[Figma] 맥 유용한 Figma 단축키 (Figma shortcut)[공지]티스토리 스킨 변경으로 인해 keyboard 단축키 구분 스타일이 삭제 되었습니다. 가독성이 매우 떨어져 곧 업데이트 할 예정입니다. 방문자 분들 단축키 보기가 조금 불편하시겠지만 조금만 기다려 주세요. [업데이트&오타 수정 내역 ] 더보기 2024.1.4 티스토리 스킨 변경으로 인해 keyboard 단축키 구분 스타일이 삭제 되었습니다. 곧 업데이트 할 예정입니다. 방문자 분들 불편하시더라도 조금만 기다려 주세요. 2023.04.27 - section을 selection으로 오기입해서 수정했습니다. - 사용 빈도수가 낮았던 단축키를 업데이트했습니다. - ETC: 실시간 대화하는 기능 단축키 추가 - Cursor: 움직이면서 실행하는 단축키 추가 2022.11.30 section 툴 추가 2022..
2022.09.15 -
벌써 피그마 사용한지 2년 정도 흐른것 같은데 플러그인 이것저것 설치해 보다가 정착템? 으로 계속 쓰고 있는 플러그인 소개 해볼까 합니다. 플러그인 설치한건 많은데 손이 안가는 템들은 탈락시켰습니다. 1. 스타일 가이드를 제작해주는 툴 measure tools 스타일 가이드 제작용 툴 , 가볍고 단순해서 쓰기 편합니다. 외부 사용자를 위한 가이드 문서를 제작해야 되는 경우가 있는데 이미지 사이즈나 오브젝트 사이 간격을 빠르게 추출해줍니다. 2. 픽셀 퍼펙트 만들어 주는 플러그인 PixelPerfact 이거 좋은데 왜 아무도 안쓰는건가요... 이미지나 아이콘등의 파일을 불러왔을때 픽셀이 소수점으로 깨질 경우가 있죠? 이 툴을 써주면 한번에 정리가 돼요 3. 비주얼 작업시, 아이소매트릭 효과에 유용한 플러그..
[Figma] 피그마 플러그인 추천 6개벌써 피그마 사용한지 2년 정도 흐른것 같은데 플러그인 이것저것 설치해 보다가 정착템? 으로 계속 쓰고 있는 플러그인 소개 해볼까 합니다. 플러그인 설치한건 많은데 손이 안가는 템들은 탈락시켰습니다. 1. 스타일 가이드를 제작해주는 툴 measure tools 스타일 가이드 제작용 툴 , 가볍고 단순해서 쓰기 편합니다. 외부 사용자를 위한 가이드 문서를 제작해야 되는 경우가 있는데 이미지 사이즈나 오브젝트 사이 간격을 빠르게 추출해줍니다. 2. 픽셀 퍼펙트 만들어 주는 플러그인 PixelPerfact 이거 좋은데 왜 아무도 안쓰는건가요... 이미지나 아이콘등의 파일을 불러왔을때 픽셀이 소수점으로 깨질 경우가 있죠? 이 툴을 써주면 한번에 정리가 돼요 3. 비주얼 작업시, 아이소매트릭 효과에 유용한 플러그..
2022.09.07 -
share 버튼 누른다 옵션 아이콘 클릭 후 allow viewers to copy, share, to export from this file ('뷰어'에게 이파일을 복사, 공유, 내보내기 허용)을 체크해제한다. 기본적으로 내보내기 허용한 상태로 파일이 생성되는데, 체크 해제 하면서 내보내기가 복제나 불가능해집니다. 부가설명 - 파일을 일단 만들면 허용된 상태로 파일이 만들어진다. - 셋팅에서 설정 해줄수 없고 개별 파일마다 체크 해제를 해야한다. - professional 부터 지원하는 기능이다. 원본링크 help figma https://help.figma.com/hc/en-us/articles/360040045574#Organization-management
[Figma] 피그마 파일 복제, 공유, 내보내기 제한하기share 버튼 누른다 옵션 아이콘 클릭 후 allow viewers to copy, share, to export from this file ('뷰어'에게 이파일을 복사, 공유, 내보내기 허용)을 체크해제한다. 기본적으로 내보내기 허용한 상태로 파일이 생성되는데, 체크 해제 하면서 내보내기가 복제나 불가능해집니다. 부가설명 - 파일을 일단 만들면 허용된 상태로 파일이 만들어진다. - 셋팅에서 설정 해줄수 없고 개별 파일마다 체크 해제를 해야한다. - professional 부터 지원하는 기능이다. 원본링크 help figma https://help.figma.com/hc/en-us/articles/360040045574#Organization-management
2021.08.14