Back

Back

Scroll depth increased 4x

Inno Supps

Standardized Product Page Templates for Faster Launches & Deeper Engagement

Designing scalable, subscription-forward templates that blend credibility with speed and usability

Project Overview

To improve both the internal workflow and user shopping experience, I designed a system of reusable Figma templates for product launches. These templates emphasize real photography, clean designs, and subscription-first layouts. The goal was to make the pages faster to build, easier for users to scan, and more visually credible.

Problem Statement

Last-minute launch timelines created internal stress and inconsistent pages. Without a standardized system, outdated visuals and weak content led to low engagement and shallow scroll depth.

Company

Inno Supps

My Role

Lead Designer

Platforms

Shopify eCommerce Site

Timeline

December 2024 - May 2025

Persona
Daniel Reyes

Sales Rep

I want to stay in shape, but I’m busy. If a product looks credible, I’m more likely to buy.

Age: 29

Location: Tampa, FL

Tech Proficiency: Moderate

Gender: Male

Goals

Quickly understand what the product does.

Trust that it’s high-quality and effective.

Easily subscribe so he doesn’t run out.

Pain Points

Turned off by flashy or overhyped visuals.

Doesn’t want to dig through long pages for info.

Wary of products with little detail.

User Research

Audited performance of older product pages (scroll depth, bounce rates, user flow drop-offs).

Gathered input from marketing and design teams about workflow bottlenecks.

Reviewed competitive health & wellness pages with strong visual credibility.

User Research

Audited performance of older product pages (scroll depth, bounce rates, user flow drop-offs).

Gathered input from marketing and design teams about workflow bottlenecks.

Reviewed competitive health & wellness pages with strong visual credibility.

User Research

Audited performance of older product pages (scroll depth, bounce rates, user flow drop-offs).

Gathered input from marketing and design teams about workflow bottlenecks.

Reviewed competitive health & wellness pages with strong visual credibility.

Insights

Users make snap judgments based on layout, photography, and visual trust signals.

More content upfront (like carousel details) improves product understanding and retention.

Real images and subscription emphasis drive more qualified interest from ad traffic.

Insights

Users make snap judgments based on layout, photography, and visual trust signals.

More content upfront (like carousel details) improves product understanding and retention.

Real images and subscription emphasis drive more qualified interest from ad traffic.

Insights

Users make snap judgments based on layout, photography, and visual trust signals.

More content upfront (like carousel details) improves product understanding and retention.

Real images and subscription emphasis drive more qualified interest from ad traffic.

Design Solution

Created modular Figma templates to standardize and speed up product launch pages.

Replaced glossy renderings with real lifestyle photography and a clean, clinical aesthetic to build trust.

Designed carousels with more upfront info and emphasized subscription CTAs to support quicker decisions.

Design Solution

Created modular Figma templates to standardize and speed up product launch pages.

Replaced glossy renderings with real lifestyle photography and a clean, clinical aesthetic to build trust.

Designed carousels with more upfront info and emphasized subscription CTAs to support quicker decisions.

Design Solution

Created modular Figma templates to standardize and speed up product launch pages.

Replaced glossy renderings with real lifestyle photography and a clean, clinical aesthetic to build trust.

Designed carousels with more upfront info and emphasized subscription CTAs to support quicker decisions.

Testing & Iteration

Adjusted content density to better serve mobile-first browsing patterns.

Optimized visual hierarchy and image sizing after monitoring initial user behavior.

Refined templates based on team feedback to ensure adaptability across different product needs.

Testing & Iteration

Adjusted content density to better serve mobile-first browsing patterns.

Optimized visual hierarchy and image sizing after monitoring initial user behavior.

Refined templates based on team feedback to ensure adaptability across different product needs.

Testing & Iteration

Adjusted content density to better serve mobile-first browsing patterns.

Optimized visual hierarchy and image sizing after monitoring initial user behavior.

Refined templates based on team feedback to ensure adaptability across different product needs.

Outcome
Scroll depth increase 16%, reflecting higher engagement.
New templated pages reduced production time to 5 days, streamlining internal workflows.
Subscription rates increased by an average of 11.15% across product pages, rising from 38.65% to 49.8% after the redesign.
Growth Points
Leading with Subscriptions Drives Action

Designing with subscriptions in mind from the start, led to clearer user flows and stronger conversion opportunities.

Leading with Subscriptions Drives Action

Designing with subscriptions in mind from the start, led to clearer user flows and stronger conversion opportunities.

Leading with Subscriptions Drives Action

Designing with subscriptions in mind from the start, led to clearer user flows and stronger conversion opportunities.

Real Images Build Real Trust

Lifestyle photography performs better than static renders when your audience is shopping from mobile or social referrals.

Real Images Build Real Trust

Lifestyle photography performs better than static renders when your audience is shopping from mobile or social referrals.

Real Images Build Real Trust

Lifestyle photography performs better than static renders when your audience is shopping from mobile or social referrals.

Scalable Systems Save Time

Templated design systems free up time for creativity and iteration, without sacrificing visual impact.

Scalable Systems Save Time

Templated design systems free up time for creativity and iteration, without sacrificing visual impact.

Scalable Systems Save Time

Templated design systems free up time for creativity and iteration, without sacrificing visual impact.

Select this text to see the highlight effect