Prototyping the product
This case study is about a website migration and is primarily about information architecture, user experience, product management and prototyping.
The problem
Ashridge Executive Education is the executive education programme of Hult International Business School. I was asked to take a look at the current site and propose how it could be restructured in order to meet Ashridge House's business goals. There were some initial constraints set as the site was part of a wider migration that Hult International Business School was undertaking. The primary KPI was around lead generation with a focus on mobile. There was some initial analysis into understanding what the current problems with conversion were.
I spoke with stakeholders to understand their objectives and asked what challenges they faced, what things worked and what problems needed to be solved. I carried user-journey mapping and empathy-mapping workshops and created a set of personas.
The majority of the existing problems were around content, terminology and focus. There was a great deal of content that either wasn't relevant or if it was relevant was very hard to find. There were limitations with the existing content management system which resulted in convoluted user flows and a structure that wasn't sustainable. Many of the existing flows had no clear path and resulted in multiple outcomes.
I proposed a content audit, redesigned the information architecture and iterated over several sitemaps.
Content-first
The content management system was being migrated to a different platform so there wasn't a great deal of time available. I was also only contracted for 8 weeks. As part of my content audit I helped identify and prioritise what existing content could be re-used, which things could be cleaned up and what new content needed to be written from scratch. I defined a schema for each type of section, page and content type.
We hired a copyrighter and I assisted in the overall content strategy and managing of the process.
Prototyping the right way
Prototyping is a vital part of the Product Design process but as a consultant—who only briefly dips into an organsation—it's often hard to make a prototype that is relevant or useful.
One of the deliverables I was requested to provide was "clickable wireframes". I always question the value of the wireframing process, it has value but often is a step that can either be simplified or skipped.
We built a component library which sat within Storyblok (a headless content management system which generated static pages using Gatsby). Storyblok provided a mobile-first interface for building pages out of blocks of content and components.
I decided to prototype the site using the content management system itself. It was a work in progress but there was more than enough functionality to carry out what I needed to do and rapidly map out the entire structure of the site. It also gave me the opportunity to give some input to the wider team about the features the content management system needed and create components that didn't exist.
We ended up with a living, working document where the entire team could edit content in real-time and view it in the right context.
At the end of the process I had nothing to hand over. I had maximised the time I had available in order to focus on the important things; content, structure and design (not constantly reviewing and updating wireframes).
If I'd followed the original plan on my last day I would have handed over a pile of wireframes that somebody else would then have to interpret, create templates from and import all the content into.
When I finished there was just a draft website sitting there waiting for somebody to hit "publish". This is another great benefit of working with a solid design system.
The process was more or less glitch-free and the initial phase was finished with enough time for me to finish and head off for some paternity leave during November/December.