Design preview by LockNCode
What changed and why
This preview shows the JB Skincare store with every change from our website experience review built in, on the real catalog and prices. Tap any link to see the change in place.
| Code | Finding | Where to see it | Status |
|---|---|---|---|
| GL-010 | Replace the moving ticker with one still line Medium |
Top bar: one still line, free shipping; the importer fact is said once, in the first screen | Shown in the preview |
| GL-020 | Slim the phone header from 173 px to about 60 px Medium |
Phone header: one 60 px row with menu, logo, search and bag | Shown in the preview |
| GL-030 | Use deep teal for small text Medium |
Small text and links in deep teal; JB teal for buttons and large headings | Shown in the preview |
| GL-040 | Move the trust facts up from the footer High |
Homepage: proof strip right under the first screen; the same facts beside every Add to Cart | Shown in the preview |
| GL-050 | Measure before changing anything High |
Microsoft Clarity is live on jbskincare.in since 19 October; Google Analytics 4 still to install in JB's account | Partly done on the live site |
| GL-060 | Give every icon and image a name Low |
Every icon has a text label and every image an alt text | Shown in the preview |
| GL-070 | Make small controls easier to tap Low |
Buttons 48 px tall, chips and links at least 24 px, with space between | Shown in the preview |
| GL-080 | Give the error page a way back High |
Page not found with search, concerns and bestsellers | Shown in the preview |
| GL-090 | Take the draft note off the FAQ and say the shipping promise once Medium |
Shipping, returns and FAQs: one support route and one shipping promise everywhere | Shown in the preview (wording to confirm) |
| NAV-010 | Lead the menu with Shop by concern Medium |
Menu leads with Shop by concern, then Repêchage, VOESH, Starter kits, Professionals, Learn | Shown in the preview |
| NAV-020 | Move Stock Clearance out of the main menu Low |
Stock clearance moves to the footer and the phone menu | Shown in the preview |
| NAV-030 | Use arrows to open submenus on phones Low |
Phone menu: ranges open with a chevron that turns | Shown in the preview |
| HP-010 | Fix the Shop by Concern links that open a "page not found" Critical |
Shop by concern: every tile opens a working page | Shown in the preview |
| HP-020 | Replace the rotating banner with one steady message High |
Homepage: one steady message and two doors, one photo per brand (answers the 8 October comment on the mixed top section) | Shown in the preview |
| HP-030 | Bring Shop by Concern into the first two screens Medium |
Concern tiles in the second screen | Shown in the preview |
| HP-040 | Left-align the body text Low |
Body text left-aligned in short paragraphs | Shown in the preview |
| HP-050 | Fix the grammar on the VOESH slide Low |
VOESH copy rewritten in sentence case with correct grammar | Shown in the preview |
| HP-060 | Move the salon pitch off the shopper homepage Low |
For professionals page; a slim link at the end of the homepage | Shown in the preview |
| HP-070 | Show the treatment on video Medium |
Homepage: the Four Layer Facial video, silent and looping, with a still frame first | Shown in the preview (footage rights to confirm) |
| CAT-010 | Restore the missing product photo High |
Vita Cura Triple Firming Cream: still has no photo on the live store; the preview shows where it goes | Photo needed from JB |
| CAT-020 | Open the Repêchage page with a headline Medium |
Repêchage page: a real headline, the story, ranges and bestsellers | Shown in the preview |
| CAT-030 | Make the Skin Consultation section bookable High |
Free skin consultation: what it is, Book on WhatsApp and a short form; linked from the menu, homepage and products | Shown in the preview |
| CAT-040 | Show products two per row on phones Medium |
Shop: two products per row on phones, four on laptops | Shown in the preview |
| CAT-050 | Add a rating and a "best for" label to product cards Medium |
Shop: a Best for label on every card; ratings appear once reviews exist | Shown in the preview |
| PDP-010 | Bring the price and Add to Cart into the first phone screen High |
Product pages: name, price and Add to Cart near the top; the Add to Cart bar shows from the first phone screen | Shown in the preview |
| PDP-020 | Make Add to Cart a solid button High |
Add to Cart: solid JB teal, white bold text, 48 px | Shown in the preview |
| PDP-030 | Hide the empty ratings until there are reviews High |
No empty ratings anywhere until reviews arrive | Shown in the preview |
| PDP-040 | Make the product name the headline Medium |
Product name as the headline, in deep teal | Shown in the preview |
| PDP-050 | Move the share buttons below the description Medium |
Share buttons below the description; Ask an expert on WhatsApp under Add to Cart | Shown in the preview |
| PDP-060 | Put delivery, returns and genuine-product facts beside the button High |
Genuine, imported directly by JB · Ships within 3 days, free · Pay by UPI or card, beside every button | Shown in the preview |
| PDP-070 | Link the products the description recommends Medium |
C-Serum: Pairs well with Hydro-Complex PFS Cream, one tap to add | Shown in the preview |
| PDP-080 | Close the blank gap under Add to Cart Low |
No blank gap under Add to Cart | Shown in the preview |
| PDP-090 | Show prices in whole rupees Low |
Whole rupees everywhere: ₹7,640, inclusive of all taxes | Shown in the preview |
| CART-010 | Say "Free shipping" in the cart High |
Cart and drawer: Shipping Free | Shown in the preview |
| CART-020 | Show each price once Low |
Cart: each price once, one summary | Shown in the preview |
| CART-030 | Turn "Added to cart" into a cart summary Medium |
Added to cart opens a drawer with the item, the total, free shipping, Checkout and one Pairs well with | Shown in the preview |
| CK-010 | Make guest checkout the default High |
Checkout: straight to contact and address as a guest; Sign in is a small link | Shown in the preview (needs Zoho's checkout setting) |
| CK-020 | Show the order through every checkout step High |
Checkout: order summary, free shipping and total on screen throughout | Shown in the preview (to confirm with Zoho) |
| CK-030 | Test cash on delivery for first orders Medium |
Checkout: cash on delivery as a test option | Shown in the preview (decision needed) |
Still to confirm before this goes live
- VOESH: 36 Pedi and Mani in a Box scents are separate products on the live store; the preview groups them into 7 kit pages with a scent picker (needs Zoho variants, to confirm).
- The Four Layer Facial clip is cut from the reel JB shared on 3 October; confirm web rights with Repêchage before it goes live.
- "Cosmopolitan UK called it the facial of the century": confirm the exact wording and source with Repêchage.
- Official home and exclusive importer wording for VOESH: confirm with JB (Repêchage's is on record since 2012).
- Photos still missing on the live store: Vita Cura Triple Firming Cream and Pedi in a Box Tangerine Twist.
- Shipping, returns and consultation wording are proposals for JB to confirm; the WhatsApp number for the chat and consultation buttons is still to choose.
- Product copy on the product pages is JB's current copy; claims review with Harshika as usual.
Product photos are the brand's own; scene images were made by placing the real product photos into new backgrounds, so every label is exactly as printed. Prices, ratings and reviews come from the live store on 22 October 2026. Nothing in this preview takes orders or payments.
