Interaction Patterns

Establish Guidelines and a Common Nomenclature to Describe Interaction Patterns


Establishing a set or library of interactive patterns involves several important practices. The first order of business is establishing a basic set of web guidelines.

 

Solving the Hierarchy Problem – Exhibit A

Problem: In the FNB commercial card environment, companies can be set up with in an infinite number of Account Groups and sub groups within those Account Groups. Under those account groups, there are a possible infinite number of Account Holders. Think of organizational structure such as a university; there are various colleges (account groups), departments within those colleges (account sub-groups), students, instructors, administrators, etc. (account holders). Creating a hierarchy that was compact and modular was essential. The ability to accommodate a small commercial card business as well as a complex business with multiple groups and account holders with the same interface was the challenge.

Avoid the “nested tree” – while in some circumstances, this may be an appropriate solution, but when it comes to multiple and possibly infinite hierarchy, the nested-tree could become visually complicated and confusing.

Solution: Allow users to easily select desired main group, sub group and specific business from an Business Type Selector widget. The goal was to accommodate a small, medium, large. and x-large insurable business class environments with a single, intuitive interface.


Multi-Step Process Form

View online preview


The “Additional Details” Use Case Scenario – Exhibit B

Scenario: There is a business case that requires further explanation based on the user’s response. Depending on how the user responds to a yes/no question, then he or she may need to provide more explanatory details.

Solution: Provide a pattern that accommodates the business need for additional details.

Presenting Table Data