A bar and restaurant that opened its doors in August 2017, The Beverly Lounge is located in an area rich in history that dates back to the early 1930’s.

After its debut, owner Trippy Thompson quickly gained traction with the local community but didn’t yet have an online presence to support his business. He came to us looking for a clean, minimal user experience that had a special focus on his popular event space and eclectic menu. He also made mention of being drawn to graphic design from the 1930’s.

  • Launched

    April 2018

  • Industry

    Food & Drink

Beverly Desktop
Beverly Tablet
Beverly Mobile

"Working with Tilt Shift was a pleasure. They took time to understand who we were as a business and translated that directly to the overall look and feel of the site. They have a really good grasp of what information is most important to the viewing public."

Trippy Thompson, Owner, The Beverly Lounge

User Experience

Though the user experience was pretty straight forward, we made sure to emphasize two main points:

Highlighting The Beverly Lounge’s Events

The Beverly’s event space was newly renovated and is frequently used. We made sure to highlight all upcoming events on an easy to find event listing page as well as displaying a featured event on the homepage to grab the user’s attention.

Effective Mobile Experience

As with all food & drink services, we believe it is essential to highlight a few key points of interest on mobile for users as soon as they arrive on the homepage. This includes the ability to view the kitchen menu, where the restaurant is located and when the restaurant is open for patrons.

These items are clearly visible on the desktop version of the site as well, but we find it especially important on mobile since, more than likely, a user will be visiting the site in transit while on his or her phone. Having to spend unnecessary time searching for when a restaurant is open, where it is located or what’s on the menu on a phone can be frustrating for a user so we made sure to carefully streamline that experience.

Beverly Events Homepage

Homepage wireframe.

Beverly Mobile Examples

Wireframe for mobile homepage (left). Final design for mobile homepage (right).

Design Strategy

When we begin our design process, we look for key words and ideas from our clients. We take that information and create an “inspiration board” to set the stage for look and feel. From there, we can begin the process of color, typography and layout experimentation.

For The Beverly Lounge, Trippy mentioned a few key ideas:

  1. He took a lot of pride in the restaurant and building history and wanted to emphasis a 1930’s, “vintage” feel.
  2. The architecture of the bar had a lot of interesting textures (specifically dark wood and stainless steel).
  3. The bar is usually dimly lit and has a masculine energy.
  4. A “mossy” green color was a theme throughout the bar.

These ideas were a great starting place and we were able to quickly come up with some interesting concepts.

Beverly Font examples

Playing with different typefaces and combinations.

Beverly Color and Button Examples

Round 1 color palette (left top) and final color palette (left bottom). Button style combinations (right).

Beverly Layout Examples

Playing with lines, background colors/textures and typography combinations.

Beverly Event Layout Example

First draft of featured homepage event.

Beverly Layout Texture Samples

Steel, wood and parchment textures used on the site.

Homepage Enhancements

To further set the tone of the mood and setting of the bar, we highlighted a video background as the main focal point of the homepage. Combined with the elegance of the borders, typography and logo, we made sure that the introduction to the website was memorable.

Beverly Desktop

Homepage video background.

Final Design

We set the mood by incorporating large, dark photography with steel and wood textures throughout the background of the site. The vintage feel was brought in to offset the darker backgrounds in subtle ways:

  • Hints of green in the headings
  • Thin, elegant lines placed in key areas — such as buttons, the video background and menu pricing.
  • An ode to the early 20th century by use of the typeface, Federo (a web-font based on Feder-Grotesk, which was created by Jakob Erbar in 1909. Source.
Beverly Final Layout 1
Beverly Final Layout 2
Beverly Final Layout 3

Various samples of the final design.

Conclusion

The Beverly Lounge is a new business with the challenge of making a name for itself inside the structure of a long-term neighborhood establishment. It was important for its owner to celebrate the history of the original “Kozy Tavern” while redefining the aesthetic of his new endeavor. Integral to this transition was the development of a new website that reflected the new look and feel of the lounge and evoked the owner's passion for quality food and a welcoming atmosphere.

The end result is a high quality website with a design palette customized to capture the owner's vision and the needs of the business. The site is built with a strong focus on customer interaction, easy access to key information and integration with social media platforms.