정보구조도(IA)

정보구조도 (IA, Information Architecture)는 페이지의 구조를 한장에 나타낸 그림입니다.

또한 Depth는 페이지에 도달하기 까지의 단계(깊이)를 의미합니다.

 

이번에 공모전에 제출할 기획서가 필요한데, 심사원분들에게 IA를 보여주면 좋을거 같아 작성하게 되었습니다. 

구조

1. 스플래시 화면 > 로그인/회원가입 > 홈으로 진행된다는 것을 표현하였습니다. 특히 저희 서비스는 웹이지만 모바일을 생각하고 만들었기 때문에 로그인 후 이용할 수 있는 서비스로 기획되어있습니다.

 

2. 홈, 코치 리스트 등 주요 페이지를 1 Depth로 두었습니다. 또한 각 페이지의 UI 컴포넌트 혹은 기능을 2 Depth로 두었습니다.

코치 상세 페이지의 상세 정보, 자기소개, 활동 센터 지도, 리뷰 등은 UI 컴포넌트이므로 네모로 표시하고,

채팅 문의하기, 매칭 신청하기 버튼은 UI 컴포넌트이면서 기능이므로 동그라미로 구분하였습니다.

 

3. 내 루틴과 코치가 만든 루틴은 공통적으로 루틴의 달성도와 오늘의 루틴 목록을 가지고 있습니다.

오늘의 루틴 목록에 다다르기 까지의 depth를 살펴보겠습니다.

 1) 루틴 > 내 루틴 > 오늘의 루틴 목록 (3 depth)

 2) 루틴 > 코치가 만든 루틴 > 매칭된 코치들 > 오늘의 루틴 목록 (4 depth)

 

루틴은 저희 서비스에서 매우 중요한 기능입니다. 따라서 depth를 깊이 두더라도 모두 표시하고자 하였습니다. 

또한 루틴 - 상세 운동은 1: N 관계입니다. 

 

✔ 예를 들어, {"랫 풀 다운","바벨 로우"} ⊆ 등 루틴

루틴 : 등

운동: 랫 풀 다운, 바벨 로우 입니다!

 

이 루틴을 완료했을 때 체크를 하여 기록으로 확인할 수 있습니다.

이를 구체적으로 드러내기 위하여 하위 > 하위... 까지 나타내었습니다.

마이페이지에서는 내 프로필, 기록, 나와 매칭된 코치 등 정보를 확인할 수 있고, 마지막으로 로그아웃, 회원탈퇴가 있습니다.

2depth와 3 depth를 구분하기 위해 색상으로 구분하였습니다.

 

최종 IA

최종적으로 "코치코치"의 IA는 다음과 같습니다.

 

정리

정보구조(IA)는 서비스를 이해하려는 사람들뿐만 아니라 서비스를 기획하는 사람들에게도 매우 도움이 된다.

기존 서비스의 정보구조를 분석해본 결과, 정보의 깊이가 너무 깊어 사용자가 정보(사용법)를 인식하는 데 어려움을 겪을 수도 있다라는 생각이 들었다.

프로젝트 기획 초기부터 정보구조를 작성하지 않은 것에 대한 아쉬움이 남는다.