Amoeba Music

Services: Information Architecture, UI, User Research

Amoeba Music is an independent music retailer with stores in Berkeley, San Francisco, and Los Angeles, CA. They are iconic in the music scene for offering a wide assortment of products, from vintage and new music, movies, to everything in-between.

I was hired by Amoeba to enhance the information architecture of their website to support two primary business objectives: increasing online sales and driving more in-store visits.

By understanding the needs of two key user groups—first-time visitors seeking clear access to location- and item-specific information, and loyal customers looking for interactive, brand-aligned experiences—the redesign aimed to create a simple and intuitive user interface.

Problem:

How might we make it easier for users to find and purchase items online while encouraging them to visit Amoeba’s physical locations?

Goal:

Design a simple and intuitive user interface reflecting Amoeba’s distinctive brand reputation as a community-driven music retailer.

Content Audit

I began Amoeba’s information architecture redesign by conducting a thorough content audit of the website. Suffice to say, there was a ton of content to sift through, but luckily for me my skilled Spreadsheet Assistant shouldered most of the burden (many thanks, Google Sheets). By categorizing and analyzing the existing content, I was able to visualize how the site's pages were distributed across sections.

Results:

Close to half of the pages were dedicated to the Music category, followed by Albums and Artists. This indicated the site's strong focus on music product offerings. Smaller sections like Policies, Movies, and General information reflected areas that needed clarification in the upcoming phases of the project. Some categories, like gift cards and cart pages, initially appeared ambiguous in where to place them. Ultimately, I hoped to gain a better sense of how real users would categorize Amoeba’s content through a Card Sorting activity.

Card Sorting

This open card sorting activity was an essential step in refining Amoeba Music's website structure. The activity involved 10 participants who all had online shopping experience. Participants were tasked with sorting 38 cards representing the website’s content into categories that made sense to them.

While most of my participants were calmly grouping the site’s content together, I had one who clearly has a disdain for record labels - “@#$%& record labels!” he said as he read the card. I’m not sure which label he has beef with but maybe take it up with them, man?

Results:

After taking a look at the response data, there were clear patterns that emerged. For example, participants strongly agreed on a General Info category, which included items like About Us, Contact Us, FAQs, and Store Locations. Additionally, participants grouped content like Buy, Cart, Gift Certificates, and Shipping into a Shopping category. Lastly, about half the participants created a Merchandise category for posters, stickers, and T-shirts.

That said, not everything was as straightforward as it seemed. Content like In-Store Signings and Trending Albums were particularly challenging to categorize, revealing areas where further research was needed. Most surprisingly, almost all users grouped CDs and Vinyl together, yet there was disagreement on what to call that category.

The Initial Sitemap

Overview:

Based off of the card sorting responses, I normalized the categories of content on Amoeba’s website and reflected these changes when building the initial sitemap. Most users included a General Info category, which I named Store Info. Additionally, users had a Shopping category with content such as Buy, Sell, and Shipping to name a few. This helped guide how I laid out shopping content on the sitemap.

I labeled the Amoeba Spotlight and Sounds & Stories pages to give loyal customers a place find more niche and specific content or information. The Store Info page gives new users the ability to learn more about Amoeba as a company (location, contact info, policies, etc.). Despite this initial iteration, I needed to test the sitemap with users through a Tree Test to determine the efficacy and clarity of the proposed site structure.

Tree Testing

The tree test involved eight total participants, with 50% of them having previously shopped in-store at an Amoeba location (this was exciting to hear because so far no other participants had been familiar with the shopping experience at Amoeba).

Participants were tasked with navigating a simplified, text-only version of Amoeba’s website to find specific information related to purchasing music, selling old records, or finding information about in-store events. The goal of this tree test was to determine if the site structure makes sense so users can locate information intuitively.

Results:

The results of this test were extremely informative and provided some surprising insights for the current structure. For instance, users had trouble finding info related to selling albums to Amoeba, with 5 of 8 users looking in either Music or Merchandise first. This suggested to me that their mental model for selling products is related to buying products.

There were multiple insights like the one mentioned above which informed me that the current site structure needed adjustments in both content labeling (i.e., Sounds & Stories) and content hierarchy (i.e., Selling, Amoeba Exclusives, Albums/Artists).

Final Sitemap

Overview:

I made some major changes to the sitemap and proposed this final structure. A notable change was moving Albums a page lower within the hierarchy as users overwhelmingly looked for this content within the Artists page. Additionally, I consolidated content from Sounds & Stories (and removed this page altogether) to be included in Amoeba Spotlight page to serve as the curated content section on Amoeba’s website. Lastly, I moved Selling, and relabeled it Sell & Trade, from the Store Info page and added this page under both Music and Movies given users are expecting this information to be in close proximity to sections related to buying items. At this stage it was time to move into creating wireframes of Amoeba’s website based on this sitemap.

Navigation and Wayfinding Wireframes

Conclusion:

After working with our users to determine the best way to organize Amoeba.com’s content, it was time to redesign the website’s navigation and wayfinding structures, as well as the search/filtering system. I approached this aspect of the project from a mobile-first perspective given the pervasiveness of cell phones in our lives—this guided the initial navigation design process.

The website follows responsive design principles, featuring a hamburger menu for primary navigation and utility navigation for account and cart access. A search bar allows instant product, event, or content searches. The homepage incorporates wayfinding cues like button hierarchy, footer navigation, and social media icons. Breadcrumbs, titles, imagery, and pagination provide contextual cues throughout the site. Search results display the number of items and offer filter and sort options via overlay menus and modals, with facets, checkboxes, tags, and a search bar within filters for efficient query refinement.

Working with Amoeba on this information architecture redesign was a rewarding and challenging process—I hope these improvements will be considered for implementation as users will find the new experience intuitive and enjoyable, thereby increasing sales across all product categories. I’m happy to discuss any aspect of this project so please feel free to reach out. Ultimately, I’d love to get user feedback on these wireframes so we can continue to improve the online Amoeba experience.