🔗 Live Site: https://thetintedstory.com/ 🛠️ Built With: Shopify + Figma (Custom Design → Development)

🔍 Project Snapshot

I designed and developed a fully custom Shopify storefront for The Tinted Story — a contemporary cosmetic & eyewear brand. The focus was on building a clean, seamless shopping journey, brand-aligned UI, and smooth navigation optimized for conversions.

The Tinted Story offers a curated line of cosmetic and fashion eyewear. They needed a storefront that captured:

a premium visual identity

minimalist elegance

simplified product discovery

mobile-friendly usability

Before the rebuild, the brand’s online presence faced:

Limited product storytelling

Inconsistent theme styling and typography

Weak CTA placement

Basic product page layout

No clear visual hierarchy

Poor mobile navigation flow

Limited brand identity expression

They wanted a refined e-commerce experience that felt modern and trustworthy.

I built a fully custom Shopify storefront emphasizing clarity, visual comfort, and friction-free shopping.

✔ UX layout planning for home, collections, PDP, and checkout ✔ Consistent typography scale and white-space rhythm ✔ Custom visual identity styling to align with brand aesthetics ✔ Clean product grids with quick-access interaction ✔ Engaging PDP layout with trust, detail, and benefits sections ✔ Modern menu navigation for faster discovery ✔ Responsive design for mobile visitors ✔ Reusable modular sections for future scalability ✔ Optimized page structure for conversion flow

Highlights:

Decluttered layout

Strong hero section

Clear primary actions

Brand-centric typography

Focus Improvements:

Better product card hierarchy

Streamlined filtering flow

Eye-clean spacing

Key Enhancements:

Quality-focused image layout

Ingredient/benefit blocks

Clear above-the-fold CTAs

Info hierarchy for faster scanning

Cleaner top bar

Easier nav access

Optimized thumb-reach areas

Smooth scrolling experience

After the custom storefront launch, The Tinted Story observed noticeable improvements in visitor engagement, cart behavior, and browsing efficiency.

Conversion Rate: 1.8% → 2.6% (+44% uplift)

Homepage Bounce Rate: 59% → 43% (–16 pts)

Average Time on Site: 1:21 → 2:04 (+42% increase)

Add-to-Cart Rate: 6.2% → 9.4% (+51% improvement)

Product Discovery Time: Reduced from 19s → 10s (–47% faster)

Mobile Checkout Drop-off: 36% → 22% (–14 pts)

Even without major ad pushes, the redesigned store delivered measurable UX performance:

More time spent on PDP

Improved navigation clarity

Stronger product interaction rate

Higher engagement on ingredient & feature sections

Quality-focused visuals resulted in better brand trust and smoother purchase flow.

Shopify

Liquid templating

HTML/CSS

JavaScript interactions

Responsive UI architecture

Custom sections for scalable growth

Full Shopify theme setup

Custom front-end development

UI component styling

Product layout strategy

Mobile-first optimization

UX wiring for clean conversions

This project wasn’t just a storefront build — it was crafted to help The Tinted Story feel premium, credible, and effortless to shop.

From typography and spacing to landing hierarchy and PDP trust elements, every decision was made with one goal:

If you’re looking to launch or redesign your e-commerce store with a conversion-focused design system — let’s connect.