Danny Harms, Creative Director at Hopsonomy
Matt Nelson, owner of Hopsonomy
Hopsonomy provides an online learning platform to teaches restaurant, bar, and taproom employees how to sell craft beer.
Matt identified an opportunity within the craft beer industry's currently steep learning curve, since classes offered by the competition can be advanced and alienating to beginners.
Hopsonomy combines Matt's restaurant industry experience, skills creating training content, and his passion for craft beer in an approachable library of learning courses.
Trainees learn about craft beer to increase sales, improve customer experience, and keep up with changing trends.
The original brand identity for Hopsonomy confused potential customers, and the logo often led people to mistakenly assume the company sold hops, the beer ingredient itself.
Through my discovery phase, we uncovered three main priorities for their new logo & brand identity:
To begin, the clients completed my brand questionnaire and I met to discuss their answers. This helped me discover their target market, what makes their company unique, and where they want to take the company in the future.
I researched other brands in their market and created a competitive analysis. From these insights, I determined a strategy and creative direction.
I moved away from using a hop cone as the icon from the original Hopsonomy logo, as that created confusion as to what the company offered customers.
The tagline "Pairing Beer With People" did a lot to explain the concept, so that remained a prominent part of the new design.
For the icon, we explored representing craft beer itself, as well as other visual themes that allude to selling more of it as a result of using Hopsonomy.
I started with a lot of quick sketches to encourage creativity and efficiently explore numerous ideas, then refined the concepts to review the strongest with the client.
I refined the concepts to help the final logo come to life a little more each round, guided by the client's feedback along the way.
I expanded the primary logo design to include alternate logo variations that are optimized for a variety of placement constrictions (such as embossing or embroidery).
This flexible logo system offers a robust toolkit to help those who work with the Hopsonomy brand.
To complete our logo and brand identity package, I designed the brand’s visible elements, such as the color palette, brand typefaces, usage guides (safe margins, sizing guide, incorrect usage), and image file explanations.
We then created a set of custom brand guidelines help Hopsonomy communicate a professional and consistent brand identity.
The company's tagline "Pairing Beer With People" offers a good window into an essential element in the process: People.
Beer customers display a broad spectrum of craft beer knowledge and can have palettes that are trained differently from person to person.
Hopsonomy courses train servers and hospitality industry workers ask questions and make suggestions determined by each individual customer's preferences.
I designed an icon set for the company to use across all customer touchpoints to explain both the brand to customers and then course concepts to trainees.
Specific, in-context set and settings help trainees connect their knowledge to the workplace scenarios and steps in the beer-making and selling process.
I designed several to staged background locations ranging from a brewery, to a bottle shop, to a taproom.
The combined character illustrations, scenes, and icons ultimately provided Matt and his Hopsonomy Learning & Development employees to assemble interactive training in their Storyboard 360 course design platform to pair beer with people.
Once I completed the brand identity design and brand illustrations, I moved on to the next major project, which was a new Hopsonomy website design.
I first assembled curated visual moodboards from inspirational examples already in use by other sites, and then discussed with Matt to surface insights and spark new ideas.
I met with Matt to discuss his overall goals for the site, understand his users, and anticipate their needs.
I laid out a sitemap to account for all pages, then drilled down further to outline content and goals for each page.
Then I designed user flows—how the user can accomplish each goal in as few steps as possible in a wireframe.
With my wireframe to guide me, I designed each page of the website in Adobe XD.
The site needed to both sell the product to new customers, and serve as the users overall learning platform for the product itself.
I combined the illustrations, logo, and brand elements like typefaces and a color palette to create artwork for the web design.
