Redesigning a Case Study
Landing Page
Project overview
The company's case studies are used to showcase the value of their product solutions. However, the site at the time was outdated and actually hindered customer’s ability to find relevant information efficiently.
While working full-time and studying UX design part-time at Noroff, I saw an opportunity to merge both worlds. I reached out to the managing director and got approval to interview customers as part of my semester project.
So leveraging the design thinking process I collaborated with users to revamp the landing and case study pages. Since then I have updated the design with the company’s new branding.
My Role
Managing a full-time job, part-time studies and parenting often meant I would have to study late at night so I completed this project on my own, but would love to collaborate on my next one!
Research
Uncovering insights to understand how customers use case studies
My objective was to understand why customers read case studies, where and how they expect to find them and how and when they use them.
Sales had provided me with two people to contact to request an interview. In addition to these I reached out to my own contacts in the industry from the target group, such as reservoir, completion and drilling engineers. I was able to interview and test the existing site with four users in total. Miro was used to visually summarise the results from user interviews and it became clear that they use case studies to;
- Help solve unforeseen challenges
- Back-up decision making when using a product for the first time (or the company)
- Keep up to date with new technology
"I would find it easier if it was grouped maybe by topic. If I’m looking for a plug I’d probably want to jump straight into case studies for the plugs, but I might lose out on stumbling over something else that could trigger my interest”
— From user interview
The site on mobile in September 2024
Ideating
Brainstorming
Visualising the core user flow and referring to the competitor review informed the requirements for the site, synthesising these in an affinity map shaped the development of the information architecture and navigation scheme.
Utilising insights from the research phase along with inspiration from a moodboard and persona, brainstorming was used to generate ideas and solutions round how might I make:
- Case studies more discoverable
- It easier to view products used in cases studies
These were refined through iterative sketching and narrowed down to three key concepts via dot-voting.
Ideating
User testing of low fidelity wireframes
Ideating
Solution
- Updating and modernising the main navigation and footer to reflect the company's growth, including direct navigation to case studies.
- Using visual cards as well as a related case studies carousel (which would be used on product pages too).
- Tagging case study cards with latest/most read tags making them quickly identifiable.
- Giving users control over the cases they want to see through filters for well phase, location and challenge as well as being able to sort results by latest, most read and alphabetically.
- Adding links to the products used in cases to the case study page.
View Prototype
Iterating
Iterations and next steps
- Case studies and News & Events were seperated and each added to the main navigation
- A contact-us carousel was added to help customers find a person's contact details quickly from relevant pages i.e case studies and product pages
- The main filters by well phase (Topside, Completion etc.) were made more visual with small cards.
- Since this re-design the company has undergone a rebrand, so the branding has been updated - enabling more contrast.
Additional ideas include:
- A log-in area for customers to view more sensitive information - such as product success rate.
What did I learn?
Out of the contacts Sales provided I could only get one interview, however their role was not really within the target group either. Their role meant they relied on their internal systems to tell them what equipment they could use, and their sales contact to send them any information they required. They were not in a role where they would need to make a case to use certain technology. So better screening next time!
I spent far too much time on making what should’ve been basic wireframes look fancier! I wish I’d been less concerned about what users would think of them and shared more basic frames earlier. This would have given me more time on the final version.
Thanks for checking out my portfolio!
