Product-First Model ML redesign driving Clearer Value
Revamped from testimonial-heavy to product-first, boosting perceived value and higher engagement
CHALLENGE
The original website prioritized testimonials over content, leaving the product’s value and story unclear at first impression.
DESIGN IMPACT
Faster Understanding
Clear Product Story
Better Decision-Making
Structured Hierarchy
Higher Engagement
Stronger Perceived Value
Model ML is an AI-powered platform that connects all data sources and applications, enabling seamless analysis, automated workflows, and efficient insights across multiple sources at once.
The website scattered features and overemphasized social proof, so I redesigned the homepage to clearly present core features and product value first, while keeping social proof secondary.
I started by understanding the product and its scattered features, grouped them into core vs. secondary, and mapped how users might explore them. Then I wireframed and iterated in Figma, focusing on clarity, hierarchy, and guiding users through a story.
I designed a clear user journey that tells the product story first, highlights key AI features, and guides users from value to exploration to proof.
Hero Section
Value in first 5 sec
Features Section
Show problem + solution
Highlights
AI Power + Uniqueness
Social Proof
Testomonials after clarity
Compliance
Signal trust for enterprise
Case Study/Blogs
Proof + SEO growth
THE REFORM JOURNEY
Hero Section
What wasn’t working?
The headline and subheadline failed to communicate the product’s value.
The subheadline focused on users rather than the product itself.
Visuals emphasized testimonials instead of showcasing the product.
The navigation bar lacked menus relevant to the product’s features and functionality.
How it was reshaped
Introduced clear product statement supported by concise microcopy.
Added product visual for instant comprehension.
Refined CTA and navigation for smoother user flow.
Introduced intentional and clear call-to-actiona to guide users.
Refined navigation menus for easier access and relevant product exploration.
Features section
What wasn’t working?
Upon reviewing the features section, the features and their benefits appeared mixed and unclear.
Several features of the product were missing and not listed in the section.
The product’s core AI capabilities, the main highlight, were present within the features section rather than showcased separately.
Another section on the website listed all features but lacked descriptions and visuals.
These features were studied, categorized, and integrated with the main features section.
Each feature was presented clearly, giving equal focus to all and ensuring that every feature felt like a core part of the product.
How it was reshaped
Through this categorization and analysis, each feature was paired with relevant visuals, ensuring clarity and comprehension for users.
Tested multiple layouts (center-aligned, side-aligned, bento) to optimize scanning behavior.
Chose side-aligned design to pair visuals with descriptions effectively.
Layout Testing
Explored multiple structural variations to determine best visual hierarchy. Testing revealed that side-aligned layouts offered the most natural flow for this product, enhancing feature comprehension and engagement.
The product has a wide range of features, each valuable to a different user.
Users need to understand both what it does and how it works in seconds.
Visuals and text carry equal weight, neither should overpower the other.
The product has a wide range of features, each valuable to a different user.
Users need to understand both what it does and how it works in seconds.
Visuals and text carry equal weight, neither should overpower the other.
The product has a wide range of features, each valuable to a different user.
Users need to understand both what it does and how it works in seconds.
Visuals and text carry equal weight, neither should overpower the other.
HIghlighting AI - The core strength
The AI capabilities were highlighted in a separate section, emphasizing the benefits of using the product.
Key points showcased included automation through AI and a single hub for multiple functionalities.
An intentional call-to-action was added to guide users toward exploring the product.
Testimonials at the right stage
Testimonials were positioned after the product value was clearly communicated to build trust at the right stage.
PRODUCT STORY THAT BOOSTS RETENTION AND ENGAGEMENT
Before
After
Insights
Clarity Precedes Validation
A homepage must explain what the product does before asking users to believe in it. Proof works best after comprehension.
Microcopy as Conversion Catalyst
Concise, value-driven messaging carries as much weight as visual design in guiding user attention.
To understand how users interact with the product, I would observe their behavior and track key engagement metrics, including:
Average time on site – to see if users are exploring the product.
Click through rate on hero section - to measure if the key value proposition captures attention.
Demo Requests - to track whether clarity and exploration lead to action.
Outcome of the Redesign
Clear Product Story → Faster Understanding
Hero and feature flow guide users to grasp core value within seconds.
Stronger Perceived Value → Higher Engagement
Presenting core features first and highlighting AI capabilities shows users the product’s real benefits.
Structured Hierarchy → Better Decision-Making
The whole structure was planned in advance to highlight priorities and reduce overwhelm.
Social Proof & Compliance → Improved Credibility
Placing testimonials and compliance cues later creates a natural credibility build-up, improving user confidence in decision-making.
Got thoughts on these designs?
Share your take, let’s spark ideas and shape the next version together.