Showpad: Brand and Website Refresh
Branding, Web Design
As a lead designer on this project, I revamped the most important Showpad marketing pages to reflect a new bolder brand and clearer messaging. For the duration of 6 months, I designed multiple tests based on data findings and continued experimenting to improve the UX of our website.
Brand Refresh
As part of this brand refresh, we collaborated with DemoDuck on a new explainer video. During the video production there were also photos taken for us, which became the main pillar of our new assets. We were part of the art direction, our creative director was on set and collaborated closely throghout the whole process.
Website Evolution
Before
- navigation taking up too much real estate
- hero is not engaging or interactive
- not showing our product
- vague, undescriptive CTAs
- americanized, complex messaging
- stock photos, bland brand
After
- compact, user-friendly navigation
- immersive fullscreen hero with product animation
- product features section
- descriptive, clear CTAs
- straightforward messaging
- custom photography, bold brand
Process
1. Research & Wireframes
After using feedback from users through Hotjar and Google Analytics data, we identified the key pain points in the previous design. After that we brainstormed with the whole marketing team on the new content. I also looked at UX best practices to spot any additional improvement areas. This gave the basis for the wireframing. I explored also different versions for the navigation, as this needed a serious overhaul.
2. Brand Exploration
With UX improvements, we also wanted to refresh our brand. It had to be bolder, clearer and more unique to differentiate us from competitors. This was a great moment to experiment with lots of ideas. One of the main focus was to replace our stock photography with custom images. With the help of Demo Duck, we created a new art direction featuring color blocking and authentic business personas. This refreshed brand has been implemented then in the various assets of our marketing content.
3. UI Library & Development
After finalizing the design changes on the wesbite, I started a collaborative project with one of our developers to unifiy the UI elements of our website. Previously, we had a lot of different heading styles, that didn't have any hierarchy. The library helps us moving forward pulling existing elements, so we don't have to recreate everything manually. It also helps keeping the elements organized.
Testing & Experimenting
The Challenge
With previous projects, we often raced towards a deadline, launched new assets and then said them goodbye. This time I wanted to bring design thinking to our team from start to 'finish'. After launching the new website, I kept monitoring the key pages through Hotjar and Google Analytics. In the meantime, I also participated in a course over UX best practices by NN Group. This gave me a solid base to start experimentation our website. We still used CTAs like 'Get Started Today!', so I A/B tested two better, more descriptive CTAs in the hero of the homepage. The goal was to inspire the entire marketing team to think about continuous improvement and experimentation and eventually it to became the mindset.
Other pages
Next to the homepage, I researched the user experience on the demo page to drive more conversions. The form, CTA and the messaging was updated to provide better description of our demo process and easier access. We also updated the Product and Resources section.
Results
- Identifyied opportunities for web UX improvements.
- Introduced design thinking to the team.
- Started the first A/B testing on the website, which increased our demo conversion rate.
- Increased average time spent on homepage.
- Experimentation became a mindset for the whole team.
Team
Showpad Creative Team
Creative Direction: Emily Henthorn
Lead Designer: Netta Szabo
Graphic Design: Sofie van den Bergh
Web Development: Joao Lopes & Allison Lautz