User Interface Design and Engineering

Working this weekend (we’ll call it Project-A) I noted an informal process I follow when designing workflows/interactions for applications.  This comes after initial research on users, goals, requirements, etc.

Essentially (detailed steps omitted) it boils down to four steps:

1) The big chunks

What are the big chunks/concepts and how do they relate to each other?  For example, Project-A has a dashboard, reporting, system configuration, and object management.  The user is most often expected to start with the dashboard and then drill into problems, but may also go directly to reporting.  The interface needs to support easy and intuitive access to both.

2) The small chunks

What individual components will be needed to build the big chunks?  (a) flat and hierarchical lists, (b) small and large lists, (c) navigation, search, paging, indexing, (d) dialogs, wizards, etc.  It is important that templates are developed for these chunks to promote consistency and conceptual integrity.  Design patterns such as progressive disclosure, overview/detail are considered here because they may require specific components to be implemented.

3) Fitting the chunks together

How can the components be fitted together to create the big chunks and to produce the desired design patterns?  This step usually produces the essence of the workflow but doesn’t really tackle the details or special cases.  For example in Project-A, a dashboard of summary data is used with drill in capability to detailed reports (design patterns: progressive disclosure and overview/detail)

4) Finessing

This step deals with styling and dealing with any special cases.  Graphic design concepts such as visual hierarchy are applied to guide the user visually and emphasize key elements.

The steps are iterative.  For example Step 3 can/will identify additional needed components (Step 2) and in many cases both Step 2 and Step 3 have led me to reconsider the big chunks in Step 1.

I have used this simple process countless times to design software applications.