We redesigned our website! It was no small feat, requiring months of work from our marketing and design teams. It’s still a work in progress, but it’s something I can be proud to share with customers and friends.
When we started working on the redesign, we only had product designers, no brand designers, on the team. It was daunting to start a project without the specific expertise needed in-house. But when we reframed the project as a product exercise, our design team figured out how to apply our product design skills to the new challenge. This is what we learned.
Always Start by Listening to Build Empathy
This project was about more than just a website – we needed a new visual direction for our brand. So we started where we start every product process: listening to people. We attended a brand workshop with Agata Celmerowski of Velocity by Design, who helped the leaders in our company distill what makes Customer.io special. We also looked back at all the things we had heard and seen from customers through rituals like our weekly review of FullStory sessions and customer interviews.
By listening to our leaders and customers, we zeroed in on a clear brand story: we empower people to create their most audacious messaging ideas. Our product has incredible flexibility and depth; that means there are few limits to what people can accomplish if they dream. We needed to communicate that aspirational ideal through our designs.
Use Familiar Patterns and Find Outside Inspiration
Next, we looked elsewhere at what makes a great website. Part of our product design philosophy at Customer.io is that using well-known patterns makes UX more intuitive. We’ll almost always use a familiar design element instead of creating something avant-garde from scratch.
We looked for common elements in other SaaS tools’ websites that tell their product’s story well, like Helpscout, Webflow, Miro. These commonalities stood out:
Remember Your Design Fundamentals
Once we had a good idea of the visual direction and appropriate patterns, we started designing pages. The marketing team provided most of the content, so we drew on our knowledge of design fundamentals to turn that content into an enjoyable experience:
Design Systems FTW
One of the most impactful product design tools we used was systemization. As we designed, we chose a few decorative elements and applied them to many different scenarios rather than making custom patterns and decorations for each page. Consistency shows our visitors we are mature but also lessens the cognitive load on them as they browse the site. We also systemized typography and color, making it easier for non-designers to build pages in the future.
Ask for Feedback and Iterate
As product designers, we know how to get feedback and make iterations based on what people say. We presented the work-in-progress design to the entire company, starting with our learnings from listening at the beginning of the process. We didn’t only want feedback on illustrations and header text – we wanted to make sure the direction resonated with the people who built this company. Everyone from Product Managers to Tech Support gave us feedback that led to improvements. Thanks, team!
I’m proud of what we made. Even without brand design expertise, we figured out how to apply our existing product design skills to create something true to our brand.
But do yourself a favor. Brand design is a full-time job – hire a brand designer! Khari joined our team last month. I can’t wait to see where he takes us!