Hatchets & Hops[2022]
Strategy
Identifying goals and action items
The client's business primarily made money by selling axe-throwing time slots to parties. With that said the main goal of the site would be to promote users to book a throwing party with Hatchets & Hops. The site also needed to promote multiple franchise locations, host merchandise sales, sell league-play memberships, and generally have a more on-brand personality.
Primary goals with implementable action items were as follows:
1. Increase Booking
As the primary goal, booking would need to be addressed throughout the sitemap as well as specifically within the booking process itself.
1. Address Hierarchy
The client's old site did poor job of prominently placing booking CTAs within the site architecture and visual hierarchy so we aimed to address this.
The booking process itself also needed a refresh to decrease bounce rates.
To help the client's booking rate we executed the following:
- Booking CTAs featured in nearly every section
- Fixed rotating Booking CTA in the bottom right corner of the site layout
- Overall decluttered layout so Booking CTAs could properly stand out
- Redesigned Booking process with a smoother overall experience to decrease bounce rate (better typographic and content hierarchy, progress bar, simplified iconography, etc.)
2. Organize Content
The client's site needed to support a variety of content including:
- FAQs
- Location specific details
- League sign-ups
- A merchandise e-commerce store
- Unique event booking
- Food and drink menus
This content needed to be carefully organized within the site architecture to keep navigation simple and easy to understand for users.
2. Thoughtful Sitemap
Creating a sitemap that allowed users to efficiently navigate the site was at the forefront of our thinking while organizing content. The following was done to ensure optimal site organization:
- Less top level pages (more nesting)
- Navigation drop-downs
- Better inter-page linking so users on one page could more naturally progress to the next
- Unique e-commerce item layouts for merchandise and league memberships
- Filterable e-commerce storefront
3. Increase Personality
The Hatchets & Hops brand was not accurately represented by their old solution. The new site would need to lean into the fun and eccentric character of the H&H personality.
3. Fun Look and Voice
Establishing a brand's personality through a website can be done visually with UI and tonally through copywriting.
The following was done to align the personality of the site with the brand:
- Oversized headlines in all caps
- Wood graphic rotated buttons
- Rotated imagery
- "Bouncy" interaction animation
- Custom About page animations
- Goofy on-brand copywriting
4. Reduce Unnecessary Calls
A pain point of the client's team was the amount of calls they received from people asking questions that could preferably be answered by their existing FAQ page. The new site would need to better funnel users with questions to the FAQ page rather than a phone number.
4. Promote FAQ Page
In order to ensure users ended up on the FAQ page instead of on the phone the following was executed:
- A high contrast "Any Questions?" section at the bottom of every page pushing users to the FAQ page
- Copy and link on the Contact page pushing users to visit the FAQ page before unnecessarily filling the contact form or calling a H&H location
- A clear and easily navigable FAQ page layout
Process assets
Below is a collection of assets pulled from the UX design process including wireframes, sketches, and notes.
Final Designs
Interactions designed to evoke personality.
The FAQ page designed to limit unnecessary phone calls and contact form submissions.
Updated booking user-flow featuring progress indicators and cleaner interactive elements.
Results
Taking orders
The Hatchets & Hops site continues to offer users a great booking experience as well as merchandise through it's e-commerce store.
This site taught me a lot about web development and significantly increased my skill in that area. With that said, this was one of my first Webflow builds so it's not as client friendly and manageable as the sites I'm currently creating.
