The best Shopify eyewear website design makes two hard tasks easy: finding a frame which fits, and adding the right lenses. I reviewed the UI and UX of five Shopify eyewear stores, BonLook, Visionist, Blenders Eyewear, Etnia Barcelona and Óptica Bassol, screen by screen. Each review covers the homepage, filters, product page, lens flow, cart and mobile, with what works and what to improve.
I’m Arul M Joseph, a WordPress, Shopify and Laravel developer with 14+ years of experience and 500+ websites delivered through arulmjoseph.com. I’m a Shopify Partner, and eyewear stores raise the same questions on almost every build: how to show frame sizes, how to sell lenses, and how to keep the buy button in reach on a phone.
Table of Contents
I reviewed each store on the same six areas: homepage and navigation, collection page and filters, product page, lens selection, cart and mobile. Screenshots were taken in October 2026 on a 1440 x 900 desktop screen and a 390 x 844 phone screen, browsing from India. Each area gets one of three ratings:
Each store runs on Shopify or Shopify Plus, confirmed by a Shopify customer story or the agency behind the build. Some prices in the screenshots show in rupees or mix currencies, because the stores detected an Indian visitor.
BonLook is a Canadian prescription eyewear brand on Shopify Plus, with a clean, editorial store built around one job: getting a shopper from a frame to a lens order in as few clicks as possible. Its lens flow is the best part of the store. Its filters are the weakest.
| UX area | Rating | Why |
|---|---|---|
| Homepage and navigation | Strong | Four menu links, one offer, one button |
| Collection page and filters | Needs work | Only Sort and Sale filters for 158 frames |
| Product page | Strong | Lens step starts from the main button |
| Lens selection flow | Strong | 3 clear steps with the frame always in view |
| Cart | Good | Every lens choice listed, trust lines next to checkout |
| Mobile experience | Good | Tab bar for categories, no sticky buy button |
The BonLook homepage gives you one message and one action. A black bar at the top repeats the offer, “40% off your second pair”, and the hero shows a single lifestyle photo with one “Shop Now” button.
The main menu has four links: Eyeglasses, Sunglasses, Returns & Exchanges and Sale, with Sale in red. Putting Returns & Exchanges in the main menu is a smart choice. Returns are the first worry for anyone buying glasses online, and BonLook answers it before the shopper asks.
What works:
The eyeglasses collection shows 158 frames in a three-column grid. Each product card shows the frame on a two-tone grey and beige background, arrows to flip through photos, colour swatches inside the image, the frame material and shape, and the price.
The Virtual Try On toggle sits next to the Filter button. This lets shoppers limit the grid to frames they try on with their camera, a useful shortcut for a hesitant buyer.
The filter panel is the weak point. It opens from the left and dims the grid, but it holds only two options: Sort and Sale. There is no filter for frame shape, colour, size or material. With 158 frames, a shopper looking for a round frame in size small has to scroll the full grid.
What to improve:
The product page puts the lens step first. The main button reads “Select lens & continue”, not “Add to cart”, so every eyeglasses order starts with lenses.
The buy box sits in a white card on the right. It holds the frame name, a short description (“Metal square eyeglasses”), the starting price with prescription lenses, colour swatches, size buttons and a “Help me choose my size” link above the size buttons. A green Virtual Try On badge sits on the product photo, and an “Also available as sunglasses” link sends shoppers to the same frame as sunglasses.
One issue showed up while browsing from India: the price reads “$15453.18”, a dollar sign in front of a rupee amount. Check currency formatting for every market your store sells to.
Further down, the gallery continues with a side view, a hinge close-up and two model photos, next to a short description in an accordion. The page has no frame measurements table and no customer reviews. Size help is only the “Help me choose my size” link.
What works:
What to improve:
The lens flow opens as a full-screen overlay. The steps sit on the left, and a large photo of the chosen frame stays on the right, so shoppers never lose sight of what they are buying.
A progress bar shows three steps: Vision Type, Choose Lenses and Checkout. Step one offers two options, Single Vision and Without Rx, each with a price. Below them, a “Not sure which to choose? We can help you.” link and a “Contact Customer Support” link catch shoppers who don’t understand the options.
Step two, Choose Lenses, keeps the same layout. For non-prescription lenses it offers “Standard Lenses (Included)” with a “More info” link, and “Add Blue Light Protection” with its extra price shown on the option. The next button stays greyed out until the shopper picks an option, and turns into “Add to cart” once the choice is complete.
This is the pattern to copy for any prescription eyewear store:
The cart lists every part of the order inside one product card: the frame, “Lenses: No Prescription”, the lens type and the included case and microfibre cloth, each with its price. Shoppers see exactly what they configured in the lens flow.
The cart summary on the right has one dark Check Out button with a lock icon and three trust lines under it: free shipping over a set amount, a 30-day return window and the delivery time. There is no discount code field and no cross-sell products, which keeps the path to checkout short.
What works:
On mobile, BonLook keeps the header short: logo, search, bag and menu. Below it, a fixed row of three tabs (Eyeglasses, Sunglasses and Sale) gives one-tap access to the main categories without opening the menu.
The mobile product page stacks the gallery, colour, size help and a full-width “Select lens & continue” button. There is no sticky buy button. Once shoppers scroll down to read the description, they have to scroll back up to start the lens step.
What to improve:
Visionist (hellovisionist.com) is an optical retailer selling designer frames from brands such as Anne et Valentin and Jacques Marie Mage. It runs on Shopify Plus, built by the agency Barrel. Its filters are the best of the five stores. Its lens drawer and cart are the weakest parts.
| UX area | Rating | Why |
|---|---|---|
| Homepage and navigation | Good | Clear menu with Build a Pair and Virtual Try-On, crowded by fixed widgets |
| Collection page and filters | Strong | Eight filter groups plus a style slider and a try-on filter |
| Product page | Good | Strong fit help, incomplete frame measurements |
| Lens selection flow | Good | Lens prices shown up front, no progress steps |
| Cart | Needs work | Plain table, no trust details |
| Mobile experience | Needs work | Offer ribbon and chat bubble cover the buy button |
The Visionist homepage opens with a full-width lifestyle photo, a “Summer Style” heading and one “Shop the Latest Looks” button. A row of frame thumbnails sits along the bottom of the hero, so shoppers see real products before they scroll.
The main menu reads Optical, Sun, Brands, Lenses, Services, Build a Pair, Bundles and Sale, with a black “Virtual Try-On” button at the end. “Build a Pair” and “Lenses” in the main menu tell shoppers on the first screen this store sells complete glasses, not frames alone.
Two fixed elements compete for attention: an “Offer Inside” tab on the right edge and a chat bubble in the bottom corner.
The optical collection lists 597 frames with a left filter sidebar. It starts with a Masculine, Unisex and Feminine slider and a Virtual Try-On checkbox, then accordions for Type, Designers, Shape, Material, Size, Color, Traits and Style.
This is the filter set a large optical catalogue needs. Shoppers narrow 597 frames by shape, size and designer without leaving the page. A “Hide Filters” toggle gives the grid more room once they finish.
Product cards show the frame on white, the brand in bold, the model name, the price and the colour count as text (“3 Colors”). A promotional tile, “Ask us anything optical”, sits inside the grid.
What works:
What to improve:
The product page shows the brand, model and price on the left, colour swatches with the colour name, and a black add-to-cart button. On the in-stock frame the button reads “Add to Cart – Only 1 left!”, a clear and honest stock message.
Below the gallery, three columns cover Product Details, What’s Included and Shipping & Returns. The “Question About Fit?” block is the best fit help in this review: the size code, a “Learn How” link, “Ask a Visionist”, “Take the Quiz”, “Find in Store” and a Frame Finder link.
The size code reads “48-23-” with the temple length missing. Frame measurements are a top reason shoppers buy or skip a frame, so incomplete data hurts here.
What works:
What to improve:
On Visionist, “Add to Cart” opens a lens drawer from the right instead of adding the frame straight away. The drawer, titled “1. Choose Lenses”, lists every lens option in one long list: no prescription, prescription optical lenses, prescription sun lenses and non-prescription lenses.
Each option shows a short description and a starting price, for example Anti-Reflective from $195 and Polarized from $245. Showing prices before the shopper commits is the strongest part of this flow. A sticky footer holds the frame thumbnail, the price and an “Add Frames & Lenses to Cart” button, greyed out until a lens is picked.
Picking a lens expands it in place. Anti-Reflective opens two sub-options, Single Vision (included) and Progressive, with its extra price.
What works:
What to improve:
The Visionist cart is a plain table with Item, Price, Quantity and Total columns, a Remove link, a subtotal and a black Checkout button. The only extra line is “Shipping + taxes calculated at checkout”.
After a strong fit section on the product page, the cart drops every trust signal. There are no returns details, no delivery estimate and no payment logos next to the button.
What to improve:
The mobile header stacks a sale bar, a row with the Virtual Try-On button and “Shop Local”, then the menu, logo and bag. The hero keeps the frame thumbnails from desktop.
On the mobile product page, the “Offer Inside” ribbon and the chat bubble sit over the button row. On a 390-pixel screen, fixed widgets covering the main button cost sales.
The frame shown here is out of stock, and the page swaps the buy button for a full-width “Notify me” button. This keeps the shopper on the page instead of showing a dead end.
What to improve:
Blenders Eyewear sells sunglasses and snow goggles, and has used Shopify since its early days, according to Shopify. The store has no lens flow, because most frames ship with lenses fitted. It wins on product page detail, reviews and the cart.
| UX area | Rating | Why |
|---|---|---|
| Homepage and navigation | Good | Five clear menu links and a campaign hero |
| Collection page and filters | Strong | Six filter groups with frame thumbnails |
| Product page | Strong | Fit guide drawing, face shape and head size |
| Reviews | Strong | Photo reviews, recommend rate and Q&A |
| Cart | Strong | Promo code, express pay and trust icons |
| Mobile experience | Strong | Sticky Add to Cart bar with the price |
The homepage leads with a co-branded campaign, Blenders x Prime, and a “Shop Now” button. The menu has five links: Women, Men, Youth, Snow and Sale. Shoppers pick by who the sunglasses are for, the way most people shop for sunglasses.
The women’s sunglasses page has a Men and Women toggle at the top, a “Filter by” button and a sort menu. The filter opens as a wide panel over the grid, with Collection, Color, Shape, Feature, Lens Type and Size.
The Collection filter shows a small photo of each frame style next to its name. Shoppers recognise a frame shape faster from a photo than from a name like “Apex” or “Canyon”.
Product cards carry a “Polarized” or “New” label, an angled product photo, colour swatches with a “+1” for extra colours, and the price. The first tile in the grid is a lifestyle photo, which breaks up a page of product shots.
What works:
The product page puts the star rating and review count next to the name and price. Colour choices show as swatches. Under the buy button, warranty, 45-day returns and a delivery estimate sit in one row.
The fit guide is the best in this review. It opens with a line drawing of the frame, marked with lens width, bridge, temple length and lens height. A short table below adds the frame measurements, the ideal face shape (round, oval and heart) and the head size (small to medium).
An add-on card for a matching sunglasses sleeve sits above the Add to Cart button. It raises the order value with one tap, but it also pushes the main button lower on the page.
What works:
The reviews section shows a 4.7 average from 12 reviews, a star breakdown, the share of buyers who recommend the product, and customer photos at the top. Tabs split Reviews and Questions.
Each review carries a “Verified Buyer” tick, a customer photo and helpful votes. Photos of real customers wearing the frame answer the question a product photo leaves open: how does it look on a face?
The cart keeps each item to one compact row with a quantity stepper. The summary shows the subtotal, shipping with a delivery window, a “Use Promo Code” link and the total.
Below the Proceed to Checkout button sit Shop Pay and Google Pay, then three trust icons: a 2-year warranty, easy returns and the store’s review count. The promo code sits behind a link, so it doesn’t send shoppers off to search for codes.
What works:
The mobile product page shows the name, price and star rating before the photo. As the shopper scrolls, a black Add to Cart bar with the price stays fixed at the bottom of the screen.
A sticky buy bar is the single most useful mobile pattern in this review. BonLook and Visionist both lack it.
Etnia Barcelona is an independent optical brand from Barcelona, present in more than 50 countries, which moved to Shopify in 2026, according to Shopify. Its store reads like a fashion brand: art campaigns, bold colour and a filter drawer built around shapes and lenses.
| UX area | Rating | Why |
|---|---|---|
| Homepage and navigation | Good | Art-led hero with countdown, clear menu |
| Collection page and filters | Strong | Shape icons, lens filters, live result count |
| Product page | Good | Lens type buttons and try-on, plain-text details |
| Cart | Good | Free shipping, taxes included, four pay options |
| Mobile experience | Good | Sticky Add to cart and Shop Pay bar, floating pills overlap content |
The homepage opens with a limited-edition artist collaboration, a countdown timer and a “Preorder Now” button. The menu reads Sun, Optical, Collections, Stores and Etnia’s DNA. Putting “Stores” in the main menu helps a brand sold through opticians send shoppers to a shop.
The sunglasses page shows 366 products in four columns with tabs for All, Current Collection, Woman, Man and Kids. Every card has a virtual try-on icon, mini frame thumbnails for each colour, the lens type and the price.
The filter drawer opens from the right and blurs the page behind it. It groups filters into Explore, Gender, Shape and Lens. Each of the 11 shape options has a small frame outline icon, and unavailable options are greyed out.
The footer of the drawer holds “Clear all” and “Show 366 items”. The live count tells shoppers how many frames match before they close the drawer, so they never land on an empty page.
What works:
The product page lets shoppers pick a lens type, Photochromic, Polarized HD or HD, as buttons next to the colour options. A Virtual Try-On link sits on the product photo, with a size guide next to the size.
Further down, the product details are one long plain-text list covering the frame, lens features, UV protection and what comes in the box. A small sticky bar with the name, price and an “Add to cart” button appears once the main button scrolls away, but it overlaps the description text.
There is no reviews section on the product page.
What works:
What to improve:
The cart shows one compact row per item with a quantity stepper. The summary box says “All taxes are included” and “Free shipping worldwide”, then stacks four buttons: Check out, Shop Pay, PayPal and Google Pay.
Telling shoppers taxes and shipping are already covered removes the most common surprise at checkout. A “You may also like” row sits below the cart.
The mobile homepage keeps the full-screen campaign with a black “Preorder Now” bar. A floating “Shop Best Sellers” pill overlaps the hero text.
The mobile product page pins “Add to cart” and Shop Pay side by side at the bottom of the screen. A floating “Explore this product” pill covers part of the lens type buttons.
What to improve:
Óptica Bassol is a family-owned optical retailer in Barcelona selling designer sunglasses and prescription frames from more than 20 suppliers, according to Shopify. The store is in Spanish and built for a large multi-brand catalogue. Its lens flow carries the most trust signals of the five stores.
| UX area | Rating | Why |
|---|---|---|
| Homepage and navigation | Strong | Permanent search bar, brand logos, phone number |
| Product page | Good | Delivery date and lens button, sticky card covers content |
| Lens selection flow | Strong | 4 named steps, trust badges, running subtotal |
| Cart | Good | Discount field and express pay, banner pushes items down |
| Mobile experience | Good | Search always visible, no sticky buy button |
The homepage is built for search. A large search bar sits under the header on every page, and a strip of designer logos (Oliver Peoples, Bottega Veneta, Tiffany, Dita, Matsuda, Moncler) gives brand shoppers a shortcut.
The header also shows a phone number, a country and currency switcher, a language switcher and a Trustpilot rating. For a store selling designer frames across many markets, these details answer “Who are you?” and “Do you ship to me?” on the first screen.
The menu reads Gafas de sol (sunglasses), Gafas graduadas (prescription glasses), Boutique, Deporte (sport), Explorar and Lentes (lenses).
The product page shows the price with the recommended retail price struck through, seven colour thumbnails, the size in millimetres and an estimated delivery date. Two buttons sit one above the other: “Elige tus lentes” (choose your lenses) and “Añadir al carrito” (add to cart).
Klarna and PayPal instalment lines sit under the buttons, and “24/48H” and “Bestseller” badges sit on the photo. Shoppers see the price, the delivery date and the payment options without scrolling.
Further down, four accordions with icons cover the description, product details, shipping and returns, and reviews. Product details is a clean two-column spec table with bridge width, temple length, lens type and material. The reviews accordion shows the store’s Trustpilot badge.
A floating card with the price and both buttons follows the shopper down the page, but it covers part of the accordion list.
What works:
What to improve:
The lens flow opens as a full-screen split view. The left side keeps the frame photo, the product name, the Trustpilot rating, a back button and a running subtotal. It also lists three trust badges: a 3-year guarantee, Zeiss Vision Expert and professional opticians.
A progress bar shows four named steps: Uso (use), Prescripción, Lentes and Complementos (extras). Step one shows three large cards with an image and a description: single vision lenses, progressive lenses and frames without prescription. Choosing frames without prescription adds the frame straight to the cart and skips the remaining steps.
The cards show no prices, so shoppers don’t know the cost of progressive lenses until a later step. A “Chat online” card with an optician overlaps the heading.
What works:
What to improve:
The cart shows each item with a green “En stock” label, a quantity stepper and a bin icon. The order summary includes a discount code field, free shipping, the total and a delivery date range, then a green Checkout button with Shop Pay, PayPal and Google Pay below.
A large lens promotion banner sits at the top of the cart. On a laptop screen it pushes the cart items below the fold, so shoppers scroll to see what they are buying.
What to improve:
On mobile, the search field stays under the header on every page. On a product page it fills in with the product name, which shows shoppers where they are.
The mobile product page shows the delivery and bestseller badges, the brand logo, the price and seven colour thumbnails. No sticky buy button shows at the top of the page.
The table below compares the five stores on the patterns which matter most for an eyewear store.
| Store | Best UX feature | Biggest UX gap | Lens flow | Sticky mobile buy bar | Frame measurements |
|---|---|---|---|---|---|
| BonLook | 3-step lens overlay | Only Sort and Sale filters | Yes, 3 steps | No | No |
| Visionist | Eight filter groups | Plain cart, widgets on mobile | Yes, drawer | No | Partial |
| Blenders Eyewear | Fit guide drawing and photo reviews | Add-on card pushes the buy button down | Not needed | Yes | Yes |
| Etnia Barcelona | Shape icons and live result count | Floating pills overlap content | Lens type buttons | Yes | In a closed accordion |
| Óptica Bassol | Trust badges in the lens flow | Banner pushes cart items below the fold | Yes, 4 steps | No | Yes |
These patterns showed up on the best screens across the five stores. Each one fits a Shopify theme with a custom section or an app.
These problems showed up on at least one of the five stores.
For accessibility, check text contrast on lifestyle photos against the WCAG contrast guidance of at least 4.5:1, since many glasses buyers have reduced vision. For speed, load virtual try-on only when a shopper asks for it, and keep Largest Contentful Paint at 2.5 seconds or less, as Google’s Core Web Vitals guidance recommends.
The cost of a Shopify eyewear website depends on the number of products, the lens flow and the apps you need. A sunglasses store on a paid theme costs far less than a prescription store with a custom lens flow and virtual try-on.
My Shopify design and development packages start at ₹35,000 for Shopify Basic and ₹50,000 for Shopify Premium. Eyewear features such as a lens flow, a fit guide or a frame finder add to the scope. You get a fixed, written quote before work starts. Shopify subscription and app fees are separate.
No single store wins every area. BonLook has the clearest lens flow, Visionist and Etnia Barcelona have the best filters, and Blenders Eyewear has the best fit guide, reviews and mobile buy bar. Combine the best pattern from each area for your own store.
An eyewear product page needs photos from several angles, colour options, frame measurements, fit help, a clear lens button for prescription frames, and returns details near the buy button. Blenders Eyewear adds the ideal face shape and head size, which helps shoppers buying without trying on.
A good lens flow runs in short steps, keeps the frame in view, shows the current step and shows a price on each option. BonLook uses a full-screen overlay with 3 steps. Óptica Bassol uses 4 named steps with trust badges and a running subtotal.
Not at launch. BonLook, Visionist and Etnia Barcelona all offer virtual try-on, but clear photos, frame measurements and a fit guide matter first. Add try-on once you have traffic, and load it only when a shopper opens it.
A good mobile eyewear store keeps the buy button in reach with a sticky bar, keeps chat and offer widgets away from buttons, and gives one-tap access to main categories. Blenders Eyewear’s sticky Add to Cart bar and BonLook’s category tab bar are the patterns to copy.
An SEO package for a new website is the fastest way to get a fresh…
Shopify has traditionally been associated with Liquid themes and the Online Store, but Shopify stores…
Quick Summary: Next.js WordPress in 60 Seconds Next.js WordPress is a headless architecture where WordPress…
Quick Summary Choosing the right NDIS website design is about much more than appearance. A…
Quick Summary Optimizing a Shopify store in 2026 is no longer just about ranking on…
Most people connect Cloudflare to their domain and then do nothing. The default settings protect…