Chris Schiotis

Design Portfolio

Brunello Trattoria - Website Redesign


Mock-up of Brunello Trattoria Web Site

This mock-up shows the large and small screen sizes of the newly launched website.

Pictured below are some screen shots from the fixed width site we did in 2008.

(Just to show you where we started...)

Screen shot of old Brunello home pageThe old Brunello home page.
Screen shot of old Brunello menu pageThe old Brunello catering menu page.
Screen shot of old Brunello about pageThe old Brunello about page.
Home page pic of Brunello Trattoria's front view - photo by Chris Schiotis

The objectives that were prioritized in this re-build/re-design were born of neccessity. Involving the business owner in the design and development might sound like too many cooks in the kitchen, but it can be an effective way of insuring that the business owner’s vision is reached.

It was not difficult... the client/business owner defered to my direction where all of the technical and most of the design problems were concerned.

Home page pic of Brunello Trattoria's front view - photo by Chris Schiotis

The very recognizable font Papyrus being used in the logo on the header of the new web site is also used on external signage as well as menus and other collaterals.

Readability is our primary concern where other font choices were made. Smaller screens are prevalently used for browsing and so a sans-serif choice was the obvious one to make.

Home page pic of Brunello Trattoria's front view - photo by Chris Schiotis

Color palette decisions were guided by the interior of the restaurant. Choosing this direction helped to achieve unity between the digital and physical entities while also ensuring visual harmony.

The Color Palette

Screen shot of new Brunello home page The new Brunello home page.

In the interest of the second objective, (making the site responsive) we chose not to do what we did for the one of the other restaurant websites; that is to use Bootstrap. We elected not to use it so as to minimize the use of Javascript, but I personally find it to be somewhat confining from a design standpoint. CSS3 facilitates the responsive approach with the (now minor) draw back of limited browser support, primarily with older browsers.

Screen shot of new Brunello menu page The new Brunello catering menu page.

At this point the only Javascript being used is for page scrolling and modernizer to keep the site working in some older browsers. Statistics are readily available for browsers used; browser usage statistics 2017. With these stats in mind, in doesn't make much sense to incur additional development costs in order to provide service for a browser that is only being used .007% of the time.

Screen shot of new Brunello about page The new Brunello about page.

The external content incorporated is a QTVR that was created by Dragi Popovski. Ownership chose this under the direction of their marketing team. This team also manages social media and advertising. Adding an element of engaging interactivity that provides users an 'inside' look at the dining room is a truly ideal implementation of this technology.

Try it here.


Updating content and implementing third party vendor code is a complex way of saying data entry in this particular case. Open Table provides a table reservation service that is fairly ubiquitous in the restaurant industry at this date.

In addition to data entry, my role(s), tasks and responsibilities were:

go to the top of the page