Over the past 8 months, our teams have been hard at work on something brand new. Today marks the rollout of our most ambitious service update yet – a complete overhaul of our visual language.
How we found inspiration
In order to Move Fast Without Breaking Things, we felt we needed to completely self-disrupt the way we approached building our product. We needed a way to innovate quickly while keeping in line with our values.
For this, we knew we needed a design language that’s fundamentally simple and universally loved. Nothing that isn’t simple and fun can survive in a world where everyone’s a critic.
That’s when we realized there’s no typeface that’s more universally loved, iconic, and conversational than Comic Sans.
Comic Sans is the pinnacle of typeface development
– Jonathan Ive, Chief Design Officer, Pineapple
Its wide adoption is exactly what led us to find it. In a way, you could say that Comic Sans found us.
This note was put up by our lovely office manager. This just goes to prove that you don’t need a fancy design diploma to make great design happen.
The building blocks of The Iconic Fun Design Language™
The Iconic Fun Design Language™ is comprised of small, reusable components which can be used for rapidly building out delightful user experiences. Every detail has been designed with the end user in mind.
The Iconic Fun Design Language ™ is not just about typeface or colors. It’s a mindset that spreads through organisations, guiding innovation and teamwork.
That said, it’s also about the colors. We found that when comparing black text on a white or light grey background against white text on flashing neon colors, the flashing neon colors were generally interpreted as more eye-catching.
Our designers ran with this insight.
Brand logo variations
It’s important for us to cover the challenges designers face daily. That’s why we included the most commonly requested logotype variants in the official style guide right from the start.
The Invisible Button
An excellent example of enabling fast iteration for our development teams is the redesigned disabled button state.
Previously, our application had dozens of different button types with different behavioural characteristics and designs. To simplify this, we now have just six – three size variants of the Button, and three of the Invisible Button (patent pending).
- the small Button
- the medium Button
- the large Button
- the small Invisible Button
- the medium Invisible Button
- the large Invisible Button
We found that Invisible Buttons work well due to almost eliminating the temptation to click them. When A/B testing Invisible Buttons against greyed-out buttons, Invisible Buttons yielded 83% fewer unwanted clicks in our tests.
Unopinionated option toggles
For buttons that toggle between different states – for example in settings menu – the code can quickly grow unmanageable without good tools. To combat this, we are introducing Stateless Buttons (™), encouraging experimentation and playing around to figure out what you currently have selected. Each of the Stateless Buttons (™) only says ‘toggle’. It doesn’t get any simpler than that.
Data is beautiful, and one of the goals of The Iconic Fun Design Language (™) is enabling the beauty of it to be seen by everyone. Each graph now comes complete with our Iconic Fun Graph Coloring (patent pending).
Every day, more and more people find themselves looking at computer or smartphone screens at the wrong angle. At Testlio, we don’t believe there is a right angle for looking at any given screen.
We are proud to be the first to announce Bunk Bed View for the rotationally impaired.
Finally turning our attention to this is a huge step for Testlio’s accessibility efforts and we hope to deliver a lot more accessibility features similar to the Bunk Bed View over the coming months.
Paving a way for the future
We are building a world where the differences between disciplines are blurred, where logic and design truly coexist, and where collaboration is not painful but inspiring. This approach ensures that we’re delivering a simplified experience that’s more intuitive, familiar and sparks joy for our members.
If you are part of our expert tester community, you can log in and experience these changes now by simply using the UX settings dropdown menu next to the company logo in the header.