Gene Lu's Portfolio

V-Nam Cafe

Designer, Developer, Photographer

Design Objective
Disclaimer: this restaurant is owned by my uncle and being the only web designer in the family, I had the privilege of designing and building the site without compensation (yeah, it’s a family thing).

The goal of this project was to visualize the restaurant’s menu online and to get people to salivate as much as possible. On the technical end, the site was to be implemented in WordPress allowing V-Nam Cafe employees to update the menu and to add photos on their own.

My research was mostly based on previous experiences designing for restaurants. According to site analytics mined from those sites, people visiting restaurants are looking for a few things:

  • Pictures of food
  • Main dishes
  • Location
  • Phone number

Since the design objective was straightforward and the research was already there, I went forward with design.

The general concept of the site was for it to be simple and easy to follow. Unlike most restaurant sites, instead of users clicking through individual pages to access different sections of the menu, all the dishes appear on the homepage. Ideally, each dish would have a corresponding photo where users could then navigate through the rest of the photos via lightbox (let the salivating begin!).

Navigating via the JQuery Lightbox Plugin

Navigating via the JQuery Lightbox Plugin

The sections of the menu were organized based on food type and split up into columns. By placing items in a vertical format, users can quickly scan through the list of dishes in that category.

As for type, I used TypeKit (for the first time) and was quite impressed with its flexibilty. Within minutes, I was able to get Museo Slab to beautifully display across the entire site. Go TypeKit!

Vertical format and Museo Slab

Vertical format and Museo Slab

Comments are closed.


  • 22 Nov 2010

Filed Under

Recent Articles

Lead UX Designer on Nike+ Running at R/GA.