Deck of Scarlet
The startup founders always think about how to deliver the best services and make customers happy. They faced the situation when it was needed to save all existing user accounts and provide secure migration to the new website. Otherwise, current user accounts would be lost and clients would have to register again.
Goodhabit
Building a Shopify beauty store from scratch for a cosmetic production and fragrance brand
Creating a Shopify cosmetic store for a new product line
| Location | New York, US | Cooperation model | Time and material |
|---|---|---|---|
| Industry | Partnership period | January 2019 - May 2021 | |
| Improvements plan | Discovery phase, requirements and estimation analysis, new features development, support and maintenance | Team size | 3 Shopify developers, Project manager |
| Technologies | Shopify, HTML5/CSS3, Liquid, JavaScript, JQuery, Webpack, Recharge, Advanced Custom Fields, Judge.me | ||
About the client
Goodhabit is a beauty brand established by the Scentbird company that focuses on producing and distributing cosmetics in the US. Its brands are keenly discussed by women and reviewed in popular magazines worldwide (i.e., CNN, Marie Claire, Harper's BAZAAR).
Goodhabit’s main focus is on providing cosmetics with blue light protection. Given the uniqueness of such a product line, the client required a Shopify store with custom features to introduce their new product line to the US audience.
At nearly the same period, the client also planned to release another store for their Deck of Scarlet brand. The DigitalSuits team worked on both projects to help Scentbird launch them without delays. Check the Deck of Scarlet’s success story for the details.
About the product
Goodhabit offers a broad spectrum of high-quality skincare cosmetics and fragrances. Among their bestsellers are an oil-serum for skin hydration, nourishing butter for lip treatment, and a skin-shielding serum. Their cleansers, masks, and creams are all about keeping skin healthy and prolonging its youth. Goodhabit banned from using in their cosmetics suspicious ingredients, such as glutaral and parabens, that may negatively impact the skin health.
The brand’s most prominent thing is ingredients for protecting skin from the blue light of phones, laptops, and TV screens. Since the project release coincided with the start of the COVID-19 quarantine, their product line became extremely popular and brought success to this brand.
Challenge overview for a Shopify beauty store case
The client was looking for a solution that would cover three major objectives:
- show the products’ uniqueness,
- create a perfect user experience,
- and draw attention to global environmental problems.
The company planned to create a community that would give customers perks for joining – annual free shipping, a 10% discount for all products, and, at the same time, an ability to contribute 5% of each order to charity.
Given that Scentbird wanted to launch the Goodhabit project in under three months, we had to meet tight deadlines without compromising website quality. The client provided us with designs for implementation, and we started Shopify website development from scratch.
Our solutions in creating Goodhabit’s beauty store on Shopify
We approved a development plan that contained five main parts:
- creating a home page
- adding collection and product pages with clear navigation
- integrating a blog and FAQ section
- implementing customer accounts with subscription discounts
- developing a cart with discount code fields.
Let's dive into the details of creating each component of Goodhabit’s Shopify cosmetic store.
Home page
In the header, we implemented a mega menu with the different product categories to streamline customer navigation across the store. We also set up a hero banner to showcase the company's top product and added a product slider to display other featured items. In the footer, we placed links to all website sections, such as blog, FAQ, and About Us.
Collection and PDP
We added a very intuitive and minimalistic collection page where customers can preview all the products and proceed with the exploration on a specific product page. To simplify the search for a desired product, we implemented filters that included the main product characteristics. Product pages contained descriptions, clinical results, ingredients, a how-to-use section with a short video instruction, and a review section. We integrated the latter option through a third-party service – Judge.me.
Blog and FAQ
One of the client’s main focuses in product introduction was a scientific approach, which meant showcasing their cosmetics from the perspective of their real influence on skin. For this reason, they required a blog to overview their products in the context of trending industry topics. We also developed an FAQ page with explanations regarding technologies involved in skin protection, product safety, and common questions about shipping and return policy.
Customer account
Creating customer accounts was a must for launching Goodhabit's subscription program. Our team implemented the subscription functionality using the Recharge third-party service integrated with the client’s Shopify theme.
To enable subscription discounts for registered customers, we created two product variants for the entire collection – with and without discounts. It helped us to automatically check customers' subscription statuses and change prices on their shopping cart: if a customer paid for the subscription, they saw the product prices with a 10% discount, if not, customers had to pay the full price.
Cart and checkout
The cart in the Goodhabit store contained product items, a subtotal, and a discount code field. We developed custom functionality for the discount code since back in 2019, Shopify had no native tools to enable this feature. We also added a cart drawer – a popup on the page's side that appears when a user adds a product to a cart. To let customers seamlessly complete the payment process, we leveraged the default Shopify checkout since it’s ideally optimized for conversions.
Performance improvement
Our work on a project goes beyond developing core functionality since we’re responsible for the store's smooth performance and fast load. The Goodhabit case is no exception. We tested the website's performance on different devices and followed the best practices for Shopify speed optimization. To minify JavaScript in the client’s store, we used Webpack, which significantly reduced loading times and improved user experience.
Results of developing a beauty Shopify store for Goodhabit
Results of developing a beauty Shopify store for Goodhabit Before the website release, we added a Coming Soon page to let the client process the early-bird orders generated through their ads. At the release date, Goodhabit had already had roughly 200 such orders. After the website launch, the number of orders continued to grow even more drastically since their new cosmetic Shopify store started to attract organic traffic using product pages and the blog.
More than 80% of Goodhabit customers purchased subscriptions, which let our client reengage loyal audiences and further grow their sales. Today, Goodhabit is a well-established brand that provides cosmetics to customers from the US and Canada, continuing its success story.
Sergei Gusev
Co-founder and CPO, Scentbird
5.0
"They did everything possible to launch our website on time."
DigitalSuits successfully executed on time, adhering to requirements, and a strict budget. The team's project management was extremely efficient. The team lead, in particular, always maintained a positive attitude and showcased utmost professionalism at all times. They truly went above and beyond.
Other success stories
Elite Fashion Brand
Creating a custom Shopify Plus feature for a premium fashion brand to increase sales
Yepoda
The DigitalSuits team migrated five Yepoda stores to Shopify 2.0 and added new designs and custom features to adapt its websites to modern market trends.