home | resume | contact


Portfolio / wineBuzz




Design Challenge

Create a transactional web site that recommends wine to novice wine drinkers. Explore ease of use, branding, and design language.


The name wineBuzz.com and the tagline, "Get the hottest buzz on the coolest wines" were created to give the site a fun and approachable feel. A light and irreverent greeting adds a sense of playfulness and also informs the user that the site acknowledges the efforts they have made in developing their wine rack.

The search criteria is divided by type of wine. The White, Red, and Bubbly tabs contain sliders to adjust for user's taste qualities and preferred price range. In addition, the sliders act as an educational tool, providing users with a sampling of wine vocabulary used to describe wine. A keyword field provides an easy way to find a specific wine for the user who knows what they want and is looking for a quick transaction.

Front and center on the home page, the user can search for wines based on a specific occaision. The large images add to the core personality of the site by associating social situations with a wine experience. Images were chosen to match the themes developed in the moodboard portion of the design.

The goal for this site was to drive all user visits to interact with the "wine rack." Users needed a tool that would help them track their explorations with wine. The ability to rate the wines in the wine rack supports the users' need to remember what they liked best and also serves as a mechanism for learning users' likes and dislikes. This information helps to tailor future recommendations based on user preferences.

Articles on wine supports wine novices but providing information to support users as their palettes grow more sophisicated. The articles also support the next step for users, adding what they just read about to their wine racks.

Research Methods

Design Methods



  • Directed Storytelling
  • Brick and Mortar studies
  • Competitive Analysis
  • Mood Board
  • Card Sorting
  • Interaction Flow Diagrams
  • Dreamweaver MX
  • Photoshop

Project Web Site

home | resume | contact