UX/UI 디자인 전체 프로세스

공감하기(사용자를 배우고 이해한다.) → 정의 하기(사용자가 가지고있는 문제점과 고민을 정의) →

[아이데이션(아이디어 창출) → 프로토타입(창출된 아이디어를 시각화하여 표현) →] UI디자인 프로세스

테스트(사용자에게 피드백을 받고 디벨롭한다.) → 출시

 

UI 디자인 프로세스

스케치 (로우파이 프로토타입) - 손으로 주어진 문제의 해결방법에 관한 아이디어를 그린다.

→ 와이어프레임(미드파이 프로토타입) - 스케치로 나온 아이디어를 고도화 화면의 기능 및 버튼 기능 정의 화면간의 연결 → UI디자인(하이파이 프로토타입) - 와이어프레임을 토대로 실제 사용자가 사용할 정도로 시각화

→ 프로토타이핑 - UI디자인 간의 화면을 연결하여 실제 구동화면과 같이 자연스럽게 제작 디자이너와 개발자간의 원활한 커뮤니케이션과 사용자에게 기능을 먼저 보여주고 수정 할 수 있게  제작 → 디자인 시스템 - 사용자에게 일관된 사용자경험과 인터페이스를 제공하고 디자이너또는 개발자가 사용할 수 있는 요소를 정의하여 효율적으로 웹사이트 제작

→ 핸드 오프 -구체적인 제작물이나 버튼의 크기를 정의

 

왜 피그마일까?

 

피그마 이전에는 스케치 앱(와이어프레임,UI디자인,디자인시스템)과 인비전(프로토타이핑), 제플린(핸드오프)을 활용하여 제작 했다면 피그마를 사용하게되면 하나의 툴로 전부를 작업할 수 있게 되었다.

장점

1. 온라인 기반의 서비스(용량걱정 없음)

2. 실시간 협업 가능

3. 스케치 앱을 사용했다면 쉽게 사용 가능