Role: UX Designer - Contracty
UX Case - The Blend
Product Re-Design | Beam Suntory - Client
The Problem
Beam Suntory wanted to generate product and brand awareness for industry professionals (bartenders, bar managers, etc.). The problem was primarily that the business stakeholders had an idea of how the site should look, but due to competing websites, there were disagreements on how to design the project with third-party designers submitting competing designs that business stakeholders did not agree with.
My Role:
Design Goals and Objectives
UX research, information architecture, content strategy, UI design
Conduct user research and competitive analysis. Design responsive website and app. Rebrand for a more modern look.
Programs used:
Sketch, Illustrator, Photoshop, Pixton, InVision, Verify, Usability Hub
Research Phase
I conducted research on competitor websites in order to understand potential users and to understand what they want from an online community experience. I concentrated on the problem space - the bartending world, and what they would want from the website and the community it could generate - I searched the commonalities and sought out the behaviors, attitudes, and pain points of those in the bartending/hospitality community, as The Blend's moto is for hospitality, by hospitality.
Sitemap
After researching user search preferences I created a sitemap to ensure that users could navigate the website and interact with the content, in addition, improve SEO functionality.
User Flow
My user flow shows how a user navigates through the site and where critical decision points are. This helped me to determine which paths I would focus on during usability testing.
Wireframes
I created the interaction design, starting with low-fidelity drawn-out concepts, and conducted preference tests and memory tests. I question business stakeholders and used card tests to verify user flow. I then placed my wireframes - created in Adobe XD - into the sitemap structure.
Responsive Wireframes
I developed responsive wireframes to determine how the interaction design would translate across different devices and if any elements from the original desktop layout would not appear on mobile.
Prototype
I conducted usability testing by sending out links to the prototype to the business stakeholders and conducting a live test. Here the experience can make drastic changes to the actual product as problems and issues that were not conceived of initially can be discovered.
High Fidelity Mockup
The high-fidelity mockups were created in Sketch and presented to IT design and business stakeholders in Touchpoint meetings. Later after revisions, they were brought to the development team for site creation.
Summary
Beam Suntory's "The Blend" website makes it easy for users to learn new mixology techniques, from a community in the hospitality industry. It is a community resource. The navigation was designed to be user-friendly with logical categories and easy to find information. I worked closely with business stakeholders to ensure that the user flow was mapped out from the registration process to the recipe pages. Researching this target user group taught me how to prioritize the relevant information in a hierarchy that was beneficial
and easy to find.
and easy to find.
