Information Architecture

This project was submitted as part of the HCI Design MSc.

This project required us to capture Information Architecture requirements in an information-rich domain. The chosen domain was “Coffee”. We designed the IA of the website promoting everything around the beverage.

.

Role and Approach

Domain expert interviews

Online card-sorting

Tree-testing

User journey

Wireframes

User testing

Six weeks

Tools

Miro

Figma

Optimal Sort

Project time

Six weeks

Background

The website domain was coffee. The purpose of this website was to provide a wide range of knowledge to coffee lovers and people new to the beverage. On the website, coffee lovers can find information on the history of coffee, the cultivation process, coffee recipes, brands and the best cafes to visit in London.

The main aim of this project was to understand Information Architecture and its process. The project involved interviewing domain experts, creating a domain map, a sitemap, a user journey and several wireframes. However, due to the limited timeframe, user evaluation was excluded. 

User Research

Design Process

To clearly understand the domain, I started the research process by conducting semi-structured interviews with three domain experts. The interviews were conducted informally to enable participants to express their views on their terms.

After gathering as much data as possible, the domain model was created to get a visual image of the concept and what should be included in the website.

Diagram A: Domain model

The domain model was the foundation for the development of the sitemap, as it represented the concept of how the website could turn out to be and how users could navigate with it. It was essential to create understandable and consistent labels for users. Hence, I conducted a card sort task with eight participants to understand how potential users would organise labels into categories.  The results from the card sort were used to lay out the sitemap.

A second test was also conducted. A tree test was run with five participants to ensure that the site's structure was practical and easy for users to find the required information.

Sitemap Planning

Diagram B: Sitemap

User Journey

Once the sitemap was completed, creating a user journey task was next. This was done to demonstrate different paths in which users would achieve the given task by either searching or browsing.

It was essential to create a scenario that was broad enough in order to include every possible step the user may wish to take to accomplish the final task.

Task: “The user wants to find a cafe in London where they can try Colombian coffee.”

Diagram C: User Journey

To design the global navigation on the wireframes, I used the sitemap to guide me through the design process. Four sets of wireframes were designed, pages that were interesting for potential users.

Wireframes