Goal

The wholesale division of Qwest Communications (which has since become CenturyLink) needed to create a web application to modernize a complex paper/fax-based industry standard process that other companies, such as smaller local telecom companies, wireless carriers, etc, use to order backend network services, such as fiber optic capacity between two endpoints.

Approach

Because this project was based on a very complex industry standard ordering process, with lots of arcane acronyms and rules, I realized that gaining a deep understanding of the process would be critical to designing as simple and elegant a solution as possible.

I studied the industry standard documentation (based on paper forms), and user guides for the web applications other companies had created for the same purpose. These other applications struck me as very confusing because they disregarded the structure laid out in the industry documentation.

Results

I decided to treat the structure of the legacy paper forms as an asset rather than an encumbrance, and designed a user interface that closely matched the structure of the paper forms, making it easy for users to see how the industry standard documentation applied to the web application.

You can see examples of the user interface in the user guide (e.g., on page 30). Note:

• The diagram at the top which represents the set of forms, their order (ASR, Multi-EC, Transport, ACI), and which ones have multiple instances of them (ACI).
• The flagging of forms and sections with errors using both red color and a » character, for accessibility to color-blind users.
• The form itself is divided into horizontal sections that correspond to lines of the legacy paper forms, and wrap to fit the browser window width.

Throughout the project, I engaged deeply in technical discussions with both the software development team and the resident expert on the industry standards, to ensure I could design to accommodate all the many technical issues and requirements, while constantly advocating for the needs of end users.

I prototyped the design in HTML and CSS, mainly because it was critical to demonstrate to the team how my design adapted to different browser widths, taking advantage of however wide a window a user might want to use, while adapting to narrower windows in a way that retained a clear correspondence between the on-screen layout and the paper forms described in the industry standard documentation.

Impact

My efforts to create an intuitive application for an inherently complex process were successful enough to inspire a user from Cingular Wireless to submit the following unsolicited comment:

“I just wanted to leave a note to say that your QORA system is by far better than any of the other systems for ordering, that I have used. It is very very user friendly. Thanks for making my job easier!”