What is this project about?

Helping a small business build an online store with Shopify
(January 2020 to present)

Background

Tesoro Beauty was referred to me by another freelance client. The two owners, sisters, were looking for someone with Shopify development experience, a design eye, and hoping for some marketing and SEO guidance as well. Their branding was already in place, and their business already had a vision. Their goal was to begin listing their beauty services online, so that clients could contact them to book appointments for facials, hair treatments, and hair extensions. 

In addition to services, the clients have their own line of hair extensions and eye lashes for sale, and they also sell high-end skin care and hair care products. Future goals for the site were to list all of their products online and offer them to clients who utilize their services.

The initial roadwork

At the outset of the project, we began collaborating on posting in-store services that clients could find online, and book appointments for via the website. The clients sent emails with their visions described in words, and I got to work creating mockups that could help them visualize how we could lay out the information in an usable way. 

Then COVID-19 hit... and their business strategy had to change drastically. The client contacted me and asked me to pivot quickly off of posting in-store services, and to move forward on getting their products online and customizing their online shopping experience.

Challenges

The clients were very excited and eager to continue their business online during the COVID shutdown, so being able to sell products online was paramount. They were full of energy and ideas, and it was my job to prioritize the incoming requests, document them carefully and ask questions to clarify, as needed.

As product descriptions and images started rolling in, I worked with the clients to post products and integrate the necessary information into the Shopify CMS, including pricing, product SKUs, images, and variants. We put in a lot of work in a short period of time.

While I was posting products, the client reviewed the progress and submitted additional requests for how products should be laid out, and functionality they hoped to have. Many requests exceeded the capabilities of the installed theme and Shopify parameters.

The Work

Once I had prioritized the client requests, I began working through them.

On Product pages, the client wanted to be able to show variants. One of their products - hair extensions - included over 160 variants for a single product, including colour, length, and weight. Shopify only allows 100 variants to be created, so I set about researching Shopify apps that might handle this requested functionality. 

I found several apps that could do what the client needed in this case, and rounded up the top three to present to the client. I listed the benefits of each app, and the limitations. Included in the proposal was a summary of the positive and negative reviews from other users, which can help surface possible problems with each app. In addition, I listed pros and cons for usability - keeping in mind that it was the client's desire to be able to manage some of this functionality themselves once the site was built.

This process was repeated for another two apps required to extend Shopify's functionality, and helped the client decide which app was the best fit for their business.

Custom Code

A number of incoming requests could be handled simply by customizing the code used in the Shopify template the client was using. Through a mixture of Liquid, HTML, CSS and Javascript, I was able to customize the look and feel as well as the functionality of pages, navigation, animations and interactions, HTML email templates, and more.

My strategy was to utilize the power of Liquid to ensure that if the client had to make changes to the site, that it was as easy as possible.

Accomplishments

• Created custom layout for hair extension services page using Liquid, HTML and CSS
• Created and tested responsive layouts throughout the site that work on a variety of devices and viewports
• Added over 300 products, 40 collections and custom tagging to enable users to find what they need
• Implemented a mega-menu, using a Shopify App, to customize how users can find the products they are looking for quickly
• Upgraded the search functionality to return a complete list of products
• Enabled the client to post more than the 100 variants allowed by Shopify for a single product, by preparing a comprehensive proposal to the client
• Customized email notifications that users will receive, by adhering to email HTML guidelines for best viewing in most email clients
• Researched shipping processes and presented findings to the client
• And we aren't done yet!