Information Architecture of websites and apps – what sets them apart?

Information Architecture of websites and apps – what sets them apart?

Posted by

·

The secret to a high-ranking website is a well-designed information architecture (IA). The same applies to high-ranking apps; however, even though they may belong to the same business, their IAs can be completely different. I will explore those differences in this blog while walking in the path from a website’s IA to one of its correspondent app.

Designing information architecture of apps

In the previous blog, I designed an information architecture (IA) for the New Haven Adult Continuing Education Center’s website. When creating the IA for its corresponding app, there are a few key elements we should consider.

First, we are working with a different layout and navigation. Websites often feature more complex layouts and content, typically involving various pages with navigation menus, drop-down menus, and links. Applications usually present a simplified interface with more direct and quicker navigation. Thus, their information architecture should be more focused and task-oriented.

With apps, navigation is easier, smoother, and more seamless, while websites are generally less interactive but can display more content at a glance. They also differ in their target audiences, as websites are open to the public, while apps require some effort to download and install. This difference may lead to varying user goals between the two.

Overall, it seems that even though they may share the same name and logo, their designs are quite different, catering to distinct populations with varying needs.

Designing Information architecture of the Adult Education Center app

Considering the key points mentioned above, I aim to design the IA for The New Haven Adult Continuing Education Center’s app. This nonprofit organization is dedicated to assisting adult learners through various educational programs, including English as a Second Language, High School Credit courses, and many others.

It is quite tempting to begin the design with the school’s website IA, which I designed in the previous blog. However, due to the significant differences between the platforms, I have opted to take a different approach.

Step 1: Research school apps

I have analyzed several community school apps and looked into the offered features and the overall user experience. These include Brooklyn College, Bristol Community College, Bronx Community College, and other institutions nationwide. Contrary to their correspondent website, those apps are very oriented towards their existing students. The apps offer everything the student needs, from course registration to submitting payments. All other data about the school itself, history, galleries, and other irrelevant data is not included in the app.

Step 2: Identifying the apps users need

To design a student-task-oriented IA, I streamlined the user’s needs into four main goals: registering for courses, paying tuition, receiving real-time school updates, and conducting academic tasks such as submitting homework and obtaining grades. Those four categories are supposed to meet the user demands and enhance user experience.

Step 3: Eliminating the clutter of the website’s app

I have identified several features in the website’s IA that did not align with typical user goals and everyday needs. For example, the primary message- National Data & Impact, staff directory, graduation topics, photos, and video galleries, among others- simply didn’t make the cut.

Step 4: Organizing the app’s IA

The app’s target audience mainly includes students for whom English is not their first language and who typically lack a strong academic background. Therefore, the proposed app’s IA should be simple and straightforward, with a clear path for each task.

This IA highlights four key user objectives in the global navigation: registration, payments, updates, and academic work. Each section is designed to ensure a smooth user experience, enabling users to navigate the app effortlessly and engage with its offerings.

Reflections:

In this project, I explored the differences in designing the information architecture of the same business across different platforms. I realized that several key factors drive the foundation of the design. These include user needs for each platform, the limitations and unique properties of the platform, and factors related to user experience.

As the tech world evolves and more platforms emerge (such as watches, glasses, and car systems), designing IA may become a more challenging task. I believe this will require a deep understanding of each platform to achieve both business success and fulfill user needs.


Credits: All the ilustrations are created by the author.

Mauricio Zúñiga Avatar

About the author

Hello, My name is Mauricio Zúñiga. I am an enthusiastic entry-level UX designer who is captivated by mind-blowing yet easy-to-navigate websites. I excel in converting abstract concepts into mesmerizing, user-friendly web experiences, always focusing on the user’s essential needs.

Discover more from Mauricio Zúñiga

Subscribe now to keep reading and get access to the full archive.

Continue reading