user's avatar
2012 - Clipper Vacations - Complete Redesign
BACKGROUND
Clipper Vacations had previously performed an Eye Tracking study, and the results of that plus Stakeholder Interviews formed the background for this project.  This project was very collaborative and iterative, with continuous client review cylces that included some live sketching/wireframing in client meetings.  The end result is a site that blends UX best practices, with a pre-packaged booking engine and content management system. 
SITEMAP
One of the foundation elements for this project was an updated Site Map.  As you can see above, content was organized based on its location within the Header/Footer navigation.  This came out of a prioritization exercise and was refined through multiple iterations.
INITIAL SKETCHES
Here we can see several options for a revised site Header, which was the first element to be developed.  A preference exercise was performed with the client to narrow the choices and arrive at a final proposed Header.  This exercise was also performed for the Footer and select content pages.
PAGE SKETCHES
Once the Header and Footer were approved, page-level sketching began.  The process of iterating with the client continued for select pages and templates.  Placing sketches within the context of more refined work helped the cleint envision the overal structure of the page.
HOMEPAGE DEVELOPMENT
Clients often want to see the Homepage before any other, even if it is not necesarily the most important page of the site.  Below is an example of more sketching and near final wireframes of the Homepage.  This provides a good example of increasing levels of detail throughout the lifecycle of the project. You can also see progression in the layout of the Header and Footer, which continued throughout the project.
BOOKING ENGINE
The Clipper Vacations website was comprised of a CMS-driven marketing site and a 3rd Party Commerce Engine that specialized in Ferry/Travel booking.  Unlike the marketing site which was driven by dynamic tempaltes, the Commerce Engine was designed using a series of key workflows/use cases that covered the primary pages and interactions.  This was done so that individual flows could be worked on by the developement team (CE provider) which was based offshore.  Due to the unique nature of this structure the pages in the Booking wireframes include both the Flow and Annotations to assist the developer in understanding how each page works and fits in to the larger whole.
TABLE OF CONTENTS
This is an example of the booking wireframes Table of Contents.  Key findings are included to help ground the project and as reminders for everyone what to evaluate the solution against.  Additions and Deletions for each revisions are marked in the Publishing history to provide an at-a-glance reminder of what has changed.
RESULT
Using sketching as the basis for the project helped speed development and improved client involvement and sign-off.  The client was happy with the solution and our team was always ahead of any project deadlines.  The work, which was completed in a 2 month time period in 2012 stands today (3 years later).
 
 
2012 - Clipper Vacations - Complete Redesign
2
117
0
Published:

2012 - Clipper Vacations - Complete Redesign

A total redesign of Clipper Vacations through multiple iterative rounds of sketching through to annotated wireframes with continuous client invol Read More
2
117
0
Published:
Attribution, Non-commercial, No DerivativesAttribution, Non-commercial, No DerivativesAttribution, Non-commercial, No Derivatives