For every web based application that I have ever worked on there has been a set of administration functions involved. Administrators need to manage users, or manage organisations etc in the system. They need to be able to add, edit, remove, lock and find these users or organisations.

These tasks and functions are not unique to each system (in terms of high level process flows) and each time they are needed I end up using the same design pattern. I thought I would share it here in case it will be useful to anyone else who has to develop screens and process flows for the same functionality, I call it the “FAVE pattern” - Find, Add, View, Edit.

To explain it, let’s take the example of administrating a system’s users. As an administrator I want to do one of two things to look after my users; add new users or edit existing user’s details and settings (note that I include actions such as “disable users”, “remove users” etc in with other “edit user” actions, so I don’t have a separate process for these things). In order to edit a user, I need to first find the user and then view their current details to confirm that they need updating.

The FAVE pattern allows me to do all of these four things; Find, Add, View, Edit.

The Information Architecture diagram in Figure 1 shows how these four pieces fit together.

(For more information about Information Architecture diagrams see Documenting the design of a web application -Part one: Using Garrett’s Visual Vocabulary to document the Information Architecture)

The “homepage” of the User management area (screen 23) is the search screen, from where our administrator can either search for existing users or add a new one. Once they have run a search, our administrator can click on the user they were after and view their profile / settings. From this view screen (23b) our administrator can access the edit user screen (23c). Once they have edited the user’s profile and settings, they are returned to the view screen and shown a confirmation message, listing what they changed.

The same goes for the add user screen (23a); once our administrator has entered all the required information and they click “Save” (or “Add”) the view screen for the new user is displayed with a confirmation message.

As mentioned at the start of this article, this pattern can be used for most administration areas of a system, whether you are managing Users, Organisations, Interest groups, or anything else. For the system that I’m working on at ProcServe I’ve so far used this pattern to build the User, Organisation and Marketplace management administration areas.