Language

HTML + CSS/피그마 3

피그마 중급

■ 피그마 Local file로 변경- xxx.fig 파일로 로컬형태로 저장 가능    ■ 피그마 협업 및 Icon○ 많이 사용하는 Plug in○ 피그마 협업- Team project : 1개의 팀 프로젝트에 4개의 Design 파일을 제작 가능그 이상은 유료 - Share를 눌러서 공유할 수 있으며이메일을 통해 Invite 초대할 수 있다.Can view, Can edit으로 사용가능함  ○ 아이콘 및 플러그인 추가Community profile을 활용 검색하여 Icon 및 기타 플러그인 추가 가능Preview 를 활용하여 문제 없이 제공하는지 확인 필요    ■ 피그마 컴포넌트디자인에서 반복적으로 사용되는 요소를 한 번만 정의해두고,다양한 곳에서 재사용할 수 있는 기능컴포넌트를 사용하면 디자인의 일..

피그마

■ 피그마기초○ 특징- 클라우드 기반으로 컴퓨터에 저장할 필요 없음- 윈도우 맥 OS 제약을 받지 않는다.- 팀원과 실시간 협업이 가능- 커뮤니티에서 다양한 에셋 과 플러그인을 제공- 기획 프로토타이핑 개발까지 최적의 툴임 ○ 인터페이스-  툴바- 레이어 패널- 캔버스- 계정, 공유, 프로토 타입- 속성 패널 ○ 주요 단축키- Ctrl + G : 그룹- Ctrl + Alt + G : 프레임으로 그룹- Ctrl + Shift + G : 그룹해제- Alt 드래그 : 복제- Ctrl + [, ] : 순서- Ctrl + Shift + [, ] : 한번에 순서 이동- Ctrl + D : 반복작업 ○ 많이 사용하는 plugin - Unsplash : 이미지 사용 사이트- Pixabay : 이미지 사용 ○ 레이어, ..

설치 및 다운로드 / 기본 인터페이스

■ 피그마 설치○ 피그마 사이트 ○ 피그마 로그인(구글과 연계) ○  피그마 다운로드  ■ 피그마 실행 / 주요 툴 ○  새 파일 만들기- 단축키 Ctrl + N- 위 메뉴에서 Design file 누르기  ○  이름변경- 위의 이름을 클릭하면 이름을 변경할 수 있다.  ○  확대 축소-  Ctrl + 마우스 휠- +, - 키- Ctrl + 0 : 100% 크기- 크기 수치조정  ○  이동과 크기- Move : 단축키 V : 이동을할 수 있는 툴- Scale : 단축키 K : 오브젝트의 크기를 변경하는 툴  ○  Frame, Section, Slice- Section : 아트보드를 전체 관리하는 부분 단축키 Shift + S- Frame : 아트보드 영역, 하나의 화면을 의미 단축키 A- Slice : ..