OVERVIEW

Brought on half-way through the project, I had 5 weeks to figure out a powerful but intuitive design that would allow the client to easily create effective, informative and personalized business assessment tools for their customers.

CHALLENGEs

  • tight 5-week time frame

  • because I came in halfway through, I had not been directly exposed to information gathered in the Discovery Phase

  • I was the primary designer and creator

  • learning Axure in-situ

  • the clickable prototype included implementation of relatively complex logical processes and multi-layered hierarchical structures

MY ROLE

I was the main designer for the structure, UI and deliverables (wireframe and clickable prototype).  I worked in tandem with an experienced Art Director.


scoping global navigation and project details

final wire of project definition page

final wire of project definition page

distinguishing multiple projects and tracks

final wire - adding tracks

final wire - adding tracks

secondary navigation: adding questions

secondary navigation: questions wire

secondary navigation: questions wire

Developing 'Questions' config sketch

Results layout sketch

Flexible grading system sketch

Suggestions page sketch

customizable results wire

customizable results wire

'Are you Done?' project overview and download

project completion and download wire

project completion and download wire


Final wireframe walkthrough

 


Though I came in half-way through the project, I quickly caught up through stakeholder interviews and working with a Senior Art Director.

The high-level information architecture had already begun taking shape.  My main goal was to tease out the most effective structure, hierarchy, flow and proper prioritization of the content.

One of the most important considerations was that the user in this instance, was also the client.  I had opportunity to meet with the clients, which greatly helped me construct the appropriate flow.  I began designing a template-like self-evaluation system that would be offered as a service to a variety of businesses and divisions, so needed to be a fluid experience, yet thoroughly robust.

The wireframe development helped me get a sense for the necessary elements that would tie the creation together.  Throwing it all into Axure, I was able to refine the process flow as I built out the information architecture and site map logic for the UI.

Implementing persistent, hierarchical navigation menus, I began to create a flow for the user that would allow them to easily follow the process for creating individualized tests for their clients.

The final clickable prototype showcased an amazing spectrum of customizability, including functional mathematical coordinates, various collapsible accordion options, and a master slide-in menu for easy universal navigation.  I also built a replication of the mockup, allowing the user to preview their creation at any time.

**Update - I recently discovered the project won an IBM award for most innovative marketing product.
 


TAKEAWAYS

This project offered me a great opportunity to dive in and untangle some rich levels of complexity, all while learning the intricate and logical language of Axure.

Upon completion, I had:

  • developed a practical and empowering information architecture presented in wireframe format
  • refined a relatively complicated hierarchical navigational flow suited to the technical savvy of the users that effectively led a user through the steps to completing a powerful project
  • acquired a fluency with the complex logic processes and functions of Axure
  • effectively solidified a complex, abstract system of requirements into a final intuitive user interface
  • offer a final product that met with universal praise from a very high-level client

If I had more time, I would:

  • Continue to refine the UI and simplify the presentation of the main offerings
  • Finish the full interactive clickability of the prototype in Axure
  • Expand and build out the mockup presentation of the completed project
  • Create the actual final visual mockup of the project itself