Imagine Stories turns a child's name, face and personality into hardcover storybooks, then pairs each one with a matching toy so the lesson keeps going off the page. Swiss studio Artasaka built the brand's first online store as a Framer ecommerce store, with Shopify and Frameship selling three products on every page, and it took two orders on day one before the official launch.

imaginestories.com built with Framer + Shopify + Frameship

Three products, one page, endless personalisation

Founder Sabina Miller is an architect and interior designer by trade. After her son was born, she stepped back from job sites to be home with him and started teaching him life skills early, focused on how to think rather than what to think. She tried the personalised books already on the market, but they all looked the same, skipped the lessons and came with nothing to play with. So she made her own, starting with a story called Tootsie & Footsie. You can read Sabina's full story on the Imagine Stories blog.

Today each theme, from bedtime to teamwork, comes as a personalised book, a matching toy set and a bundle called The Works, and families choose personalisation and hardcover size before they buy.

That made for an unusual store. The brand had never sold online before, and Sabina wanted all three products for each story on a single page rather than split across a catalog.

"There hasn't been an official store before, due to the client wanting merged product pages (3 products per page) and Framer development speed, a Framer solution was the only thing we looked at." – Nicole Mirkovic, Team Lead, Artasaka

A standard Shopify theme couldn't deliver merged product pages without heavy custom work, and Artasaka already moved fastest in Framer.

Frameship or Framer Commerce

With Framer settled, the choice came down to Frameship or Framer Commerce. Frameship connects Shopify to Framer, and its one-time payment and simple setup put it ahead. The deciding factor was personalisation.

"Most of all the features for personalization/customization fields were very necessary for us." – Nicole Mirkovic, Team Lead, Artasaka

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.

Almost every Frameship component

Artasaka built the site in Framer and used nearly the full Frameship library to make three-in-one product pages work.

"The gallery, the product components and Carts, a lot of customization fields that we presented as a multi-form field basically and the shop/products page with the built in filtering and favoriting." – Nicole Mirkovic, Team Lead, Artasaka

Each product page stacks Frameship's gallery and product components for the book, the toy set and the bundle, each with its own add to cart. Personalisation runs through Frameship's customisation fields, grouped into one multi-step form so parents can enter their child's details without leaving the page. Each component was dropped into Framer and styled to match the brand's playful look, with the Shopify connection already built in.

The shop page uses Frameship's built-in filtering and favourites, so parents can narrow down by books, toy sets or bundles and save stories for later. Products sync from Shopify into Framer CMS, and the team runs a sync whenever the catalog changes in Shopify.

Two orders before launch day

The store went live quietly ahead of its official launch.

Two orders on day one

Orders came in within 24 hours of publishing, before any announcement.

Three products per page

Every story sells its book, toy set and bundle from a single page.

Personalisation built in

Customisation fields capture each child's details as part of the order, with no code.

Framer speed, Shopify backend

Artasaka designs in Framer while Shopify handles products, orders and checkout.