Figma 활용법 개인 과제 : 디자인 시스템 및 프로토타입 제작하기
- 식료품 및 생필품을 구매할 수 있는 가상의 커머스 앱 UI를 설계
- 위 UI 앱의 프로토타입 제작
- 화면 디자인과 프로토타입에서 활용한 색상 및 폰트 스타일, UI 컴포넌트로 디자인 시스템 제작
두번째 개인과제가 시작되었다. 이번과제도 강의를 복습하기 위한 과제였다. 그동안 배웠던 내용들을 가지고 열심히 만들어 봐야겠다. 우선 가상의 커머스 앱의 UI를 설계하기 위해 간단히 홈화면의 와이어프레임을 그렸다.
피그마에서 하나씩 제작을 하는 도중 UI부터가 아닌 디자인 시스템을 미리 만들어놓고 시작하면 더 편할 것 같다는 생각이 들어 디자인 시스템부터 진행하기 시작했다.
피그마 플러그인 'Colors'를 통해 컬러를 비교해보며 도출하고 메인, 포인트, 서브컬러, 회색조를 정했다.
다음 할일은 나머지 화면의 와이어프레임, 그리고 폰트/버튼/라디오/다이얼로그를 추가해야겠다.
UI/UX디자인 - 스터디/아티클/리뷰