👋 소개
STA+C 2022 결선을 준비면서 우리 '지우지'팀의 멘토링을 맡으신 강유정 멘토님과 멘토링을 하며 새로 배우고 느꼈던 부분을 글로 남겨본다.
📃 목차
- 협업을 위한 디자인 툴 'Figma'
- Figma란?- Figma를 써야하는 이유
- Wireframe이란?
- 앱 디자인에서 중요한 점
- 실습
- Figma 설치하기
- 플러그인 설치
- 멘토님의 책 추천
👋 협업을 위한 디자인 툴 'Figma'
Figma란?
Workspace를 공유하는 UI 디자인 도구.
Figma를 써야하는 이유
- 비교적 조작이 쉬운 인터페이스
- 개발 협업에 특화된 툴
- 편집된 내용 바로 반영
- Design Grid 및 해상도별 프레임 제공
- 여러 종류의 플러그인 제공
- ✨무료✨
✨ Wireframe이란?
'뼈대' 라는 의미를 가지고 있음.
웹사이트나 앱 서비스를 기획 할 때, 대략적인 화면구성을 시각화한 설계도면.
원래는 직접 손으로 그리는 것이 원칙이라고 한다.
✅ 앱 디자인에서 중요한 점
앱 디자인은 눈에 예뻐 보이도록 만드는 것만이 아닌 사용자 경험적 논리에 따른 치밀한 설계를 하는 것이다.
- 앱디자인 ≠ 예쁘게만 꾸미는 것
- 사용자 경험적 논리에 따라 치밀한 설계 필요
- 내눈에만 이뻐보이는 것 ❌
🔨 실습
Figma 설치하기
- Figma 설치 페이지 접속
- PC 사양에 맞는 옵션 설치
플러그인 설치하기
좌측 상단 Figma아이콘 - Plugins - Findmoreplugins... 클릭!
상단의 검색창을 누르고 원하는 플러그인 검색 후 원하는 플러그인 설치
사용 예
'unsplash'라는 플러그인 설치하는 경우
검색창에 'unsplah' 검색 후 클릭!
우측 더보기 버튼( ... ) 클릭 후 Install 클릭!
📚 멘토님의 책 추천
「처음 만나는 피그마」
"설계부터 협업까지 올인원 UX/UI 제작 툴에 대한 간단한 기능들을 아주 쉽게 풀어낸 책"이라고 하시면서 추천해주셨다.
21,000원
미스테리옴므파탈고려기프트앤드파워엠버서더오브더개콘컴퍼니