Working with Noblestar Systems, I was hired to design the interface for a middleware product to be used by customer service representatives in both call centers and bank branches to execute 10 different transaction types on behalf of bank customers. This system would integrate what at the time were several systems, each with their own interface, into one unified system with a single interface.

Challenge

Sovereign Bank was in the process of integrating three separate back end systems use by both call center representatives and branch representatives into a single end-user system. To do this and either maintain or improve the speed and effectiveness of processing requests, the resulting single interface needed to conform and enhance the already highly refined and efficient workflow these users had developed by necessity.

Solution

I spent several days with a set of call center reps and branch reps to as part of a contextual task analysis to understand everything relevant about them, their work, their tools and their motivations. Using this I was able to develop usability goals for the design as well as conceptual models for the transactions that would need to be built. Finally, from all of this, I developed wireframes and visual designs for the each of the tasks.

Result

Upon completion of my phase of the project (the design phase) I was able to provide Noblestar Systems (for whom I was subcontracting), the Middleware Style Guide which, along with some other deliverables, constituted the "bible" from which all engineering work would proceed.

Middleware Style Guide

For this project, a vast cross-section of my deliverables was captured in the Middleware Style Guide. It includes:

  • Contextual Task Analysis - Gathered from five days of on-site evaluations of the two users of the system: Customer Service Representatives and Personal Banking Representatives.
  • Interface Recommendations - 9 high level qualitative recommendations for the ultimate interface.
  • Usability Goals - Metrics (not quantitative, yet measurable) by which to measure the success of the new interface.
  • Conceptual Models - A high level framework for conceptualizing the main transactions of the system in such a way as to make them consistent and predictable from the point of view of users.
  • Design Standards, Style Elements, and Wireframes - The final sections are the final deliverable for my role. Wireframes are represented herein as screenshots the HTML prototypes which I created myself separately.