×

Developers

Product

Use Cases

Pricing

Developers

Resources

Company

Get StartedLogin

Product

Pricing

Enter some text...

Atoms goes headless without the headache

The most customizable apparel brand easily creates custom shopping experiences with Builder

Start Building
View demo

CMS

A headless CMS anyone can use to create custom shopping experiences

Optimization

Built-in high-speed A/B testing to increase iteration and drive repeatable growth

Targeting

Customize experiences based on criteria (e.g items in cart, new vs. return customers, etc)

CMS

A headless CMS anyone can use to create custom shopping experiences

Optimization

Built-in high-speed A/B testing to increase iteration and drive repeatable growth

Targeting

Customize experiences based on criteria (e.g items in cart, new vs. return customers, etc.)

Atoms takes Shopify headless easily, and increases agility with Builder

The brand behind quarter size increments is taking a whole new approach to shoes

Founded in 2017, Atoms is a simplicity-obsessed company. Best known for their Model 000 shoes, which marry a trademark style with incredible comfort and unheard of customization (quarter sizes for each foot, so you can mix and match pairs). In the face of the pandemic, Atoms quickly launched a much-needed new product - copper-infused, reusable face masks - and a buy-one, donate-one system for customers to help fund community organizations.

Innovators at heart, Atoms’ team moved quickly to adapt to the global pandemic. However, the storefront could not keep up when even the smallest changes required a developer. The team knew something had to change.

With Builder, Atoms is moving faster and iterating more. Site updates that used to take days if not weeks of custom development, now take minutes and are as simple as drag and drop.

“Almost immediately, Builder solved more than half the battle for us.”

Dawa Sherpa, Head of Engineering at Atoms

What got you here won’t get you there

As a Shopify Plus merchant, Atoms had generated incredible momentum. They built a world-class brand and a viral product, but their Shopify template was limited, especially when it came to supporting their innovative model. Whether it was instituting quarter sizing or sending customers three pairs of shoes with each order to ensure the best fit, the Atoms team found that any idea, no matter how small, almost always required custom development to make a reality.

The entire team found themselves hindered by this sub-optimal workflow, one where Marketing and Growth did not have the ability to edit the storefront, Customer Support couldn’t provide basic assistance without developer support, and engineering was inundated with their requests. No one was winning.

Any change to the site would start with a change request, developers would then build the page/s in React, commit the change to Github, and then push it back to Shopify. Small changes could take a couple hours, while more complex changes required days or even weeks. When conversions started suffering, the Atoms team knew it was time to take a new approach.

“This wasn’t just about Shopify. It was about finding a content management solution that gave everyone at the company the kind of access, control, and ease of use they needed to deliver the best possible customer experience.”

A CMS that works for everyone

After exploring landing page builders as a possible solution (too narrow, lacked traction with Marketing and Growth), Atoms attempted to build their own CMS, which turned out to be too time-intensive. They then looked into the popular headless CMS providers, only to find them to be costly and/or lacking value-add. That’s when they found Builder.

“We had many teams that need different things, so I was evaluating Builder from the perspective of a developer, a designer, a marketer, and a support rep. From the start, Builder gave us the most complete, out-of-the-box set of capabilities, including multivariate testing and analytics.”

For Atoms, there were two major benefits that drove them to choose Builder:

Builder’s robust capabilities out of the box: a headless CMS that came with drag and drop editing, A/B testing, content target, and analytics which integrates with any homegrown or third-party tool, data, or platform.

The ability to migrate to headless incrementally. With Builder, you don't have to wait to rebuild the entire site to start reaping the benefits of headless commerce. You can start with as little as one page to prove ROI and expand. Any content you create in Builder supports both headless and hosted sites, so you can use seamlessly migrate one page at a time.

“Going headless can be a daunting exercise for Shopify merchants, but it doesn’t have to be.”

The Atoms teams proved that going headless doesn’t have to be a long, costly, or all-or-nothing project. Within the first month, they integrated their own code components into Builder, started creating pages, and ran A/B tests on the homepage. This was just the start.

