Partner Portal

(with Solution Set)

https://business.americanexpress.com/us/partnersplus

This project for American Express was the creation of a sales “Partner Portal” site. This project was particularly satisfying because it incorporated many dimensions of the Interaction Design documentation.

I started with breaking up the user stories into a Functional Distribution diagram. This provided an illustrated view of the requirements, the components that each requirement touched, and the relationships between it all.

 

 

From here, I created simple definitions of the different user types that might use the system as Personas.

 

 

I then created Process Flows for each of the primary use cases, so I could visualize the connection points between the potential pages, and understand the primary tools necessary in each of these steps.

 

 

The Process Flows provided a page inventory, which then led me to illustrate the relationship between the pages in a Site Map.

 

 

I then created wireframes for each page, defining the interactions, and possible alternate states of the various elements.

 

 

Finally, I defined the way the page elements collapse at different display-width breakpoints, so the page layout and user experience was optimized for both the mobile well as the desktop environments.