[유데미x스나이퍼팩토리] 6일차 (0429)

[유데미x스나이퍼팩토리] UI/UX 인턴형 프로그램 3기 과정 6일차

 

벌써 2주차잖아~

 

 

UX 작업의 시각화 과정 (=UI 시작단계)라고도 한다.

1. 메뉴설계 (메뉴트리, 사이트맵)
2. 이용자의 흐름 설계 (유저플로우, 플로우차트)
3. 정보구조설계 및 기능 정의 (정보구조도)
4. 화면설계 (와이어프레임 스토리보드)
5. 디자인 컨셉 도출 및 디자인 (무드보드, 디자인파일 등)

 

메뉴트리

• Ui 설계의 첫 시작단계
• IA작성전에 서비스 전체 구성을 한눈에 보도록 구성한다.
• 핵심 서비스가 잘 드러나도록하고
• 메뉴를 보고 서비스 정체성이 잘 드러나도록 해야한다.

 

플로우차트

• 사용자가 특정 작업을 완료하기 위해 서비스 내에서 움직이는 경로를 정리한거
• 확인, 재시도, 전송, 가입 성공 등등의 다양한 행동과 그에따른 결과들에 따라서 흐름을 구성한다.

도형에 따라서 다르게 의미 넣기

 

 

 

 

정보구조도

• 실무에서는 IA를 정리해두고 어느 우선순위부터 작업을 들어갈것인지 회의로 결정한다.
• 개발단에서도 HTML 정도로 되는지 서버관리하는 어드민인지 구분에 따라 개발 일정이 달라진다.
• 달라지는 개발 우선순위에 따라 디자인 작업 순서도 참고해서 타임라인을 결정한다.
• 프로덕트의 전반을 보는 PM은 IA를 더 자주 꼼꼼하게 봐야한다
• 프로젝트 규모에 따라서 디자인, 개발 파트의 각각 PM이 있기도 하므로 

 

(1) 계층형 - 메뉴가 많고 정보 구조가 복잡할 때 사용한다.

(2) 허브 & 스포크형 - 홈 화면이 허브 역할을 하며 정보의 양이 많지 않은 경우 주로 모바일에서 설계됨.

(3) 선형패턴 - 순서대로 전개되는 정보, 태스크 수행을 순서대로 할 수 있다.

(4) 탭 패턴 - 모바일에서 많이 쓰이는 방식, 하단 네비의 방식과 동일하다. 핵심기능이 5개 이하인 곳에 사용

https://plavement.tistory.com/55

정보 구조도 종류다