HEARTWOOD Landing page & brand direction for a slow-living botanical skincare line Heartwood make...HEARTWOOD Landing page & brand direction for a slow-living botanical skincare line Heartwood make...
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
HEARTWOOD Landing page & brand direction for a slow-living botanical skincare line
Heartwood makes skincare for older skin, so the whole thing had to feel unhurried and kind rather than clinical. I brainstormed and wireframed the structure in Figma, building it on a wabi-sabi palette — warm bone (#F5EFE6), deep walnut (#5C4033), and a muted wood taupe (#655C55) for the accents — with Fraunces carrying the calm headlines and Inter handling the body. There's no pure black or white anywhere; every tone sits a few degrees warmer.
Because the audience skews older, accessibility drove the calls: body text never drops below 16px, tap targets stay generous, and every pairing is contrast-checked to WCAG AA. Motion is limited to slow fade-ins — nothing that startles.
The wood-grain heart logo and product imagery were generated and cleaned up in ChatGPT, the hero clip came out of Veo, and I built the final responsive site in Framer — with Claude as a design-and-build partner throughout.
Tools: Figma (wireframing & design) · Framer (build) · Claude · ChatGPT (imagery) · Veo (video)
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started