mixrmainimage.jpg

Mixr

 

mixrmainimage.jpg

Mixr

Mixr is an online platform to help businesses host fun, engaging virtual happy hours by connecting them with local alcohol artisans. In 2020, we saw the importance of online connection and businesses struggling to find ways to keep their employee culture while everyone worked from home. Mixr serves to fix that problem. Our local artisans will virtually lead your company through a custom cocktail, answering any questions along the way and encouraging conversation.

 

Colors

When I think of cocktails or bars I tend to think of a darker space. They tend to have dim lighting paired with darker furniture. Considering that happy hour is a common time to go to a bar, I wanted to incorporate the atmosphere of the evening, so I chose to limit the bright, daytime feel from the space. I chose the background of the website to be darker in color to match an actual bar space. For the attention colors, I did a survey of 2000 people to get their thoughts of what colors they think of when they think of mixed drinks: the overwhelming response was pink and orange.

MixrColors.png
 

Logo

For the logo, I wanted the name to be clear within the logo. The name “Mixr” is a play off the use of mixers in cocktails and social mixers. The logo would be used throughout the website, and ideally on the boxes of goods sent to attendees. I wanted to have the brand feel slightly sophisticated with a logo to match that sophistication. People often view harder edges and geometric shapes as more sophisticated than their rounded corner counterparts. Considering this, I wanted to incorporate circles throughout to match the idea of a social circle and the shape of circular glasses. The logo utilizes one of the special characters from the rightmost image, paired with easy to read text for the rest.

finallogo.png
finalspeicalfont.png
 

Typography

My goal for this website was to have the images and colors pop. I wanted the font to be basic to not detract from the imagery. For this site I used Gotham and Georgia.

mixrfonts.png
 

Images

In previous work, I have used icons as some of the main graphics throughout the site. In this site, I wanted to let the cocktails speak for themselves. I used a combination of drink photos with brighter and darker backgrounds. I wanted fairly neutral backgrounds with bright drinks to really let the drinks pop. Interestingly enough, all of the cocktail images I used in the original moodboard were orange and pink, matching the brand colors.

imagemoodboard.png
 

Home

Below is the homepage I created for Mixr. I really wanted to push myself with this website design. Typically, I enjoy making bright, white sites, and wanted to step away from that for this project. Additionally, I think the menu bar on websites has been the same for a while and as most designs are mobile first, I wanted to explore the idea of putting a mobile menu on a desktop site. The website is colorful and allows the cocktails to stand out and keeps the whole site feeling bright even with the darker background. The site also considers web accessibility standards, looking at color blindness, contrast checking, text size, and more.

Homefinalfinal.png
 

Menu

As there are more and more mobile users, it’s important to design for mobile first. I wanted to take that idea and take mobile features and add it to a desktop site. Here the menu matches a typical mobile menu. I think going into the future this is an idea we will see more within the design space.

Home Menu.png