Serious custom aprons for serious work.
Based on Vancouver's Granville Island, Search & Rescue (S&R) Apron Co. crafts serious aprons for serious work.Unfortunately, their custom ordering process required serious work as well, using text-based online forms, phone calls and countless back-and-forth emails. They needed a better way.
- 250,000+ Aprons made using the online tool since launch
- +45% Increase in total web orders over previous year
- 5 hours We were shocked to see the first order only hours after launch
- +46% Increase in total visitors over previous year
S&R Apron Co. manufactures premium aprons in Vancouver, Canada for bartenders, barbers, baristas, stylists, chefs, tattoo artists and other craftspeople throughout the world. Using ruggedly durable hardware and materials, S&R aprons are designed to not only protect their owners, but improve their image as well. These aprons are so stylish, in fact, that they've been embraced by celebrities like Jamie Oliver, and have even been spotted in the hit HBO series, Game of Thrones.
Founder Will Fosdick saw our work for Murphy Wall-Beds and asked us to improve S&R's custom apron ordering process—one that needed the customer to answer a series of questions in a text-based form. That data would flow into a complicated series of follow-up email exchanges, planning and proofs before a mockup apron could finally be seen and ordered.
The solution was a simple, visual ordering process that works beautifully on desktop and mobile devices.
ABOVE: A screen recording showing the easy six-step process
BEFORE: View the old way of ordering custom aprons - a text based form.
Overview + Planning
To begin, we met with Will Fosdick, S&R's founder and owner, to discuss his product, along with the vision and goals for the new online tool.
Together, we developed a final scope of requirements that would define how the site is designed and programmed.
-
Mobile friendly
It must be accessible and easy to use on all modern devices, not just desktop computers. -
Easy to understand
Customizing an order can be overwhelming. It must make the process easy for our users to grasp. -
Straightforward
No additional customer followup should be required once an order has been placed. All options and components must be available online. -
Fast loading
Users will not endure long load times between areas. It must feel seamless. -
Shopify integration
It must fully integrate with S&R's existing Shopify website and content.
Challenge:
Apron Visuals
Users need to be able to see and choose from all of the available options. It's critical that the graphics on screen represent the selections the user has made. How do we achieve this?
Keep scrolling to see the solutionChallenge:
Shopify Integration
S&R's website is built on Shopify. How do we build this tool in a way that will allow orders to flow into their existing back-end order management area without any extra steps?
Keep scrolling to see the solutionBranding
Wireframing
Each area of the site was thoroughly wireframed — every feature, every button. We needed to ensure that we had a full understanding of their products and their components, and that everyone agreed on how it would be organized.
Features
Apron Straps
Apron straps are difficult to show but are important to the product's design and functionality. They're best seen from the back, so we needed to give the user a way to view their product from multiple angles.
To achieve this, all apron renderings included both front and back views. The website features a flip button that provides the ability to change the view—and straps—at any time.
Apron Pockets
Pockets are another important element, but they can be placed in a variety of positions, and they would be impossible to see on some renderings. So we used dynamic line art overlays.
Using these handy overlays, users can see and select from a combination single or dual pocket layouts, and control their positions. This solution allowed maximum flexibility and lower costs.
Branding
Corporate customers needed an easy way to add their logo to their aprons, but many users are unable to upload the file format necessary for it to display properly within the interface.
For this reason, a placeholder graphic is used to show the placement of the customer's logo and allow proper size and positioning.
Mobile
All features seen in the desktop browser version are also available on mobile. Presently, nearly 50% of orders are coming from mobile devices.
Problem Solving
Above: A 3D rendered apron, chosen as the best route
Visuals are everything. How do we show the customer their premium apron?
Option 1 - Photography
A traditional approach would have us take photographs of every apron and component, extract the individual elements into separate images using Photoshop, then dynamically merge them together using custom programming.
-
Pros
Initial photo shoots are relatively quick and inexpensive
-
Cons
Future aprons would require all new shoots
New shoots require exact positioning and lighting
High budget required for image processing in Adobe Photoshop
Option 2 - 3D Renderings
Rendered images give us more flexibility, however they're bring a higher initial investment cost.
-
Pros
Extreme flexibility. A modeled apron can be re-texturized in minutes
Minimal post-production work needed
Very easy to add more aprons in the future
-
Cons
Higher initial cost
Slower to produce
Straps were rendered separately for easy integration
Shopify Integration
To integrate S&R's custom ordering tool into their existing e-commerce platform, we learned the Shopify API. By linking their platform to our tool, we ensured that our custom aprons would funnel directly into their existing checkout system.
This meant that orders placed using the custom apron tool would seamlessly integrate with all other online orders, making the ordering process quick and easy for both parties.
Successes
An outstanding testimonial
Once the online ordering tool was up and running, S&R sent promo codes to social media influencers within their target industries. They were given the opportunity to try out the new tool and build a custom apron free of charge and, more importantly, with no strings attached.
A few weeks later, Luka Lajoie, a Montreal based tattoo artist, uploaded the following video to his Instagram and Youtube accounts. Despite any outright requests for publicity, Luka provides S&R with an outstanding testimonial, praising both the quality of the aprons and the ease of the ordering process.
We've expanded our relationship with S&R since the successful launch of their custom apron tool. Plans are in the works to improve their entire Shopify-based website, their online ad campaigns and their search engine marketing—all great efforts to connect with more customers and wow them with an exceptional product and an exceptional online shopping experience.
VISIT WEBSITE BACK TO OUR WORK