Preflight
In Numbers
Happy user flows
Better Conversion rate
Quicker development
Test Coverage in 2 weeks instead of 6 months
Happier Clients
Better consistency
Got acquired based on the best UX in QA automation
Overview
Client Attraction (70% more)
With the new designs we got our conversion rate to be +70% more which set us apart as very user friendly automation testing platform
AI Implementation (60% Less Errors)
We implemented a handful of AI features and made it simple to amend tests, which led to a 60% reduction in user errors and test conflicts and a more streamlined testing procedure.
User Testing (7x Better Understanding)
We ran multiple user testing that enabled us to build features that aligns with the clients’ needs
65% Coverage
Almost all of our clients could get 65% test coverage within a short time that vary from 2-4 weeks only instead of 6 months! with the new UX it was much easier to achieve.
Clients Approvals (10x Happier Clients)
We did more than 40 iterations for some pages until we got to the point our clients were extremely happy and one said “Now even my 12 years old child can QA test”
Developers & designers Excitement (5x Better consistency)
Our developers were extremely happy with the design system and our other designers who were on other part of the business were impressed and wanted to adapt to the design system as well.
Got acquired based on the UX! (Best UX in market)
It was one of the best moments of my life when we got acquired by Applitools and they told us this “We have researched many QA platforms and yours by far had the best experience in automation”
Project Brief
Preflight lets you create automated web testing scripts in seconds. You can run it in the cloud and export your test cases to your favorite libraries, like Cypress or Selenium. Preflights worked with clients at Microsoft, Yamaha, School Bytes, and JP Morgan. Preflight has a revolutionary recorder, dynamic data testing, effortless email testing, smooth checkpoint creation, automated PDF testing and API testing.
Problem Statement
While automated QA testing is something that most of the companies need, they find it complex to track and implement especially for non-technical people.
Challenges
UX all over the place
We had a lot of things going in one place
No guidance
No real direction to the user where to start and where it ends
Adding new features
We had so many features we wanted to add but no infrastructure for it
No Design System
The platform was amazing but it wasn’t following any design system, it was built randomly
Design System
I built a design system for Preflight that’s tailored to work according to our goals and need
Some product shots
Here are some part of the design that I made through using the design system
What’s a Rich Text element?
The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
Static and dynamic content editing
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!
How to customize formatting for each rich text
Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
What’s a Rich Text element?
The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
Static and dynamic content editing
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!
How to customize formatting for each rich text
Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.
What’s a Rich Text element?
The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
Static and dynamic content editing
A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!
How to customize formatting for each rich text
Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.