Oura Ring

Oura

Building a digital foundation for international ecommerces

Shopify Development

Design System Development

Next.js

UX Consultancy

  • Shopify Development

  • Design System Development

  • Next.js

  • UX Consultancy

Live site

https://ouraring.com

Digital design

Character SF, Black and Black

TechStack

Next.js

Vercel

Oura monitors your body's pulse, movement, and temperature to give you a holistic picture of your health. With sales of over 150,000 rings and a team of more than 100 employees globally, Oura is now a leader in the smart ring market. Recently, Oura raises $28 million series B for its health and sleep tracking ring.

We helped Oura build a new ecommerce storefront and incorporate reimagined branding by San Francisco based agency Character.

Homepage
Sleep measure
Product
Why Oura

Headless architecture

Oura’s previous technology relied on WooCommerce and WordPress. The goal was to break from the existing monolithic architecture and focus on two core aspects — flexibility and speed.

What we did:

  • Consulted Oura developers about picking the right framework for the task, namely next.js.
  • Delivered a React storefront with a unified API layer for easy and flexible connection with other web services (including Shopify).
  • We reused blog content from the old WordPress website without needing to migrate data to a new CMS (thanks to the headless approach). It saved a ton of time for the content team.
  • Integrated advanced analytics including components with Segment as an underlying analytics platform.
  • Advised with deployment configuration on the Vercel platform for development purposes.
Architecture

Custom Checkout

We knew checkout was crucial to Oura’s international success and would be continuously improved. Using our own commerce-ui framework, we delivered a flexible system of checkout components. This empowered back-end developers to almost instantly compose interface layers for the new features they worked on.

Checkout

Components library

To make it easy for Oura to understand and own their new website, we created a component-based library using Storybook. Each component has stories for understanding the context and considering all possible use cases. Every color, space, and font is used from the global configuration. We leveraged a design token approach for smooth communication between designers and developers.

Fonts
Grid
Spacings
Let’s talk
Do you feel like we could help with your ecommerce challenges? Contact us at:
hello@commerce-ui.com
Copied to clipboard
Get eCommerce insights in your inbox. No spam, just relevant stories.
Thank you. You're subscribed now!
By signing up you are agreeing to our privacy policy

Hiring Front-End Engineers

Join us

© 2024 Commerce-UI

linkedin
instagram
twitter