cinch — Transforming The App Homepage

Aligning the App Experience with User Needs & Web Success

The Problem

From March to December 2024, the business roadmap prioritised improving ownership and retention features, yet the app homepage remained unchanged since its launch.

Fig 1.1 — Current app homepage for new users.

During this period, the web team successfully launched new homepage features. The app squad aimed to align with these updates to ensure platform consistency and a cohesive user experience.

The newly optimised web homepage hero introduced budget filters, allowing users to refine their search before accessing the main results page. This aimed to improve Engagement and increase user intent.

Fig 1.2 — New homepage hero search component featuring search by budget filters.

Data from two weeks before and after the web release in February 2024 showed that the budget filter attracted more users to the main search with no detectable negative impact on conversion.

The Solution: Homepage Enhancements

Given the success of the web feature, the squad allocated time in the roadmap to integrate a similar experience within the native app. Additionally, feedback from an internal “app flair” workshop highlighted an opportunity to enhance the homepage with more personality and personalisation.

Usability Testing Round 1

Working with the user research team, I conducted a remote unmoderated study (card sort and survey) with 20 participants to validate:

• Interpretation of existing web homepage features.
• Desires for new features.
• Website content to boost confidence in searches or purchases.

Participants reflected a diverse mix of potential cinch users. The card sort exercise helped prioritise homepage features based on importance:

• Search by budget (e.g., up to £300/month): 40%
• Search by make and model (e.g., BMW 1 Series): 35%
• Search by fuel type: 30%
• Help me choose: 30%
• Search by transmission/gearbox/type: 25%
• Reasons to buy: 25%
• Trustpilot reviews: 20%

Survey insights further reinforced user needs:

• Advanced filters (e.g., car model, year, mileage, location, previous owners): 6 mentions
• Additional needs (e.g., financing options, car history reports, personalised recommendations): 2 mentions

The results underscored the importance of budget-based searches, trust-building elements (e.g., reviews), and additional filters.

Low-Fidelity Wireframing

Using these insights, I designed low-fidelity wireframes to address user and business needs.

Fig 2.1 — Proposed app homepage wireframes in Figma.

Key Design Considerations:

• Budget Filters: Integrated into the hero search component to mirror the web experience and usability findings.
• Trustpilot Score: Added “Reasons to Buy” to reinforce confidence and trust.
• Car Images Animation: For a more native, engaging feel.
• Merged “Recently Viewed” & “You Might Like”: Reduced vertical scrolling by consolidating returning customer sections.

Usability Testing Round 2

A remote unmoderated study (prototypes and survey) with 11 participants aimed to validate the following:

• Preference between design variations for the new user journey.
• Comprehension of new homepage content/features.
• Confidence in purchasing through cinch.
• Areas for improvement.

Figure 2.2 — Design iterations (A-left, B-right) for new users in Figma.

Results:

73% (8/11) of participants preferred design B, citing:

• Advanced filtering for more personalised searches.
• Trustpilot rating increasing confidence in cinch.
• More concise and digestible layout, avoiding cluttered search sections and scattered reviews.

Additional User Needs:

• More Information: 90-day warranty and 14-day money-back guarantee.
• Step-by-Step Visuals: Clearer guidance on how cinch works.

PO & Technical Review

Following a review with my product owner and technical lead, we agreed first to implement a streamlined homepage redesign, focusing on:

• Hero search component (primary search entry point).
• “Reasons to Buy” (trust-building element).
• “Shop by Type” (simplified browsing options).

Given the project scope, I will revisit additional features like advanced filtering in future iterations.

Hi-Fidelity Designs

I created hi-fidelity designs covering all user scenarios, including:

• New and returning customer experiences.
• Mobile and tablet interfaces.
• Development handover documentation (touch targets, logic, accessibility, etc.).

Fig 2.3 — Hi-fidelity homepage designs in Figma.

Fig 2.4 — Hi-fidelity designs for hero search component interactions.

Key Design Enhancements:

• Native Dropdowns: Leveraged for selecting make/model to reduce build time.
• Enhanced Accessibility: Added a hidden label prompting users to choose “Make” first.
• Trustpilot Score Removal: Based on updated business reputation metrics.
• Prominent “Reasons to Buy” Card: Clearer signposting for benefits.
• Skeleton States: For “Recently Viewed” and “You Might Like” to handle slow network conditions.
• Popup Banner Sheets: Used for in-progress orders and part-exchange quotes. The hypothesis is that subtle nudges improve Engagement.

Next Steps

• Collaborate with developers and product owners to refine requirements.
• Support the build phase by addressing design queries.
• Explore advanced filtering MVP+ and conduct A/B testing.
• Monitor performance metrics, such as Engagement with the hero search component, average time spent on the homepage, and returning user behaviour.

Validating these aspects will determine the redesign’s effectiveness and inform future iterations, such as implementing advanced filtering MVP+ for A/B testing.