The brief
Madrid doesn't give you Gill Sans at nine sizes, a seasonal gifting template, or a custom lightbox for material swatches. Every spacing value, every overlay percentage, every border radius was specified in the Figma file. Approximately correct was not an option. The store launched to its first paying customers within six weeks of brief sign-off.
Madrid was the base. Nearly every front-end detail was replaced. Gill Sans is not a Google Font, so font loading was handled explicitly to ensure 9px labels render identically on Mac and Windows. A custom lightbox was written in Liquid for the swatches page. The gifting page got its own editorial Liquid template. The material swatches grid was built on Shopify metaobjects.
The store launched in 2025. After sign-off, the client reviewed the live site against the Figma file section by section. There were no revision requests on the design.
One thing we'd do differently: define the metaobject schema for swatches at the start of the project. We refactored two templates mid-build when the scope expanded from materials to include finish types.
