Custom wallpaper ordering: measurements, crops, and checkout that match production.
+47%Order accuracy (Fewer remakes)
+22%PDP conversion (Configured SKUs)
-38%Support tickets (Sizing questions)
+29%Mobile completions (Complex PDP)
Project visuals
Screenshots from the build in a bento grid. Tap a tile to highlight it.
Wallpera Wallpapers homepage
The challenge
Wallpaper is not a standard e-commerce SKU. Customers need to specify wall dimensions, select crop regions from pattern repeats, and choose paper types, all before checkout. Generic product pages could not capture the production data Wallpera's fulfillment team requires.
Complex inputs
Width, height, area calculations, and validation had to feel simple to shoppers.
Visual crop accuracy
Customers must see exactly which portion of a pattern they are ordering.
Fulfillment data
Line item properties must survive cart, checkout, and order records without corruption.
How we approached it
- UX discovery. Defined requirements through mockups: measurements, pricing logic, crop handling, and paper variant presentation.
- Product page build. Implemented wall dimension fields with validation, area calculator, responsive crop UI, and custom paper type selector with metafield-driven help text.
- Checkout integration. Verified line item properties flow through cart and checkout with thorough QA across devices and edge cases.
Key deliverables
Wall Measurement System
- Width/height validation
- Area and roll calculator
- Line item property storage
Crop & Material UI
- Draggable crop selection
- Live dimension feedback
- Paper type cards with metafields
Outcomes
Production-ready ordersEvery order carries the measurements and crop data fulfillment needs.
Customer confidenceVisual crop tools reduce ordering mistakes and support tickets.
Mobile-friendlyComplex inputs work on phones with accessibility fallbacks.
Aligned workflowStorefront logic matches Wallpera's internal production process.
Stack and tools
Shopify LiquidJavaScriptLine item propertiesMetafieldsUX design