Temper set out to make tennis feel less stiff, a Vienna brand of custom-cut apparel, hand-picked fabrics and unusual objects built around the four temperaments players carry on court, the Opportunist, the Stoic, the Strategist and the Initiator. The site was fully designed months before it could sell a thing, and the piece that finally connected Framer to Shopify came down to one weekend with Frameship.

temper.studio built with Framer + Shopify + Frameship

A finished site, hundreds of shops built, and still no way to sell.

Temper was a fresh start, so there was no old platform to leave behind. But co-founder Matthias had built hundreds of websites and shops through his Vienna design agency, Shopify and headless setups among them, and that background fixed two decisions from day one: Shopify would run the commerce, and every product and event would get its own properly designed page in Framer.

"For Temper I knew two things from the start, that Shopify would run the commerce and that I wanted every single product and event to have its own properly designed page, with real attention to detail, interactions and animations. Framer had all of that built in, so Framer was never in question." - Matthias, Co-founder, Temper

The site had been built page by page over months, alongside two full-time jobs. The static side was done, a working blog, everything in place, except the one thing a new tennis brand needs most, the shop. Matthias worked through the Shopify-to-Framer options on the market, plugins and services like Framer Commerce, and none of them held up. The fallback was a plain Shopify theme, which meant handing the look of the store to a template, exactly the compromise the whole site had been built to avoid.

One last try before cutting Framer entirely.

By the time Frameship came up, Matthias had given himself a single weekend to get the store live, and an ultimatum to go with it.

"I'd even given myself an ultimatum, if this last one doesn't work I'll cut Framer entirely and fall back to a plain Shopify theme until I can figure it out. Frameship was that last try." - Matthias

Frameship is a plugin that connects Shopify to Framer. Once installed, your Shopify products sync directly into Framer CMS. You then design your store pages in Framer as you normally would, dropping in Frameship's pre-built ecommerce components wherever you need them, each one customisable, with the Shopify connection already built in.

Products in, cart styled, checkout through Shopify.

The hard part was solved in that first weekend.

"There was a really good tutorial online, I installed it and it just worked." - Matthias

The first real signal was the connection itself, every product syncing from Shopify straight into the Framer site. From there the store came together as a design job rather than an engineering one. Each Frameship component is a visual design element dropped into Framer and customised there, with the Shopify connection already built into the component itself, so the cart was simply there to style and checkout runs through Shopify. The product and event pages kept their interactions and animations, and the commerce underneath went live without code.

"The first real signal was the connection itself, all my products loading from Shopify straight into my Framer site and once that held the rest followed, the cart was there to style and the checkout runs through Shopify anyway. The fine-tuning happened over the following evenings, but the hard part was solved that weekend." - Matthias

The result is a Framer ecommerce store that went on to win Framer's Site of the Year for visual design, with a working Shopify store underneath the whole time.

A store that runs itself while the next collection takes shape.

Day-to-day, Temper is still a side project run alongside two full-time jobs, and the store is built for exactly that.

"The shop runs itself in the background, which is exactly the point, because it frees up our limited hours for the part we actually care about, building the next thing." - Matthias

Live in one weekend

48 hours took Temper from a designed-but-not-functional site to a store that was actually selling.

Site of the Year for visual design

Framer's award, won without handing the look of the store to a template.

Commerce that looks after itself

Shopify handles orders and checkout in the background, freeing the founders' limited hours for the brand.

Room for what's next

A ten-product essentials collection lands in September, with a version two of the shop being built in the same stack.