Friday, March 7, 2008

Introduction

This blog contains several examples of my User Experience Design work from the past few years. You'll see examples from my work at Adobe Systems and Yahoo! Personals. Thanks for stopping by!

Thursday, March 6, 2008

Yahoo! Personals Signed In Home Page (old)


This is a screen shot of the Y!P Signed In Home Page as it looked when I started at Yahoo! The design hadn't been updated in four years.

Labels:

Y!P Signed In Home Page (new)


Here's the new and improved Signed In Home Page implemented under my direction. It has a completely updated color palette, wide page format, 'one-click matching', and a new carousel interaction for browsing profiles. The underlying design principle was to bring important and popular functionality closer to the user (i.e. things that had been buried in the site and were therefore difficult for users to find were now surfaced on the home page).

Labels:

Y!P Search Results Gallery View


This is an example of the Gallery View. It allows users to see as many as 10 profiles without scrolling. The profiles are also highlighted with items used as filtering categories: We Match and New.

Labels:

Y!P Search Results


This example shows a Search Results page with Profiles in the default view. Prior to the new design changes this page showed search results/profiles with a horizontal orientation. Therefore, the user would usually only see two profiles above the page fold. The new design allows the user to see four profiles without scrolling. The updated profile display format is also easier for users to scan.

Y!P Profile Details


This is the updated Profile Details Page. A user gets to this page by clicking on a Profile from Search Results.

Y!P Tell Me About


"Tell Me About" is a feature that was recently implemented on the site. It helps users start conversations with other users.

Y!P Photo Features


Photos are a very important feature of an online-dating site. Profiles with one or more photos are far more likely to be successful than those without. However, users had problems uploading photos using the old site design. Therefore, the upload experience was improved. The number of photos a user can upload for their profile was also expanded and users can now add captions to their photos. Captions are searchable as well.

Y! P Content (1)



The content area of the Y! Personals site had also not been updated in several years. Yet, the content area was a heavily trafficked area of the site. The content area was updated last year with a completely new look and feel as well as an updated Navigation design. The navigation design that was used was based on a common User Interface model used by several different Yahoo! properties including the Y! Food site.

Y!P Content (2)


This is an example of a second level page on the Content area of the Y! Personals site.

Adobe Acrobat Pop-Up Notes Evolution

The design of the Acrobat Pop-Up Notes (used with the Commenting feature) needed some major work. Here's an example of the Acrobat 5 pop-up note. It was basically just a note on a page. There was no special functionality in the note.




In Acrobat 6, the Pop-up Notes were updated with new functionality and a new look and feel. (see example below). Users could now take advantage of a Commenting tab that allowed them to manage all of the comments associated with a document.



In Acrobat 7, the Commenting features including the Pop-up Notes were further refined. (see example below).








Update Concept for Adobe Acrobat Pop-Up Notes

This is an example of the way that Acrobat's Pop-Up notes could further be refined and improved both from a visual design aspect as well as an interaction design aspect.







Adobe Acrobat UX Design

From Tools to Tasks






acrobat 5 toolbar
(based on Adobe's Creative Pro Tools Based interaction model)





acrobat 6 toolbar
(based on the new "From Tools to Tasks" interaction model)