Summary: Containership is a useful interaction design technique that can help you direct your user’s attention and shape their experience by giving them visual boundaries. Containership indicates a separation of controls or navigation in an activity space so users know there is a control and it lives in relationship to that section or sub-section of your site or app.
The deliberate use of containership can improve your user experience. It can give users intuitive cues either visually or through proximity and hierarchy.
What is “containership”?
Containership is a visual grouping technique that shows spatial relationship of similar items or actions. Visually shaded areas contain the icon, information, or action a user is expected to perform.
Think of containership as the curbside of a road (the curb contains the road) or the edging of a garden (the edging contains the flowers).
When you provide deliberate demarcation of a screen area, you signal relationship and hierarchy. For example, a top navigation bar is contained in the “bar” meaning actions there help users navigate globally, or across the website or application.
Containership is so important because we use it in our daily interactions to sense boundaries and relationships of objects to actions. For instance, some people do not feel comfortable writing on a sheet of paper that does not contain lines. In this case, the need for the lines offers a container of height to guide handwritten characters. Or it could be the influence of an over-bearing third-grade teacher or both!
On a website or software application, containership is crucial– the user experience can not live without it.
What does containership look like?
Typically a line that separates or boxes-in controls or tools. Shading and color can also indicate a “container”.
Design containers are subtle but they are vehicles of task-oriented design. Good Information Architects specify containers of objects and actions, giving users confidence where to click and an idea of which controls relate to actions on the page. Good designers sense natural boundaries and instinctively group by proximity and relevancy.
Containership is everywhere, but most of the time it’s used unconsciously without deliberate awareness.
How is containership useful?
Containership can help:
1. Users know intuitively which controls go together.
2. Guide a user to an area of a page or screen that requires task focus.
3. Provide a visually unifying effect, while strategically demarcating important actions or options.
4. Signal priority of key areas of the screen or interface.
5. Signify relationship of global (site wide) vs. local (page wide) navigation.
Providing good containership means providing clear demarcation as to which controls go together. The more deliberate you are about this the more intuitive your user interface layout will be!
Best wishes,
Frank
Frank Spillers, MS
