Karma Sauce: Ideate and Iterate

Ideate

Ideate

Potential solutions were brainstormed and organized in terms of the carious facets of Karma Sauce’s web presence.

With some practical solutions established, a priority diagram was assembled in order to determine the most urgent tasks to complete before the premiere of Hot Ones.

A quick paper prototype of the new front page was assembled and presented for approval.  

Iterate

Iterate

In addition to an aesthetic makeover, the final mock-up featured some “quality of life” improvements inspired by the data.  This included a home page that acted like a dashboard with pertinent information displayed for the user, and an integrated calendar with inputs for both medical appointments and refill schedules. Basic Panacea Brush functionality was also included in this iteration, allowing users to sync their toothbrush and view their adherence history. 

Old Header

The original header was a simple boxed-row image of various sauce bottles photographed near some plants.  If you look closely, you can see the foliage is a pepper plant, likely from the family farm, but it is difficult to discern. The image is not hyperlinked. The headers title mentions that the site has artisanal sauces and is sourced from the Finger Lakes.  The landing strip is located Immediately below the header image.

New Header

The new header features footage from the entire farm for its video background.  In front of the footage are two transparent chips.  The center chip allows for some additional elaboration of Karma Sauce’s point of view beyond a header title.  The right-hand chip links the user directly to the Extreme Karma product page for express purchase.  

Old Landing

The old landing section features three navigation options; one leading to an about us section, another to a product catalog section, and finally a blog/recipe section.  Each nav option has a tinted hover effect.  The copy beneath welcomes the user and explains the layout of the site in plain black and white.  

New Landing

The new landing section borrows some of the elements from the old version. The size of the center nav menu was expanded in size and given a golden outline to accentuate that option for the user. Above the landing pad is the product carousel.  The right-hand chip, the product carousel, and the accentuated shop button all work towards providing a more immediate and less ambiguous shopping experience for users the minute they view the site. 

Old Bottom Section

The old bottom section is a tag bank for products on the left and for recipes on the right. 

New Bottom Section

The new bottom section is devoted to the many awards that Karma Sauce has accrued.  It was initially designed to have an icon token for each award, but because of the number of awards, it was decided that a ticker would be more appropriate.  Hovering over the ticker will stop its movement, allowing you to click on any individual award to visit that institution’s website.