IA(Information Architect, 정보 구조) 정리하기

1. 정의

IA (Information Architect, 정보 구조)는 사용자가 시스템을 효율적으로 이용할 수 있도록 정보를 구성하는 것을 말합니다. 전문가들은 일반적으로 3단계 이하의 구조를 권장합니다.
 

2. IA 설계 원칙 

IA 설계의 원칙은 다음과 같습니다:

• 쉬운 접근성: 사용자가 필요한 정보에 쉽게 접근할 수 있도록 설계되어야 합니다.
• 우선순위 설정: 중요하고 자주 사용되는 정보가 사용자에게 먼저 보이도록 설계되어야 합니다.
• 균형 있는 분포: 정보의 넓이와 깊이가 균형 있게 분포되어야 합니다.
• 얕은 구조 선호: 정보의 깊이는 얕을수록 사용자에게 더 좋습니다.

 
잘 구성한 IA는 사용자가 필요한 정보에 빠르게 접근할 수 있도록 도와줍니다. 명확하고 구조화된 사이트맵은 효율적인 정보 구조를 구성하는데 도움이 됩니다.
 
IA 설계한 기획서는 아니지만, IA가 가장 잘 나타나있는 곳은 바로 홈페이지의 사이트맵이죠.
예시로 CJ 홈페이지 사이트맵을 확인해보겠습니다.
https://www.cj.net/

 
 

3. IA 설계 원칙 

IA 관련 요소를 한번 정리해볼게요. 
 
Depth 

• 정보구조에서의 Depth는 단계를 의미합니다. 즉, 사용자가 정보를 찾아갈 때 한 번에 진입하는 단계의 수를 나타냅니다. 각 단계별로 진입할 때마다 Depth의 숫자가 하나씩 증가합니다.

Hierarchy 

• 상/하위 Depth 간에 구성된 실제 정보의 계층 및 체계를 나타냅니다. Hierarchy가 명확할수록 사용자가 원하는 정보를 쉽게 찾아가고 전체적으로 만족스러운 사용 경험을 제공할 수 있습니다.
  • 예시 : 브랜드 CJ > 브랜드 스토리  / 브랜드 CJ > 브랜드 콘텐츠

Level 

• 같은 Depth에 속하는 항목들을 나타냅니다. 한 Depth 내에서 동등한 수준의 항목들을 하나의 Level로 구분할 수 있습니다. 각 Level에 있는 항목들은 동등한 수준에서 구성되어야 하며, 이를 통해 사용자에게 일관된 정보를 제공할 수 있습니다. 예를 들어 브랜드 스토리, 브랜드 콘텐츠 처럼 하나의 Depth 내에서 서로 다른 Level에 속하는 항목들입니다.

Navigation

• 정보구조가 잘 정리된 메뉴 구조에서 사용자가 쉽게 정보를 찾아가는 흐름을 명확히 정의하는 것을 의미합니다. Navigation은 Depth, Hierarchy, Level 등의 요소들을 고려하여 사용자가 원하는 정보를 효과적으로 찾아갈 수 있도록 돕습니다. 이는 사용자의 경험을 개선하고 웹사이트 또는 앱의 사용성을 향상시키는 데 중요한 역할을 합니다.

 

4. 메뉴 형태

 
1depth 메뉴
모바일 및 간단한 관리자 시스템에 적합합니다. 이때 메뉴 수가 적은 경우에는 Top Menu 방식을, 메뉴 수가 많은 경우에는 Left Menu 방식을 권장합니다. 
메뉴 표현 형태는 Text만 사용하거나 Icon+Text 조합을 사용할 수 있으며, 메뉴명은 짧게 사용할 것을 권장합니다. 또한, 메뉴가 선택된 상태를 명확히 표시하여 사용자가 선택한 메뉴를 인식할 수 있도록 해야 합니다.

빅히트

 
2depth 메뉴 
Mobile 및 일반 사무용 시스템에 적합합니다. PC와 Mobile의 동적 UI 구성을 고려하여 메뉴를 화면의 위쪽 혹은 왼쪽에 배치하는 것을 권장합니다.
메뉴 표현 형태는 Text만 사용하거나 Icon+Text 조합을 사용할 수 있으며, 메뉴명은 가능한 짧게 사용할 것을 권장합니다. 또한, 메뉴가 선택된 상태를 명확히 표시하여 사용자가 선택한 메뉴를 명확하게 알 수 있도록 해야 합니다.

CJ

 
3depth 메뉴
일반사무용 시스템에 적합합니다. PC와 Mobile의 동적 UI 구성을 위해 메뉴를 화면의 위쪽 혹은 왼쪽에 배치하는 것을 권장합니다. 1Depth 메뉴는 5개 이하로 설계하는 것이 좋습니다. 
메뉴 표현 형태는 Text 또는 Icon과 Text 조합을 사용할 수 있으며, 메뉴명은 가능한 짧게 사용할 것을 권장합니다. 또한, 메뉴가 선택된 상태를 명확히 표시하여 사용자가 선택한 메뉴를 인식할 수 있도록 해야 합니다. Mobile의 경우에는 가능한 3Depth 구조의 설계를 피하는 것이 좋습니다.

GS 리테일

 
오늘은 IA 설계 및 메뉴 형태에 대해서 알아보았습니다.  IA 설계 및 메뉴 결정에 능숙해지려면 다양한 웹페이지를 참고하고 만들려는 웹페이지의 방향에 맞게 결정하는 것이 필요할 것입니다. 저 역시 능숙하지는 않지만요.