top of page

Case Study 2: Information Architecture Redesign

Company: ListenFirst Media | Year 2020 - 2021 | Type: Social Media Analytics

Portfolio_Page_Header_Images_LF_Design_Ecosystem_940x260.png

System Simplification

- 33%

The overall system became 33% lighter after updating the entire IA, removing many redundant pages that didn't add value to customers.

Weekly Active Users

+ 12%

Weekly active users in Q1 of 2022 rose by 12% from the previous quarter since the release of the redesigned IA and navigation system reaching 10.46%.

Monthly Active Users

+ 5.2%

Monthly active users in Q1 of 2022 rose by 5.2% from the previous quarter since the release of the redesign IA and navigation system reaching 18.14%.

Background

ListenFirst Media's data analytics platform was launched initially as a social media analytics tool targeted for the Media and Entertainment industry. Over the years however, it evolved to serve more than just M&E customers; it's robust capabilities and insights began to attract clients from other industries — consumer packaged goods, retail, and health to name a few — and as it grew to serve more clients coming in from multiple industries, energy and resources were spent more on trying to keep pace with rapid customer demands/feature requests. Considerations on forming a proper information architecture to account for multiple clients from different industries took a back seat.

As a result, what was at first a simple IA to serve one specific industry quickly became a Frankenstein of sorts, adding onto the system quick, short-term solutions rather than solving for longer term issues that could potentially arise.

Given the importance of setting up the right IA for any given system, the work listed here uncovers the processes that were taken to resolve fundamental IA issues whilst also being sensitive to technical constraints and customer expectations – ensuring that the updated IA will remain familiar with what customers have already grown accustomed to but simultaneously, improve all aspects of the platform's navigation, labeling, and organizational systems.

Feedback & Pain Points

Power Users vs. Beginners

A repeating theme amongst key internal stakeholders was that the platform served power users well but did not do well in guiding new users of the system. Power users have already become accustomed to the way in which the platform functioned and thus, did not see anything inherently confusing when looking to gain access to their key insights. New users on the other hand found difficulty in adopting the system due to the following:

• Inconsistent and confusing usage of labels
• Label groupings were inconsistent which removed a user's cognitive ability to anchor themselves

Navigation System

In addition to the inconsistent labels used throughout the platform, the navigation system did not lend itself well in assisting with users' learnability/memorability factor. Interacting with the local navigation within a specific page often altered or changed the primary navigation selection without the user's direct input. This prevented users from cognitively anchoring themselves to a specific location within the system.

Auditing and Understanding the Current Sitemap

We were able to get an understanding around how the labeling and the visual navigation queues could lead to a confusing experience strictly through the UI up to this point. We were now ready to dive in a little bit deeper by running an audit on the system's sitemap. This body of work would help us get a clear picture of how the system was structured — how pages connected to one another, how categories were prioritized, and how content was organized — a tool we can use to begin identifying areas that could be simplified, reorganized, and reprioritized.

Empathy Alignment

As we were auditing the sitemap, we were simultaneously working with Marketing and the rest of the key stakeholders to solidify on our UX personas. We were able to extract 4 target personas for our platform to help us make informed decisions on our IA redesign.

Next Steps

Once we've completed the preliminary work in identifying structural gaps within the IA, including labeling, prioritization, and organization (while simultaneously working around technical constraints such as Search), we began to prep our usability test plan.

User Research Methodology: Card Sort

In this step, we've begun to gather all key stakeholders to ensure everyone was aligned to the type of research we would be conducting, how many participants we would be recruiting, and reviewing all tasks associated with the test plan.

• Selected and confirmed methodology: Closed card sort
• We've opted for a closed card sort since we did not want to shock our clients with brand new labels
• A closed cart sort was also beneficial since all of the categories were structured or built in such a way that they could not be easily combined or removed.
• Additionally, this framework would help reveal any potential differences between how our clients and our stakeholders would prioritize categories within a closed card session – giving us the opportunity to make accommodations accordingly.
• 15 participants were recruited for this test, 4 internally and 11 externally.
• There would also be some open-ended questions to see if participants had the freedom to relabel categories, how they would rename them.

Redesigned Sitemap

As we've collected and assessed the results from our research, we began to share them out with our key stakeholders. From there, we were able to simplify the entire architecture. We incorporated much of the feedback that was provided by our clients and have also made minor internal judgement calls when it came to setting hierarchy and labeling, driven by our subject matter experts.

Design Principles
• To ease beginners onto the system, we've opted to use the berry picking model in which we keep browsing behavior and client provided feedback on priorities to the very left while features that were less frequently used were pushed over to the right.
• Progressive disclosure was also incorporated to ensure that only actions most critical to a user's task on a specific page be displayed.
• With regards to structure, we've opted to go with a hierarchical architecture to make categories more relevant to users prominently displayed at the top and shown in terms of priority from left to right.

8. Navigation_V8_Presentation_Client.jpg

Major takeaways:
• Removal of duplicative pages
• Removal of repetitive local navigation
• Reordering categories based on client priorities
• Implementation of one-to-one relationships between parent to child categories
• Simpler labeling and organization systems

Adding the Final Touches

We've created our updated sitemap through client and stakeholder validation. We've redesigned our labels and reorganized content from highest to lowest priority. We've also have in hand our updated UI component library assets in which to visually polish our navigation system. And that's exactly what we did next. We gave a final polish to the primary top nav and the local navigation specific to the context of the page.

The samples below are the most current iteration of the architecture as we've quickly learned after going live that we had to rejigger the order as part of our test and learn efforts post-production.

1. Brand (Insights) Extended View 1280 NAVpx.jpg
1. Brand (Insights) Extended View 1280 NAVpx.jpg
1. Brand (Insights) Extended View 1280 NAVpx.jpg

© 2020 by ShapesnGrids. Proudly created with Wix.com

bottom of page