Taking an incremental approach, Sherpa’s team was able to move headless on their own time, and invite other stakeholders to test out Builder for their own use cases. Designers, who would previously hand-off design files to developers and deal with lots of back-and-forth, could now build entire pages, like this one, on their own. Everyone felt capable of creating the experiences they needed.

Atoms editorializes product pages with Builder. The complex product logic is added to Builder as code.

Site navigation and links are also managed in Builder with live, real-time previewing.

Variants galore

Before Builder, the Atoms team had struggled with something that’s key to any direct-to-consumer brand: visual variants. “Shopify doesn’t have the kind of robust image system we needed,” explains Sherpa, “but with Builder, we were able to create as many content variations as we wanted.” With Builder’s visual editor, anyone can update carousel images, swap out hero pictures, and even build custom pages from scratch without extra tagging or hassle.

The team didn’t just create variants, they acted on them. Marketing and Growth control the variants that are displayed and hidden on each page, so that they could customize the customer’s experience down to the color, image, and headline. This allowed the team to move fast especially when it mattered, as they did during the start of the pandemic when they A/B tested shoe vs shoe + mask offers using Builder’s built-in A/B testing. Featuring the new masks turned out to perform better than displaying the shoes alone.

Builder checks all of our requirements for a no-code platform + headless CMS system. It allows our devs to code in React, customer support to edit or add new content to key pages, and most of all, it allows us to rapidly test content and flow changes to lift conversions and drive growth in a fraction of the time it took before.

Today, Atoms is creating, publishing, and testing content on a more frequent basis. All merchandising and content experiences are managed in Builder, the teams are free to make changes without compromising the elaborate product structure and sizing logic that live in code. “The code components and bespoke design elements co-exist,” says Sherpa.

Now, Sherpa’s engineering team is as busy as ever, and for the right reasons. They’re finally free to focus on the most critical areas on their roadmap.

“For a small digital-first company, we’ve unblocked a really critical resource—our engineers.”

REQUIREMENTS

A content platform that non-developers can use to manage the storefront

Developers to spend less time building landing pages

An easy way to take Shopify headless, without a full rewrite/heavy costs

A way to support the culture of experimentation that is core to Atoms

RESULTS

Marketing and Growth can add custom experiences to the storefront

Site updates went from days or week to minutes

Optimization is a breeze with built-in A/B testing

Personalized experiences based on criteria, such as items in cart, past purchases, and more

Easy, incremental migration to headless with Builder



“For a small digital-first company, we’ve unblocked a really critical resource - our engineers.”

“For a small digital-first company, we’ve unblocked a really critical resource—our engineers.”

Atoms is a direct-to-consumer online footwear retailer, that is behind one of the most comfortable shoes on the market. The brand is committed to ultimate comfort and exceptional customer experience.

Did we mention this site was made with Builder?

Get Started Free
Visually build and optimize digital experiences on any tech stack. No coding required, and developer approved.

Sign up

Log in

DEVELOPERS

Builder for Developers

Developer Docs

Github

JSX Lite

Qwik

INTEGRATIONS

React

Angular

Next.js

Gatsby

PRODUCT

Product features

Pricing

RESOURCES

User Guides

Blog

Forum

Landing Page Templates

COMPANY

About

Careers

Visually build and optimize digital experiences on any tech stack. No coding required, and developer approved.

DEVELOPERS

Builder for Developers

Developer Docs

Github

Mitosis

Qwik

INTEGRATIONS

React

Angular

Next.js

Gatsby

PRODUCT

Product features

Pricing

RESOURCES

User Guides

Blog

Forum

Templates

COMPANY

About

Careers 🚀

© 2021 Builder.io, Inc.

Security

Privacy Policy

Terms of Service

© 2021 Builder.io, Inc.

Security

Privacy Policy

Terms of Service

PRODUCT

Visual CMS

Theme Studio

INTEGRATIONS

React

Angular

Next.js

Gatsby

GET IN TOUCH

About Us

Twitter

Linkedin

Chat With Us

Sign up

Log in

© 2021 Builder.io, Inc.

Security

Privacy Policy

Terms of Service