Interface Design Pattern Levels

by Luke Wroblewski July 23, 2004

As you move from project to project, interface designs begin to reveal patterns on multiple levels. Application, module, and function level patterns provide a great opportunity to leverage past successes and may ultimately allow you to develop a library of proven design solutions. Of course, not all patterns are a perfect fit. Most evolve over time and are best used to jump start the design process.

At the application level, Microsoft has identified a set of archetypes: "something that serves as the model or pattern for other things of the same type.” The Aero User Experience Guidelines briefly outline eight application patterns from document editor applications to information/reference applications that are meant to serve as adaptable guidelines or design inspiration.

Applications consist of modules, and at the module level patterns emerge as common feature sets. Web-based applications from different domains, often share common requirements. For instance, a traffic monitoring application and a personnel management application may both need to message users and provide the ability to review accumulated data. As a result, both of these applications include a message center and a reporting section (module level design solutions).

Function level patterns are widely documented and combine interface elements (input fields, buttons, text, etc.) to enable actions such as Login and Search. Groups of functions form modules. Though higher and lower level patterns may exist (for instance, application suites) function, module, and application level patterns are common enough to provide a substantial return on investment for those who take the time to document and utilize them.