[figma] 1-(8,9,10) | 프레임 vs 그룹 | ✨스타일✨ | Icon
2024. 7. 3. 01:30ㆍ카테고리 없음
Frame
| Frame | - 디자인 요소가 담기는 컨테이너 - 오토레이아웃/ Constraints/ 레이아웃/ 그리드 (등의 프레임 하위기능 존재) - 프레임 중첩 가능 |
| 그룹/ 프레임 | 그룹(=고무줄): 요소들을 묶는 용도 프레임(=컨테이너): 프레임의 기능 활용, 구조적 설계/ 반응형 디자인 |
| Constranints (제약조건) |
- 프레임 안에서 오브젝트의 위치에 대한 제약을 조정하는 곳 (우측패널에 있음) |
| Layout Grid | - shift G |
✨STYLE✨
| Style | - ui 디자인의 일관성 확보 - 제품 및 서비스에서 일관된 사용자 경험 제공 - 유지 보수의 용이성 - Design(그룹1) Primary(그룹2) primary-900(스타일 이름) 이런식으로 이름을 저장하면 된다 |
| 스타일 종류 | |
| Text | |
| Color | |
| Effect | |
| Grid | |
Icon
| icon | - 24*24 프레임안에 제작 - 아이콘 그리드 설정 (4픽셀 그리드/ 2픽셀 칼럼&로우) - stroke:center - 2px - round 이런식의 스타일가이드 필요 |
| tip | - ctrl 누른 채 패스 점 클릭하면 직각>곡선으로 변경된다. - 펜툴에서 빠져나올 때는 ESC |
| 필수✨ | 아이콘을 다 만들었을 때에는 선을 면으로 깨줘야 한다. |