MOO kickstarted their success with a neat Flickr integration and had since grown a very strong brand and loyal customer base. Their core audience were young creatives and geeks who were drawn in by the unique shape, size and quality of the cards and the ability to print a different image on each of the cards in a pack and therefore showcase their portfolio of photos.

By 2009, when I joined, a few things had happened that meant MOO needed to overhaul it’s website:

• The technology and code was the result over 4-5 years of manic startup development and iterations and needed a rewrite.
• The design and navigation had started to become inconsistent as features and products had been bolted on over time.
• The business had discovered that selling standard sized business cards SME’s was where their future lied.
• Investment had been secured so a stable and scalable website was needed to support extreme growth in the coming years.

For me, this was an incredibly exciting and quite intimidating challenge for a number of reasons:

• MOO was already well-known within the industry for the strength of its user experience and brand. MOO has genuine fans. We needed to undertake a complete redesign without alienating that existing fan base.
• The website was a multi-faceted service. Product and brand-building editorial pages, a rich application for designing and building the cards, an e-commerce checkout process, after-sales support, physical products. This was a service design job really.
• I was a UX team of one. I would be doing formative user research, strategy, interaction design, information architecture, prototyping, some visual design, usability testing etc.
• The company was at a really interesting size — about 30 people. Small enough to feel like one team; established enough that people knew their roles and the where they were heading. Early stage enough to still be everyone’s baby; expanding enough for growing pains to begin showing.

Research

After a series of stakeholder interviews it became clear that we needed to understand our new target customers a bit better and see how the current website worked for them.

I set up a week of ‘ethnographic’ research sessions with target customers and head out on the road with the Head of Product.

Each session started with an informal chat to understand the person, their business and their need for business cards. I would then ask them to let me observe them finding and ordering business cards online, using a scenario they had described to me earlier. This meant that I had a deep understanding of peoples geniune goals and contexts when looking for business cards in order to understand what MOO needed to do to ensure it attracted new customers. Most users would start with a Google search. A lot could be learnt from observing what search query people used, how they chose which search results to click on, what trigger words they were looking for and what worked well and what didn’t when the followed through on competitor websites. The final part of the session was observing them trying to navigate the complete moo.com ordering process; all but one participants would have given up had I not encouraged them to follow through so I could observe later steps in the flow.

We learnt a LOT in these sessions and it was clear that the current incarnation of moo.com was not working for the new target audience. I needed to bring these insights in-house to the wider team. I produced detailed notes from each session, edited hours of video and ran several presentations and workshops with the rest of the wider team.

The research highlighted various usability issues and what MOO was performing well with but there were also two fundamental issues that the redesign needed to address:

1. The entire flow for building business cards was counter-intuitive and went against most people’s mental models of business cards.
2. The brand and visual identity was not deemed professional or ‘grown up’ enough for many of the SME’s.

Evaluating the existing user journey

The fundamental problem was that the implementation model of the website didn’t fit with the new target customers mental model. The website had been optimised perfectly for users coming to print out a batch of photos — existing users found it very easy to use. However for the new target users wanting a pack of business cards the flow was completely counter-intuitive.

The research showed that there are 4 core scenarios that need to be supported for ordering business cards:

1. I have complete artwork and I just want to upload and print it.
2. I have a company logo or imagery that I want to use but no design.
3. I have nothing yet, I am looking for a design to add my details to.
4. I already know MOO and I want to print a range of images on the back of my business cards.

After the business card product page all users would arrive at a page where they were asked to choose how they would like to make their business cards. This caused lots of problems for scenarios 1 to 4 as it is assumed that the user already know that MOO business cards are always double-sided and that by default MOO expects you to want several different designs in one print. In most cases this isn’t the case.

Ready made designs route

Designing a new user journey

The new user journey for building business cards went through many prototypes and were constantly refined through usability testing. These started with hand sketched designs on the wall, then on to simple PDF click-throughs and then to fully-interactive and animated coded prototypes. Many further refinements were meant during agile development.