Layer is a collagen-drink brand

Layer is a collagen-drink brand getting ready to launch. I designed the storefront and built it myself on Shopify.

Homepage- A custom Shopify section on top of Dawn, re-skinned to Layer's brand: cream, ink and red, a mono typeface, and custom icons. Every block (hero, flavours, benefits) is editable in the Shopify editor, so the team can change the page without asking a developer.

Ethos section: the part I'm proudest of The founders' story is set on a canvas, and the Layer can is your cursor. Move it, and the text re-wraps around the can every frame, in two columns, like a magazine layout that reacts to you.

There's no library behind it. I wrote the layout engine by hand. It measures every word and works out, line by line, how much room is left on either side of the can. Basically CSS shape-outside, but around something that moves.

Accessibility- Canvas text is usually invisible to screen readers and search engines. Here, the real copy lives in the page and the canvas just draws it. On phones, the canvas switches off and you get normal, selectable text.

Merchant controls- Can size, spacing around the can, font size, colours and images are all editable in Shopify.

Also explored A scroll-driven GSAP timeline telling the two founders' stories side by side. It stayed a prototype and isn't in the final build.

Status: built and deployed, pre-launch.