Madeline Salocks

Web Development for Wells Fargo Bank Wholesale Interactive Services

While working for the Wholesale Interactive Services department at Wells Fargo Bank, I developed numerous preliminary prototypes and the final prototype for usability research sessions. In addition I explored/developed web-based solutions for presentation of wireframes or other design images for internal review.

User Research Preliminary Prototypes | User Research Final Prototype | Design Review Prototypes | Prototype Tool Evaluation

User Research Preliminary Prototypes

Prior to the final designed prototype, I developed over 20 preliminary prototypes for user research testing. The purpose of the preliminary prototyping was to 1. build a set of reference pages containing interactive elements (in various combinations) that were likely to be used in future actual usability testing prototypes, and 2. provide working tests to help designers in determining the best design directions. Requirements were informal, fluid, and varied in terms of level of specificity.

Interactive aspects included: navigation placement and style/behavior (top vs left, overlay vs expandable push down, expandable categories vs all visible, all levels of navigation menu in 1 container vs split into more than 1 container, activation on click vs hover, standard scrolling vs arrow scrolling, sliding vs fade-in animation); panel behavior (collapsible, flippable, draggable within a grid or not and contained to an area or not); expandable footer bar style/behavior (animating sideways vs up); 'more info' dialog box styles (modal overlay vs draggable popup vs main content area overlay); and dynamic sortable tabs (with or without a fixed home tab).


User Research Final Prototype

Following the designer's Fireworks mockup, developed the prototype for usability testing as part of the research phase determining requirements for the new version of the Commercial Electronic Office website. This prototype was intended to have a wireframe look since visual design research (colors, logos, etc.) was not included in this round of research tests, and it included interactive elements only in areas pertaining to the particular questions posed and scenarios discussed during the user interviews.

Features included in the prototype:

  • Link targets opening in either dynamic tabs on the home page (some in new tabs, and others overlaying already open tabs where functionality was related), new (child) windows, or the same window (overlay)
  • Mega menus
  • Drop down search box and other boxes connected visually to the menu bar
  • Toolbar in secondary pages similar to menu bar on home page with global menu items
  • Tooltips
  • Carousel of information for various support personnel
  • Help modal dialog

User Research Prototype (screenshot)

(Note that the actual prototype was much 'richer' in appearance, including numerous Wells Fargo screens and graphic elements, and other interactivity. This version has been modified/abbreviated to give an approximate idea of the project while avoiding the display of Wells Fargo customer-specific proprietary content.)

Design Review Prototypes

Developed web-based prototypes for displaying groups of wireframes and other design images for internal review. These prototypes were intended to help serve as starting points for discussing requirements for future development of a full-scale internal review application. Requirements were general: present a few different slide-show options where images can be grouped and comments can be entered.


In addition, explored WordPress solutions for design review.

Prototype Tool Evaluation

Evaluated the Justinmind prototyping tool.

(Text and images have been replaced with generic placeholders which are in no way associated with or representative of actual Wells Fargo content.)

↑ top