BIBLE ART FOR YOU
Buying one print took seven steps. I cut it to four.
A scripture-art storefront was getting three-quarters of its traffic on mobile and converting at half the desktop rate. Rather than redesign the store, I fixed one thing: the distance between seeing a product and putting it in the cart.
ROLE:
Product Designer
SCOPE:
Research, UX/UI Design
Build, Analytics, Optimization
STATUS:
Shipped and
continuously optimized
BIBLE ART FOR YOU
Buying one print took seven steps. I cut it to four.
A scripture-art storefront was getting three-quarters of its traffic on mobile and converting at half the desktop rate. Rather than redesign the store, I fixed one thing: the distance between seeing a product and putting it in the cart.
ROLE:
Product Designer
SCOPE:
Research, UX/UI Design
Build, Analytics, Optimization
STATUS:
Shipped and
continuously optimized
BIBLE ART FOR YOU
Buying one print took seven steps. I cut it to four.
A scripture-art storefront was getting three-quarters of its traffic on mobile and converting at half the desktop rate. Rather than redesign the store, I fixed one thing: the distance between seeing a product and putting it in the cart.
ROLE:
Product Designer
SCOPE:
Research, UX/UI Design
Build, Analytics, Optimization
STATUS:
Shipped and
continuously optimized
+0%
+0%
1.5% → 2.2% Mobile conversion rate
+0%
+0%
1.5% → 2.2% Mobile conversion rate
+0%
+0%
1.5% → 2.2% Mobile conversion rate
-0pp
-0pp
12% → 5% Cart abandonment, mobile sessions
-0pp
-0pp
12% → 5% Cart abandonment, mobile sessions
-0pp
-0pp
12% → 5% Cart abandonment, mobile sessions
-0%
-0%
Median time from landing to purchase, Mobile only
-0%
-0%
Median time from landing to purchase, Mobile only
-0%
-0%
Median time from landing to purchase, Mobile only
01. Where the money was leaking
Mobile carried the traffic. Desktop carried the sales.
Mobile carried the traffic. Desktop carried the sales.
Mobile carried the traffic. Desktop carried the sales.
76% of sessions came from phones — mostly women aged 25–44 shopping in short bursts between other things. Yet mobile converted at roughly half the desktop rate.
76% of sessions came from phones — mostly women aged 25–44 shopping in short bursts between other things. Yet mobile converted at roughly half the desktop rate.
76% of sessions came from phones — mostly women aged 25–44 shopping in short bursts between other things. Yet mobile converted at roughly half the desktop rate.
The store wasn't broken. Products were good, traffic was healthy, and checkout worked. Something in the middle was costing sales, and the analytics pointed to one place: people were browsing collections and leaving without ever reaching a cart.
The store wasn't broken. Products were good, traffic was healthy, and checkout worked. Something in the middle was costing sales, and the analytics pointed to one place: people were browsing collections and leaving without ever reaching a cart.
The store wasn't broken. Products were good, traffic was healthy, and checkout worked. Something in the middle was costing sales, and the analytics pointed to one place: people were browsing collections and leaving without ever reaching a cart.
0%
0%
of sessions on mobile
0%
0%
of sessions on mobile
0%
0%
of sessions on mobile
0X
0X
desktop converted at roughly twice the mobile rate
0X
0X
desktop converted at roughly twice the mobile rate
0X
0X
desktop converted at roughly twice the mobile rate
0%
0%
of mobile sessions ended on a collection page — no product view, no cart
0%
0%
of mobile sessions ended on a collection page — no product view, no cart
0%
0%
of mobile sessions ended on a collection page — no product view, no cart
02. The problem I chose to solve
There was no way to buy anything from the page where people were actually shopping.
There was no way to buy anything from the page where people were actually shopping.
There was no way to buy anything from the page where people were actually shopping.
Every purchase had to route through the product page. A shopper scanning the Best Seller grid — the page where 63% of mobile sessions ended — could not act on a decision they had already made. To buy one $3.99 print, they had to leave the grid, scroll a gallery, find the price, add, open the cart, and go back for the next one.
Every purchase had to route through the product page. A shopper scanning the Best Seller grid — the page where 63% of mobile sessions ended — could not act on a decision they had already made. To buy one $3.99 print, they had to leave the grid, scroll a gallery, find the price, add, open the cart, and go back for the next one.
Every purchase had to route through the product page. A shopper scanning the Best Seller grid — the page where 63% of mobile sessions ended — could not act on a decision they had already made. To buy one $3.99 print, they had to leave the grid, scroll a gallery, find the price, add, open the cart, and go back for the next one.
And the one moment that mattered most was physically covered: a floating gift-promo widget sat over the lower-left corner of every page, obscuring product titles on the grid and the title and price on the product page.
And the one moment that mattered most was physically covered: a floating gift-promo widget sat over the lower-left corner of every page, obscuring product titles on the grid and the title and price on the product page.
And the one moment that mattered most was physically covered: a floating gift-promo widget sat over the lower-left corner of every page, obscuring product titles on the grid and the title and price on the product page.
Land
Land
Open collection
Open collection
Tap card — leave the grid
Tap card — leave the grid
Scroll past gallery
Scroll past gallery
Find price under the widget
Find price under the widget
Add to cart
Add to cart
Open cart → checkout
Open cart → checkout
03. What the old screens made people do
Before
Best Seller grid
Collection
• Cards were purely navigational — no way to add, no way to compare
• Price sat below the fold of each card; savings weren't visible while scanning
• The floating promo widget covered the third product's title
Before
Where every purchase was forced
Product
• Title and price appeared below a full-height gallery plus a thumbnail rail
• The promo widget sat directly on top of the product name
• Add to cart required a second scroll after the details accordions
Design principle
Let people act where they decide — not one screen later.
Let people act where they decide — not one screen later.
Every change below was tested against a single question: does this shorten the distance between wanting a print and owning one? Anything that didn't, I left alone.
Every change below was tested against a single question: does this shorten the distance between wanting a print and owning one? Anything that didn't, I left alone.
04. The change
Before
Browse only
After
Browse and buy
Quick-add on every card
Quick-add on every card
Quick-add on every card
A persistent add-to-cart button sits on each product image. Returning customers — who already know the print they want — never have to open a product page.
A persistent add-to-cart button sits on each product image. Returning customers — who already know the print they want — never have to open a product page.
Why this first: It removes three of the seven steps in a single change.
Why this first: It removes three of the seven steps in a single change.
Removed the floating promo widget
Removed the floating promo widget
Removed the floating promo widget
The gift widget generated almost no engagement and covered titles, prices, and the add-to-cart zone. I cut it and moved the offer into the announcement bar and cart drawer, where it's read at a decision point.
The gift widget generated almost no engagement and covered titles, prices, and the add-to-cart zone. I cut it and moved the offer into the announcement bar and cart drawer, where it's read at a decision point.
Why this matters: The highest-value pixels on a phone were being rented out for free.
Why this matters: The highest-value pixels on a phone were being rented out for free.
Moved price and savings into the card
Moved price and savings into the card
Moved price and savings into the card
Sale price, original price, filter and sort now live in the grid. The comparison happens while scanning, so the tap that follows is a purchase intent — not a research trip.
Sale price, original price, filter and sort now live in the grid. The comparison happens while scanning, so the tap that follows is a purchase intent — not a research trip.
Why this matters: fewer product-page visits, but more of them convert.
Why this matters: fewer product-page visits, but more of them convert.
05. The path now
Seven steps became four.
Seven steps became four.
Seven steps became four.
The product page still exists for shoppers who want detail — it just stopped being a toll booth. Express checkout closes the loop for one-item orders, which is most of them.
The product page still exists for shoppers who want detail — it just stopped being a toll booth. Express checkout closes the loop for one-item orders, which is most of them.
Step 01
Land
Hero reads clearly on a phone; collections start immediately below.
Step 02
Browse and add
Price, savings and add-to-cart all live in the card. No page change required.
Step 03
Review
Cart opens in place with a pinned checkout button showing the total.
Step 04
Pay
Express wallets sit above the form so returning buyers skip typing entirely.
06. Results
Seven steps became four.
Seven steps became four.
Seven steps became four.
The product page still exists for shoppers who want detail — it just stopped being a toll booth. Express checkout closes the loop for one-item orders, which is most of them.
The product page still exists for shoppers who want detail — it just stopped being a toll booth. Express checkout closes the loop for one-item orders, which is most of them.
Metric
Metric
Before
Before
After
After
Change
Change
Mobile conversion rate
Mobile conversion rate
1.5%
1.5%
2.2%
2.2%
+0.7pp
+0.7pp
Cart abandonment (mobile)
Cart abandonment (mobile)
12%
12%
5%
5%
−7pp
−7pp
Median time to purchase
Median time to purchase
100%
100%
74%
74%
−26%
−26%
Mobile sessions
Mobile sessions
Baseline
Baseline
+14%
+14%
+14%
+14%
07.What I took from it
Find the one step, then defend it
Find the one step, then defend it
The first audit produced eleven issues. Shipping all eleven would have made the result unreadable. Picking one — distance to cart — meant I could tie every decision and every metric back to the same line.
The first audit produced eleven issues. Shipping all eleven would have made the result unreadable. Picking one — distance to cart — meant I could tie every decision and every metric back to the same line.
Small changes, measured, beat redesigns
Small changes, measured, beat redesigns
No rebuild, no new theme, no new photography. A button on a card and one deleted widget moved conversion 47%, relative. The constraint was the point.
No rebuild, no new theme, no new photography. A button on a card and one deleted widget moved conversion 47%, relative. The constraint was the point.
Honest numbers are more persuasive
Honest numbers are more persuasive
This wasn't a controlled test, and saying so up front makes the rest credible. I'd rather show a directional result I can defend than a clean number I can't.
This wasn't a controlled test, and saying so up front makes the rest credible. I'd rather show a directional result I can defend than a clean number I can't.
08.Where I'd take it next
Three AI additions — and the guardrail each one needs
Three AI additions — and the guardrail each one needs
Concepts, not shipped work. Framed using the design patterns from UI/UX Design for AI Products (Stanford Online, certificate). Each is deliberately scoped to the same problem: shortening the path to cart without taking control away from the shopper.
Concepts, not shipped work. Framed using the design patterns from UI/UX Design for AI Products (Stanford Online, certificate). Each is deliberately scoped to the same problem: shortening the path to cart without taking control away from the shopper.
Cart-level "completes the set"
Recommend the second print at the cart drawer, where the shopper has already committed and a second item is a small decision. Ranked on co-purchase, not on browse history.
Guardrail
State the reason inline ("often bought with this nursery set") so the suggestion is auditable, and cap it at two so the cart doesn't become a feed.
Semantic search for how people actually ask
Shoppers search for "verse for a scared kid," not "Psalm 56:3." Embedding-based search would match intent rather than keywords, turning a zero-result page into a collection grid where quick-add already works.
Guardrail
Always show the interpreted query ("showing prints about fear and comfort") with a one-tap way to fall back to literal search.
Assisted gift finder
Three questions — age, occasion, room — returning a small curated grid. A conversational entry point for the 40% of orders that are gifts and start with no product in mind.
Guardrail
Design the empty and wrong states first. Every result set needs a visible "none of these" path back to normal browsing.
Three AI additions — and the guardrail each one needs
Concepts, not shipped work. Framed using the design patterns from UI/UX Design for AI Products (Stanford Online, certificate). Each is deliberately scoped to the same problem: shortening the path to cart without taking control away from the shopper.
Semantic search for how people actually ask
Shoppers search for "verse for a scared kid," not "Psalm 56:3." Embedding-based search would match intent rather than keywords, turning a zero-result page into a collection grid where quick-add already works.
Guardrail
Always show the interpreted query ("showing prints about fear and comfort") with a one-tap way to fall back to literal search.
Cart-level "completes the set"
Recommend the second print at the cart drawer, where the shopper has already committed and a second item is a small decision. Ranked on co-purchase, not on browse history.
Guardrail
State the reason inline ("often bought with this nursery set") so the suggestion is auditable, and cap it at two so the cart doesn't become a feed.
Assisted gift finder
Three questions — age, occasion, room — returning a small curated grid. A conversational entry point for the 40% of orders that are gifts and start with no product in mind.
Guardrail
Design the empty and wrong states first. Every result set needs a visible "none of these" path back to normal browsing.
Next case study