Emily Havens' Portfolio

A Web professional dedicated to clean design, concise code and fixing the world's grammar

Scripps: Navigation/homepage redesign (July 2011)

When asked to redesign the navigation for Scripps' online newspaper presence, I produced the following designs, which will be used moving forward with this project. I added a more robust sub-navigation area, reworked the main nav bar and inserted a new "Weekly Ad" space. I also added a featured photo/video bar further down in the "blacktop" area as part of another design project, and inserted an email capture field in the featured "deals" area. The current version of this page can be found at courierpress.com.

  • Before

  • After

Redding.com: Game dynamics project (May 2011)

As part of a project integrating gameification strategies with one of Scripps' newspaper properties' websites, I designed an animated notification bar that attaches itself to the bottom of a user's browser window and displays point totals, suggestions for ways to earn points and alerts of additional points or badges earned.

  • Notification bar, closed and idle

  • Notification bar, closed and with active notification (glows green)

  • Notification bar, with suggestions panel open

Redding.com: "Your Account" page redesign (April 2011)

A redesign of Redding.com's "Your Account" page was in order with the addition of gameification to the site as a whole. Below were my design concepts for adding the "game" feel to this page, as well as incorporating the new related elements in a right-side navigation.

  • Redesign of Your Account page/navigation

  • Hand-designed icons created for Your Account page

Scripps: New ad positions (May 2011)

Commissioned to find a place on the Scripps' newspaper websites for a new "Weekly Ad" slot for major retailers, I crafted a floating 189x32px block between the search field and navigation bar, as well as incorporating the ad into the right end of the navigation bar, a la The Chicago Tribune.

  • Floating Walmart ad

  • Two iterations of the navigation-based Walmart ad, one with just the Walmart "starbust" and one with the whole logo

  • The chosen version of the nav-based Walmart ad, shown on the Commercial Appeal homepage

Scripps: Insightful comments (March 2011)

To improve comments on Scripps' newspaper property websites, we were asked to add the technology and design required to mark a user's comment as "insightful." This was my design mockup to accomplish this in the comments area.

  • With the addition of an "Insightful" lightbulb, as well as new icons for replying to comments and suggesting removal, we achieve a more visual and user-friendly design in the comments area.

Knoxville.com: Movie listings (February 2011)

I was asked to redesign the movie listings page on knoxville.com and created a new top-tier bucket that filters movies by title, theater and rating (G, PG, etc.) rather than the drop-downs of all theaters and current titles that exists today.

  • Movies listed by title

  • Movies listed by theater

  • Movies listed by rating

Knoxville.com: Search redesign (February 2011)

I was asked to design a new search results page for knoxville.com and so went with a Google-inspired filtering list on the left side of the page, as well as a newly arranged set of results for images and videos, which is not supported in the current search results page.

  • Redesigned search results page

  • Hand-designed camera element used in search results redesign

Scripps/Monster: Monster Match (June 2011)

I was asked to create a "Monster Match" element for Scripps' Monster-based jobs pages across its newspaper properties. Below are two iterations I came up with.

  • Final Monster Match design

  • Second iteration containing the recognizable Monster mascot

Scripps: iPhone/iPad/iTunes icons for e-editions (May 2011)

I created a set of iPhone/iPad/iTunes icons for 13 Scripps newspapers' e-edition apps available in the iTunes Store. The sample below is for the Indian River Press Journal.

  • Indian River Press Journal iTunes icon (click to see pre- and post- glossification)

Ducks Unlimited: Email design (examples from 2010)

From 2008 to 2010, I was the main designer and coder behind all of Ducks Unlimited's email marketing efforts. Below are some examples from my last year on staff with DU.

  • Email promoting DU's new iPhone application hitting the iTunes Store

  • A call-to-action email regarding a massive Mississippi River cleanup effort

  • Promotional email about voting in DU's special video contest

  • An educational/instructional email about wood ducks and how to build nest boxes for them

Ducks Unlimited: E-newsletter design (examples from 2010)

From 2008 to 2010, I was also the main designer and coder behind all of Ducks Unlimited's email newsletters. Below are some examples of DU's monthly e-newsletter.

Additional work is available on the DU website. Right-click and select "View Source" on any of these pages to see the HTML and CSS behind the emails. Please note that all CSS is in-line due to the nature of email providers and their inconsistency in handling separate stylesheets and embeds.

  • December 2010 DU E-Newsletter, with the majority of graphics created by me in Photoshop

  • March 2010 DU E-Newsletter

  • September 2010 DU E-Newsletter

Ducks Unlimited: House ads (October 2010)

When the DU Web Services team undertook the task of redesigning DU's website in 2010, several new ad slots were introduced to increase online revenue. Below are three examples of 300x100px house ads I designed in Photoshop to fill these spaces until sponsor ads could be sold. These three remain in circulation on the site today.

  • Ad promoting DU's Migration Map using graphical elements (bird overlays) from the map, as well as the green map color scheme, to drive traffic to this special feature page on the site.

  • Advertisement for DU's Waterfowler's Bag, an item available in DU's online store for a donation to the cause of wetlands and waterfowl conservation.

  • Ad promoting DU's online photo gallery, a very popular resource and hang-out for waterfowl hunters online, where they can share images of their hunting trips, waterfowl in the air and their friends and family.