Muiz Haruna

Dec 18, 2021

4 min read

Information Architecture { Week 3 }

The science of organizing and structuring content in a logical and user-friendly manner is Information Architecture.

Information Architecture (IA) is a combination of Library Science and Cognitive psychology.

IA helps the:
1. Designer thinks about different types of users and how they will navigate, search or Use filters.
2. User to reach their goals quickly as possible.

The key process for information Architecture

- Define the company's goal, objective.
- Define the user's goal through Interviews and Personas.
- Evaluate the competitors; Where do they display their information? Is their website easy to navigate? Their strengths and weaknesses.
- Define your contents.

How to design the Information Architecture for an app or website

1. Group the content. Congregate similar contents together using the card sorting technique or any other technique.
2. Create a sitemap. A sitemap is a visual representation of different content areas (looks like a family tree).
3. Outline the navigation structure e.g Home / About us / Awards.
4. Refine the content label. It should be accurate, meaningful, and concise. Take the tone of the brand to collaborate with the content.
5. Create wireframes and conduct user testing via tree testing, click testing etcetera. Make sure you test often and early.

The value of Information Architecture

Content is the reason people visit a website, Time is the most precious resource people have.
If the effort is high, people abandon the source, when people abandon an app or a website, it is more difficult to bring them back. We live in a world where people find solutions to their problems with the least amount of effort.
It is the architect's task to make the user focus on their task, not the user finding their way around.

Cognitive psychology is the study of how the human mind works including the mental activities that take place in the brain and factors affecting human perception.

Key elements to Cognitive psychology
Gestalt Principle - explores user's visual perception of objects to each other in terms of similarity, continuity, proximity, symmetry, closure.
Mental model - this is the assumptions people make in their minds before interacting with a product. Information should be placed where users expect to find it. For example, contact information should be in the link "contact".
Cognitive load - this is the amount of brainpower that a user has to invest in interacting with a product. This covers the amount of information a person can process at a time which includes selecting an option from a wide variety.

Introduction to User stories

User story puts the user In the heart of the conversation and helps to define requirements, empathy into the product.
User story <=> Features

What is the user story for?

- To define project principles and requirements.
- To prioritize features.
- To use in the design process.

User Flows

Diagrams that display the complete path a user takes when using a product. It's the layout of the user movement through the product, mapping out each step from entry to final / exit.

Types of User flow
1. Task flow - It shows only one path and does not include multiple branches. Focuses on how users travel through an app while performing a task.
2. Wire flow - A combination of wireframe and flowchart. It utilizes the layout of individual screens as elements with the diagram.

When users can easily flow through an interface without hurdles or confusion, there is a great possibility that they will purchase the product or visit the site again.

UX design sitemaps

A diagram of all levels in an application or website. A tree-like structure of pages/buttons/links of a website or app.
A top-down structure of a whole website or application.

The tasks I did for week 3 are:

1. The sitemap for "The Literary Edit - Book Blog | Book Reviews | Beautiful Bookstores & Literary Travel For Book Lovers (thelitedit.com)" website.
2. The task flow or user flow for a user that wants to “read and comment on a book post “ on the website.
3. The user flow for user authentication on a product which I chose Figma.