Client
Kinto Flex/Share
Timeline
1 Year
Services
App Design, Consultancy & Design System
Before working on Pipster, I captured the business objectives and conducted multiple research methods to gain a deep understanding of the users I was designing the product for.
Below is a copy of the competitive analysis deck which shows the key insights from top competitors
Since KINTO was an existing product, I had access to extensive data. I was able to capture the full onboarding journey, identify experience issues, and validate them using analytics and Hotjar insights. This was key as it helped identify which problems the users are having.
Created sets of personas to understand the different user types of KINTO and how they can be grouped by personality and emotional traits. This was key to defining who I was designing for.
Analyzed usersโ positive and negative emotions, then grouped them into a map to associate each type with specific traits
Identifying key user traits and types to understand the specific journeys they would take to access our service
Dove deep to map each step of the user journey, capturing their emotions, needs, and pain points, while identifying all key touchpoints.
To ensure a seamless onboarding experience for the car leasing platform, the journey needed to be highly refined and well-mapped. I began by capturing all onboarding requirements from the business, legal, vendors, KYC partners, and customer criteria
Defining the information architecture was essential before designing the website. Having the existing product as a reference provided a good starting point, but I also structured the IA based on user preferences by validating it through tree testing.
To ensure the productโs success, it was essential to design the B2B backend dashboard. This allows all information from the B2C website onboarding to flow into a central back end hub, giving the business clear visibility of all activities that happens on the front end client facing site
Below, I began structuring the sitemap for the main B2C website to map out all the pages and information needed for design, but to also understand where they will live.
A key success metric for the product was refining the onboarding journey. It was essential to understand not only the happy path but also all potential edge cases. I was able to capture critical information as part of this flow
I started with a mobile-first approach, focusing on the onboarding journey visuals in collaboration with Onfido. What you see below is part of the flow, which was developed alongside the web experience.
Below are the visuals for selecting a vehicle and its available extras. Once confirmed, users begin the full onboarding journey, part of which is shown on the right.
Below, Iโve highlighted the delivery method for the car and the review process before subscribing to the service
Below is the visual of the central hub for all KINTO brands.
Below was the main page that users are greeted to to select their desired car
I thoroughly broke down all the components of the website to ensure each element was designed with careful consideration
Before starting the onboarding journey, it was essential to display a โHow It Worksโ page, keeping customers informed about the information they would need to prepare
Working with Onfido embeds it was essential that the website worked with the vendor in order to onboard users safely
Once the user subscribes to the service, the information is fed into a backend dashboard for the business, triggering a separate process focused on business operations
Below, you can see all the vehicles that have been booked, along with related information such as service and maintenance needs. You can also track when the vehicle is ready to be handed over to the client.
Customer data, collected through the onboarding KYC process, is stored in a backend system, allowing access to booking history and updates to personal information.
When building the product, it was essential to follow strong accessibility standards, using WCAG guidelines to inform choices around text, color, and visual elementsโensuring the experience was inclusive and usable for all, including users with color blindness.
Built a fully functional component library featuring reusable components tailored for all use cases across mobile, web, tablet, and native applicationsโensuring consistency, scalability, and efficiency in design and development.
Defined comprehensive guidelines for each component, providing context behind their meaning and how they should be used
