Back to All Work

Solutions by It Works!

USA10+ landing pages from Figma, custom slider, account dropdown by login state, checkout field split.
Solutions by It Works! project preview — Shopify, Liquid, Figma-to-Code, Google Analytics, Omnisend development by Deepak Jangra

The problem

Solutions by It Works! needed a dedicated landing page for each of its product systems, and had none. The homepage slider was hard-coded and couldn't be touched by the marketing team without a developer. The account dropdown was a popup that confused users rather than helping them. Checkout combined phone number and email into a single field, which was causing friction at the exact moment customers were trying to pay. Search only appeared at the top of the page, easy to miss on a scroll.

What I built

Ten-plus product landing pages from Figma

Working from Figma designs and image assets delivered through Hightail, I built out landing pages for Keto Coffee, SuperGreens, ThermoFight XX, Slimming Gummies, HSN, ProPerformance, HealthyGut, 14 Easy Bye Bye, 14 Easy Hello, and Slimming System, plus the homepage and three category pages for Nutrition, Weight Loss/Weight Management, and Active.

A homepage slider the marketing team can actually edit

I rebuilt the slider from scratch and wired it into Liquid so it's editable through the theme customizer, meaning the marketing team can swap content without filing a developer ticket every time.

Redesigning the account experience

The old account dropdown was a confusing popup regardless of whether someone was logged in. I replaced it with a dropdown that changes based on login state, Profile, Orders, and Logout for logged-in users; Login and Create Account for everyone else. Search moved from a small top-of-page field into a full-screen overlay.

Fixing checkout friction

I split the combined phone and email field into two separate required fields, each with its own helper text, removing a point of confusion right at the moment customers were trying to convert.

A consistent design system

I set 60px section padding as a site-wide standard and ran multiple QA passes on padding, alignment, and image sizing across desktop and mobile to keep the new pages visually consistent with each other, alongside setting up Google Analytics and Omnisend integration.

What actually changed

What changedBeforeAfter
Product pagesNo dedicated pages10+ custom landing pages
Homepage sliderHard-codedTheme-customizer editable
Account UXConfusing popupContextual dropdown by login state
SearchTop-onlyFull-screen overlay
CheckoutCombined phone/email fieldSeparate, labeled fields

Selling supplements on Shopify?

I build high-converting Shopify product pages from Figma designs, with custom account flows and checkout optimizations that your marketing team can manage without developers.