시각적인 감각과 능력을 기르는 비결
- UX, UI 디자인의 원칙 및 정리
- 잘 만든 디자인 따라해보기 (코딩곽 마찬가지임)
UX / UI 디자인 프로세스
- 공감하기
- 정의하기
- 아이데이션
- 프로토타입
- 테스트
- 출시
UI 디자인 프로세스
- 스케치
- 와이어 프레임
- UI 디자인
- 와이터 프레임을 토대로 시각적인 완성도가 높은 디자인 그려주기
- 프로토타이핑 (Prototyping)
- UI 디자인 화면을 서로 연결시켜줘서 구동 되는 것 처럼 보여줌
- 실제 개발이 된 것은 아니지만, 사용자 테스트 단계에서 사용자의 피드백을 얻거나 내부 커뮤니케이션을 위해 제작
- 핸드오프 (Hand-off)
- UI 디자인이 완료된 후, 실제품 개발을 위해 개발자에게 전달하는 디자인 산출물
- 실제 개발을 할 수 있도록 세부적인 요소들을 구체적의로 정의함
프로토타입의 종류
Fidelity 가 높을수록 수정하는 데 시간이 오래걸림
- Lo-Fi(Low Fidelity)
- 스케치 : 빠른 실행과 반복, 커뮤니케이션에 좋은 방법
- Mid-Fi(Mid Fidelity)
- 와이어프레임: 텍스트, 버튼 등 화면에 대한 구성에 대해 정의하고 화면 간의 플로우를 표현.
최종 버전인 UI 디자인 대비 빠른 수정 및 커뮤니케이션에 좋음
- Hi-Fi(High Fidelity)
- UI 디자인: 사용자가 실제로 사용하게 될 높은 퀄리티의 디자인 산출물. 색 폰트 및 폰트 사이즈, 아이콘 등 세부 사항이 적용됨.