What The Glass Skin

What The Glass Skin was preparing to launch a beauty supplement: a dissolving oral strip made with glutathione, collagen and acerola extract. The product would sell on Amazon first, and the team was about to start its Instagram rollout. They needed a Shopify store that could collect emails straight away and grow into a full site later.

The brief asked for a homepage built around the brand's photo shoot, a newsletter signup, a product section with key information and links to Amazon, and a short About Us section telling the brand story. The signup page was the priority, because it had to be ready when Instagram went live.

The first homepage draft did not match the brand. The team had a corporate design guide with its own fonts, colours, logos and icons, and wanted a softer look closer to Vanessa Megan, with beige backgrounds and light gray behind images. Black was for text only.

For the first weeks, visitors were meant to see only a signup page and not the rest of the site. That page had to lead with the cherry photo from the shoot, cropped to the mouth, packaging and hands, and say "Something worth waiting for is almost here".

The photos needed care. Images were cropped badly or looked pixelated, some appeared twice, and icon sizes did not line up, especially on mobile.

At launch, the team found that newsletter signups were arriving as contact form messages instead of email subscribers, so the launch email could not reach them.

Later, the product page needed room for two videos and before and after photos without both videos fighting for attention.

• 01 A coming-soon page for the Instagram launch We handled the Shopify store setup, then built the password page as the brand's only public page before launch: the cherry photo as the background, "What the Glass Skin" set in Benton Modern D Ultra in place of the small logo, and a first name and email signup. We recropped the cherry photo across several rounds and set separate desktop and mobile crops so the focus stayed on the cherry and the packaging.
• 02 A homepage built from the corporate design guide We rebuilt the homepage on Tinker in the brand's own fonts, Benton Modern D and Open Sans, with beige section backgrounds, light gray image backgrounds and black kept for text. We worked through the team's design change documents round by round: swapping in specific photos from the shoot, fixing crops, giving each section more space, aligning paragraphs and evening out the ingredient icons on desktop and mobile.
• 03 Product information with Amazon links The product section explains the strip, its key ingredients and how to take it, with buy buttons linking to the Amazon listing while the product was not yet sold on the store. We replaced the "not a pill, not a powder" icons with plain text, matched the icons to the packaging and changed the milk thistle icon, which had wrongly used the lactose free milk icon.
• 04 Newsletter signups that become subscribers When the team found signups going to a contact form, we moved every existing signup into Shopify as an email subscriber with a waitlist tag. We then replaced the form with Shopify's newsletter form so new signups are subscribed and tagged automatically, turned on double opt-in and confirmed it worked in a clean browser.
• 05 From pre-launch to the live site For the public homepage, we replaced the pre-launch wording with a normal brand introduction and a subscribe for updates button, keeping the same layout. We updated the how to take it copy to say the strip goes on the roof of the mouth, removed a video section until the team had footage, and pointed whattheglassskin.com to the full site instead of the password page.
• 06 Product page videos and before and after photos Using byAVA as a reference, we added the brand's two videos to the product page. The team found two videos playing at once distracting, so we reworked the layout with before and after photos between them under "See the Transformation", set the lower video to a 5:4 format, added the how it works copy and removed the Subscribe and Save image. The team approved it on a preview theme before we published it.