Bayelon: Device-first navigation for cases
When fit depends on the exact phone model, navigation has to start from the device, not the product
Theme work by Lintel’s founder, Gencer Karakaya.
- Sector
- Fashion
- Founder’s role
- Theme design and development
- Stack
- Shopify, Liquid
- Live store
- bayelon.com
This is the fitment problem: a catalog where the right product depends on the shopper’s device, then on style and color, so combinations multiply until a flat grid stops working, and choosing wrongly leaves the buyer with a case that does not fit. The pattern is to route people by device family first, then let variant pickers settle style and color on the page. Bayelon, which handcrafts leather cases for iPhone, Samsung Galaxy S and foldables, and Google Pixel, plus bags, wallets, AirTag and AirPods holders, and watch bands, is the worked example. Gencer grouped it into lifestyle hubs, added model-series menu drilldowns, and built swatch-based pickers with quick add.
The problem
Combining device, case style and leather color produced hundreds of variants, and any mismatch ends with a case the phone will not take.
The storefront pattern
- Lifestyle-hub mega menu that narrows to a model series within Pixel, Galaxy or iPhone
- Variant pickers in Liquid using named swatches for each leather color, with quick add inline
- Shared sections for compare-at prices, sale badges and the brand’s craft and patina story
- Mobile layout work so large leather photos and a lengthy best-sellers carousel behave on small screens
