IA는 Information Architecture 의 줄임말로 우리말로는 정보구조도라고 합니다.
이 단계에 들어서면 프로젝트의 단계가 설계에 들어섰다는 것을 의미합니다.
본격적인 학습에 들어가기 전에 한가지 알아두면 좋은 것은 IA는 한 번에 완성하기 어렵다는 것입니다.
특히나 새로운 서비스를 만드는 중이라면 이 IA는 여러번의 업데이트를 거쳐서 완성하게 됩니다.
그러니 처음부터 잘 안된다고 절망하지 마시고
한 걸음씩 천천히 시작해보세요. �
IA를 만들기 위해서 먼저 알아야 하는 개념은 Depth에 대한 부분입니다.
IA를 만든데 있어서 쓰이는 이 Depth라는 용어는 말 그대로 서비스의 단계에 따른 깊이를 의미합니다.
정보구조도를 만드는데 있어서 이 Depth는 중요한 의미를 가집니다.
서비스의 주요 기능을 사용하기 위해서 사용자가 실행해야하는 행위가 얼마나 발생하는지, 또 기능의 성격에 따라서 독립된 하나의 모듈로 존재할 것인지 혹은 특정 메뉴에 위치하는지 등 전반적인 서비스의 구조와 범위를 파악할 수 있는 기본 설계서가 되어줍니다.
Step 과 Depth 구분하기
한가지 헛갈리기 쉬운 것이 Step과 Depth를 구분하는 것입니다.
예를들어 배달의 민족 앱에서 음식을 주문한다고 가정해봅시다.
배민에서 음식 메뉴를 선택하고 주문을 실행하는 순서는 다음과 같습니다.
주문 메뉴 확인
배송지 정보 입력
결제 실행
주문 완료
음식 주문이라는 기능을 사용하기 위해서는 총 4단계를 거쳐 주문의 완료하게 됩니다.
즉 4개의 Step으로 구성된 모듈입니다.
Step은 단계에 해당하는 것임으로 Depth 구조에서 하위로 내려가지 않습니다.
하지만 위의 이미지와 같이 각 스텝의 성격에 따라 해당 스텝에서만 선택할 수 있는 옵션이 존재합니다. 위의 과정을 IA 문서 형태로 정리하자면 다음과 같이 정리가 가능합니다.
※ 위의 IA는 샘플입니다.
주문하기 기능을 구성하는 Step에 해당하는 구조는 위의 예시 표와 같이 2depth에 작성하게 됩니다.
두번째 해당하는 배송지 정보 확인 단계의 경우, 사용자가 주소를 변경할 수 있도록 하는 주소 검색 기능, 보유한 할인쿠폰을 결제에 적용할 수 있게하는 기능을 포함하고 있습니다. 이 부분은 배송지 정보 확인이라고 하는 화면 하위에 위치합니다. 따라서 이 이 영역은 3depth에 해당합니다.
이렇게 IA를 정리하고나면 전체적인 서비스 구조와 함께 몇 개의 화면으로 서비스가 이뤄졌는지를 확인할 수 있습니다. 실무에서는 이것을 화면본수라고 표현합니다. 프로젝트의 작업 범위를 파악하기 위해서 "화면본수가 어떻게 돼요?" 라는 표현을 많이 사용합니다.
누군가 화면본수를 물어본다면 IA로 정리된 전체 화면의 수를 기준으로 답을 해주시면 됩니다.
스크린 타입 정의 하기
여기까지 정리한 상태라면 각 화면들을 어떤 방식으로 제공할 것인지에 대한 부분도 정의할 수 있습니다.
보통 이런 부분을 각 스크린의 타입(Type)이라고 칭합니다.
1차로 우리가 정리한 IA에 이제 Type 열을 추가할 수 있습니다.
앱 화면 그 자체에서 제공되는 화면을 보통 바닥 페이지, 바디(Body)라고 칭합니다. IA는 일반적으로 Page 라는 용어로 정의합니다.
사용자가 버튼을 누르거나 특정 옵션을 선택했을 때 새로운 화면을 열리는 경우 팝업(Popup)으로 칭합니다.
뎁스(Depth) 구조까지 이해했다면 IA제작의 절반은 온 셈입니다.
이 구조의 파악을 할 줄 알아야 설계의 구조를 제대로 작성할 수 있습니다.
강의를 진행하다보면 이 IA를 처음 작성해보시거나 유독 어려워하는 분들도 계시고, 스타트업에서 근무하시는 분들 같은 경우 개념은 알고 있지만 현재 운영 중인 서비스를 어떻게 정리할 줄 몰라 곤란해하시는 분들도 계십니다.
그.래.도
IA만큼은 어려움이 있더라도 꼭 제작해서 관리하시는 것을 추천하는 편입니다.
이 정보구조도가 있어야 전체 서비스를 구조적으로 이해할 수 있고 추후 운영 관리 혹은 리뉴얼을 진행하는데 있어서도 원활한 수행이 가능합니다.
덧붙이자면 저도 아직까지도 IA는 어려워요. ㅎㅎㅎㅎ
신규 구축에 들어가면 이 IA를 작성하는데 있어서 가장 많은 시간과 공을 들이게 된답니다.
한번에 완성하려고 하지 마시고, 한걸음씩 차근차근 정리해보세요.
#정보구조설계도 #IA #웹기획강의 #서비스기획강의 #피그마 #figma #레탑피그마 #웹기획자 #서비스기획자