Monograph / 01 of 03
TEchnical specs
role
UX / IA + Development
Client
Pau Hana Surf Supply
Year
2025
Stack
→ Shopify
→ Liquid
→ UX Design
→ Information Architecture
Status
SHIPPED
Build Notes
The default template got Pau Hana most of the way there. But "most of the way" isn't the same as "built for paddleboards". Some of what their customers needed to compare and decide just wasn't a Shopify default. So rather than a theme swap, I wrote custom Liquid sections: targeted, built to fit the brand and the way people actually shop for a board.
\\\\\
The rating graphics were doing their job, until they weren't. JPEGs with no schema markup, no guarantee they'd even render, and every spec tweak meaning a new image export - times 30 boards, that's not a design problem anymore, it's a workflow problem.
So instead of forcing Shopify's default template to do something it wasn't built for, I built a custom section: animated SVG dials that read live from product metafields. Update a number in the bulk editor and the dial updates with it. No new asset, no ticket in my inbox. They're accessible (contrast-checked, they respect reduce-motion), and they carry their own structured data merged cleanly into the existing product schema instead of creating a duplicate node search engines would flag.
Same principle runs through the rest of the store: custom Liquid wherever the defaults didn't cover the angle the catalog needed, built around the IA that makes 30+ products easy to compare and easy to buy.
+ Schematic / how it works
FIG. 01 - Pau Hana Surf Supply Performance Dials
DRAWN BY HAND