[{"data":1,"prerenderedAt":148},["ShallowReactive",2],{"project-elevenlabs":3},{"id":4,"title":5,"body":6,"description":55,"draft":134,"extension":135,"meta":136,"navigation":137,"path":138,"seo":139,"sortOrder":132,"stem":140,"tagline":141,"thumbnails":142,"titleColor":146,"__hash__":147},"work\u002Fwork\u002Felevenlabs.md","ElevenLabs",{"type":7,"value":8,"toc":131},"minimark",[9,16,42,53,59,83,88,93,98,103,111,116,121,126],[10,11],"hero-image",{"alt":5,"href":12,"src":13,"subtitle":14,"title":15},"https:\u002F\u002Fstore.elevenlabs.io\u002F","\u002Fimages\u002Fwork\u002Felevenlabs\u002FGrid.png","Next.js + Shopify","ElevenLabs Merch Store",[17,18,20],"title-block",{"subtitle":19},"SF came with some seriously sharp design, and I brought it to life on a fully custom, headless Shopify front end.",[21,22,23,24,31,32,36,37,41],"p",{},"I teamed up with ",[25,26,30],"a",{"href":27,"rel":28},"https:\u002F\u002Fstudiofreight.com",[29],"nofollow","Studio Freight"," to create a ",[25,33,35],{"href":12,"rel":34},[29],"killer e-commerce site"," for ",[25,38,5],{"href":39,"rel":40},"https:\u002F\u002Felevenlabs.io\u002F",[29],".",[43,44,45],"side-note",{},[21,46,47,48,52],{},"The build speaks for itself, so ",[25,49,51],{"href":12,"rel":50},[29],"go click around the store"," first. But if you want the backstory, here it is.",[17,54,56],{"subtitle":55},"",[21,57,58],{},"What's the stack?",[60,61,62],"text-block",{},[21,63,64,65,68,70,71,76,77,82],{},"Built with Next.js and Shopify. The front end is completely custom, wired into Shopify's Storefront and Admin APIs through a GraphQL client I built myself. The cart's custom too: it assembles everything through the Storefront API, then hands off to Shopify's hosted checkout for payment.\n",[66,67],"br",{},[66,69],{},"\nMotion by ",[25,72,75],{"href":73,"rel":74},"https:\u002F\u002Fgsap.com\u002F",[29],"GSAP",". Scroll by ",[25,78,81],{"href":79,"rel":80},"https:\u002F\u002Fgithub.com\u002Fdarkroomengineering\u002Flenis",[29],"Lenis",", with the scroll-driven animation custom built on top.",[17,84,85],{"subtitle":55},[21,86,87],{},"What made this one different?",[60,89,90],{},[21,91,92],{},"This was my first time integrating Shopify into an e-commerce build, which was a blast to figure out. And the product carousel got genuinely hairy, with a pile of edge cases and overlap with other features. But I got it built WAY faster than I could've a year ago, thanks to my AI-powered workflow.",[94,95],"image-gallery",{":columns":96,":images":97},"2","[{\"src\":\"\u002Fimages\u002Fwork\u002Felevenlabs\u002Fbreak.png\",\"alt\":\"ElevenLabs storefront\"},{\"src\":\"\u002Fimages\u002Fwork\u002Felevenlabs\u002Fhero.png\",\"alt\":\"ElevenLabs merch\"}]",[17,99,100],{"subtitle":55},[21,101,102],{},"Favorite part?",[60,104,105],{},[21,106,107,110],{},[25,108,30],{"href":27,"rel":109},[29]," gave me room to play with the carousel, and I had a lot of fun dialing in the interactions. They're genuinely great to work with: open to ideas from the dev, and up for little extra features here and there.",[17,112,113],{"subtitle":55},[21,114,115],{},"Hardest part?",[60,117,118],{},[21,119,120],{},"The region selector. The design called for something that didn't match how Shopify handles regions under the hood. After a lot of back and forth, I built and documented a front-end layer that bridged the gap. It gave the design the structure it wanted, while still mapping cleanly to what Shopify expected underneath.",[17,122,123],{"subtitle":55},[21,124,125],{},"What would you change?",[60,127,128],{},[21,129,130],{},"The site is no-nonsense. Products, Info, Cart. But it would be cool to expand on the idea with a few more content pages.",{"title":55,"searchDepth":132,"depth":132,"links":133},2,[],false,"md",{},true,"\u002Fwork\u002Felevenlabs",{"title":5,"description":55},"work\u002Felevenlabs","Headless Shopify, turned up to Eleven",[143,144,145],"\u002Fimages\u002Fwork\u002Felevenlabs\u002Fhero.png","\u002Fimages\u002Fwork\u002Felevenlabs\u002Fthumb1.png","\u002Fimages\u002Fwork\u002Felevenlabs\u002Fthumb2.png",null,"MuO3I_ChmKS_yvv2amX5tfslk7yWcnxdGqWdgKQvPdk",1783832196917]