Eco-friendly Stainless Steel Jewelry Design

Market: United States Platform: Shopify Role: Full-cycle (Design & Development) Website: https://joanandjoy.com/

The client wanted to use Photoshop. Here is a link to the PSD files: https://disk.yandex.by/d/WLE_6t3brpAvVA

Joan and Joy is a US-based e-commerce brand that underwent a full redesign and technical rebuild. I had previously designed the original version of the store, which allowed this project to be approached as a data-informed evolution, not a blind redesign.

The focus was on improving usability, modernizing the visual language, accelerating performance, and preparing the store for scaling.

Refresh and modernize the visual design

Improve the purchase flow and checkout experience

Build a clear, scalable product structure

Optimize performance and loading speed

Integrate modern payment solutions (Stripe and similar providers)

Evolving an existing design without breaking brand recognition

Rebuilding the theme while preserving content and SEO value

Creating clarity across products and variants

Implementing advanced functionality without performance loss

Ensuring fast load times despite rich visual content

Instead of layering fixes on top of the old theme, the store was rebuilt as a fully custom Shopify theme.

Design, visuals, and development were handled as a single system — from UI and design tokens to Liquid architecture and performance optimization. AI-generated visuals and video were used strategically to enhance storytelling while maintaining speed and consistency.

What I Did

Designed the full UI in Figma

Built a scalable design system

Created product visuals using Midjourney

Produced lifestyle images with Nano Banana

Created AI-generated video content using Kling AI

Improved visual hierarchy, product clarity, and brand presence

Built a custom Shopify theme from scratch

HTML / CSS implementation from Figma designs

Advanced Liquid development (templates, sections, theme settings)

JavaScript interactions (sliders, filters, dynamic cart)

Advanced product filtering and structured collections

Custom modules and flexible content sections

Architecture ready for subscriptions and future expansion

Integration of Stripe and alternative payment providers

Shopify API usage for custom logic

External API integrations (ERP / CRM / shipping services)

Core Web Vitals optimization

Image and asset optimization

Clean, lightweight codebase

Technical SEO: meta tags, structured data, sitemap

Cross-browser and multi-device testing

Test orders and checkout validation

Production deployment and final configuration

Strong PageSpeed Insights performance scores

Faster page loads and smoother interactions

Improved product structure and navigation

Cleaner, more confident brand presentation

A scalable Shopify foundation built for growth

👉 Performance report: https://pagespeed.web.dev/analysis/https-joanandjoy-com/yfvjyj83e1?hl=en&form_factor=desktop

Shopify

Liquid

HTML / CSS

JavaScript

Shopify API

Figma

AI tools (Midjourney, Nano Banana, Kling AI)