Soup Surreal Website Redesign

FALL 2019

Soup Surreal is a local restaurant in Stratford, ON that specializes in soups and salads. The task was to redesign their outdated website.

Created with HTML & CSS. Mockup from rawpixels.com

Collaborators

Serena Patel

JiaJia Kong

Cindy Quach

The Problem

The main areas of concern that our team agreed upon with Soup Surreal’s current website included low-quality images, an sensory overload of information and a lack of organization. Customers looking for the menu would have to scroll through walls of text to read the available soups.

Our Goals

Our team wanted to maintain the homey feel of the mom-and-pop restaurant while incorporating modern aspects to the website, to reflect the spunky nature of the up-and-coming town of Stratford. We also wanted to webpage to be easy to navigate and efficient for looking up details relating to the restaurant.

The Process

Site Map

We created a site map to flesh out the best way information from the existing website would be relayed in an organized and accessible manner.

Prototype (Lo-Fi)

Using the site map as a basis, we began wireframing each one of the new pages, consolidating information across the website. We wanted information to be easy to view, and as accessible as possible, using the least amount of clicks to get from one page to another.

Prototype (Hi-Fi)

We changed the typography from serif to sans-serif to make the typography less stuffy, brightened and saturated the colour palette, replaced the low-resolution photos with beautiful photos of items from their menu, designed a new logo, used many calls to action, and only incorporated relevant content onto the website. The final website also is responsive for use on mobile devices. The final prototype was fleshed out in Figma, Adobe Photoshop, and coded using HTML & CSS.