Museum of Modern Art
The Museum Of Modern Art is an essential institution in contemporary design, and its online retailer is more than a digital gift shop, featuring a wide range of inventory.
Amazon and other major retailers are its direct competitors.
Focusing on responsive design and feature implementation, MoMA’s online shop can boost sales with a more sensible experience navigating through the site. This can add to an increase in memberships and return customers.
I conducted the contextual inquiry with my research partner, and charted the competitive analysis for MoMA’s online site. In addition to merging our heuristic evaluations, I also contributed to the foundational layout of our initial sitemap. Our card sorts were extensive, and we put in equal amounts of hard work. We delivered our research as a team, but everything beyond that is all me: design, user tests, updated IA, etc. It was a great opportunity to advance my design skills by being unable to divvy up the work with anyone else.
Living in New York City, my research partner and I had the opportunity to go to the physical store that sits across the street from the Museum of Modern Art.
For a contextual inquiry, we spoke to three sets of customers and a store manager with great insights to MoMA's online retail culture. Our key takeaways were that:
- Customers like to browse without a real plan
- Typical customers = foreign tourists and locals who are often members
- NYC locals often browse back and forth between physical and online stores
We did a comparative analysis of their online store against a favorite from each of the personas we were provided with. Stacking MoMA against Urban Outfitters, Banana Republic, and IKEA, we identified potential design influences as we saw how other retailers satisfied our personas' needs.
I also did a competitive analysis of MoMA against its main competitors, which includes the Whitney Museum and the Guggenheim along with AplusR, a modern home accessories store that caters to a similar audience. We also compared user flows with the two museums to evaluate the journey from home to purchase.
My partner and I each did our own heuristic analyses, and then discussed and combined them into one. We examined MoMA's site using aspects of Nielsen Usability Heuristics, as these principles are built on a foundation of simplicity, and our overall task was to minimize the clutter on the site's design and IA.
In preparation of redesigning the primary and secondary navigation, we collaborated on an initial sitemap to clarify the information architecture behind the current interface.
Threading that into our user research, we did a thorough amount of card sorting to see how real people would categorize the wide inventory that MoMA has to offer.
The open card sort featured index cards with the site's current primary and secondary navigation, and users were asked to assemble these categories as they saw fit. We translated our open card sort results in OmniGraffle and pinned them up with our personas to update the site's primary navigation.
We then did a closed card sort with a different set of users, which included 100 products from MoMA's retail site and our new navigation. The results of our tests revealed the structure of our secondary navigation.
While all three personas were equally integral to our discovery phase, we chose Daria as our primary persona to define our process. As the project shifted from a collaborative to a solo design effort, I considered her goals alongside MoMA's.
- Expedited checkout process
- Share NYC culture with people back home
- Review products on MoMA's mobile site
- Profit (user buys more items)
- New users (word of mouth)
- Return users (build trust)
Considering all three personas, the feature prioritization chart on the right examines the cost - of both time and money - and necessity of features that would enhance their online retail experience. Three new features were chosen:
- Post-purchase sharing
- Mobile product reviews
- Express checkout
This also confirmed my minimum viable product, which included a home screen, category and product pages, and express checkout. The post-purchase sharing screen would be designed for mobile since it is Daria's primary device, and the prototype was done for iOS.
Sketching came easy with so much research and real-life interactions with users to back up my solutions. Due to the heavy amount of design and testing that needed to be done with such limited time, I quickly moved from paper and medium-fidelity wireframes to high-fidelity mockups.
While translating my ideas, I made sure to keep Urban Outfitters in mind, one of Daria's favorite retail sites.
The mobile prototype included all three features in its updated user flow, and my user test script covered them along with a login process, which is essential to the Express Buy feature.
Rounds of usability testing on users similar to Daria inspired my iterations. Some key takeaways include:
- Ability to edit stored details within Express Buy (pictured)
- A more interactive and legible post-purchase share (pictured)
- An overall customer review rating at top of product page
- Remove number of customer reviews per star rating
The updated sitemap below showcases the primary and secondary navigation redesign, which converts Gifts, New, Sale, and other similar items to filters and minimizes the primary navigation. The secondary navigation follows the result of card sorts, and is inspired by the layout of Urban Outfitters, as shown on the right.
The prototype's user flow is a repetitive cycle for Daria, satisfying all of Daria's goals, and working towards those of MoMA's. The discoverability and clarity of the updated responsive redesign makes it even easier to purchase an item, and - in addition to its current membership perks and discounts - encourages users to return and buy again and again.
(P.S. This project was not commissioned by the Museum of Modern Art. It was assigned by General Assembly.)