Hale Clothing

The new Hale site is built using Shopify. Using their new command-line tool and GitHub integrations made working on the site in our local dev environments much more accessible. In the future, it will also allow us to make tweaks locally easily without the changes affecting the live site.

Much work was put into the logic surrounding the product page, as each product would have different variants (e.g. size, colour), and the page info would need to be updated when you change variants. For example, suppose a particular variant is out of stock. In that case, the “Add to cart” button becomes disabled, and an out-of-stock message appears, allowing you to sign up for an email list when that product becomes available through Klaviyo.

We used AlpineJS, a lightweight Javascript framework that adds interactivity, to help us handle a lot of this logic. We used this to help us build out lots of features across the site, including adding/updating items to the cart, signing up users to email newsletters, filtering blog posts and paginating the results, image sliders, open/closing modals, displaying different size guides in tabs, FAQ accordions, etc. 

We used TailwindCSS, a utility-based CSS framework, to quickly create and style page elements.

Hale was provided with a new website focused on clean, fresh design that showcases its products whilst also telling the Hale story, sharing the thought process behind the brand, and putting the Hale community ethos front and centre.