The Structure Behind Your User Interface :: UXmatters

Strategy and Structure

A well-thought-out design strategy provides a sound foundation for any user interface, as well as the structure of its underlying information environment. Strategy considers the objectives, experience architecture, and infrastructure for a particular user interface.

Information architecture’s interest in structure runs wide and deep, and that is why it is hard to separate an environment’s structural concerns from broad, strategic factors such as business objectives, user insights, and technology. Thus, it’s not uncommon for information-architecture professionals to extend their ambitions to assuming a Lead UX Architect role.

When IA practitioners take on a UX Architect role, their creative tendency often elevates structure to the aesthetic of user engagement. While a visual design–focused UX Architect might recommend a simple, elegant search box for executing a query; an information-architecture analyst might rationalize the need for a faceted user interface that gives users more control over the scope of search results—thus providing a better user experience.

Of course, the metadata scheme that powers such a faceted-search feature contributes to a Web site’s or application’s structure. This faceted-search capability could have been for the exclusive use of the search-platform team and content authors. However, using faceted search in the user interface elevates structure to a UX-design concern and makes faceted search part of the overall user experience. Airline and travel Web sites commonly take this approach, as shown in Figure 1.

Figure 1—Site structure and faceted search in the user interface
Site structure and faceted search in the user interface

How to Visualize Site Structure

When I say structure, I mean an aggregate of the conceptual and content relationships that are inherent parts of an information environment. The conceptual aspects of a structure include intent and the definitions of things. Content includes objects, text, images, and other forms of digital media. In more sophisticated technology environments, conceptual and content relationships have parity with their respective data structures—for example, a relational data model.

To make it easier for you to take all of this in, let me paint a picture in Figure 2. We can view the structure of a user interface as the core frame that supports its design—similar to the load-bearing beams of an office tower. In many cases, it’s hard to appreciate the structure unless you strip away the design elements.

Figure 2—Visualization of how structure supports user-interface design
Visualization of how structure supports user-interface design

In Figure 2, I’ve removed parts of the user interface—the elements with which users engage—so you can see the structure. As for a building, structure underlies and supports user behaviors that occur at the surface—in this case, of a user interface—while anchoring a site design to its conceptual and physical foundations. [4][5][6] A lack of such connections to concepts, content, and data compromises the integrity of the user-interface design, as well as other aspects of the site—such as its infrastructure and operational dependencies.

Structural and strategic gaps ultimately impede growth, complicate the sharing of content and data across disparate domains, and prevent organizations from achieving their business objectives in any sustainable way.

In Closing

According the Information Architecture Institute, the practice of information architecture concerns “the structural design of shared information environments.” And, after two decades of explosive growth in Web communications, structure is still the sole remit of the practice of information architecture. While the skills of many IA analysts and practitioners are, at present, greatly underutilized, I expect this to change as organizations confront the challenges that large-scale, digital ecosystems present.

Regardless of recent user-interface design trends whose intent is to get digital interfaces to market more quickly, we must not take the need for a strategic foundation or the structure that underlies a user interface lightly.

The strategic foundation of a user interface is a dense mix of requirements and assumptions that may span a wide array of concerns—from business and user objectives to content, design-system libraries, and technical infrastructure.

When we practice information architecture to its fullest, we assume responsibility for engineering the structure of an information environment or ecosystem, as well as its respective user interfaces. Thus, we maintain the rationale we’ve modeled—whether static or integrated [7]—and ensure each design solution connects to a solid foundation of concepts, content, and data.

In the most complex environments, the key benefit of a well-thought-out, underlying structure is a flexible, sustainable, and scalable information environment that satisfies the intent of its owners, as well as the needs of its users. 


[1] Rosenfeld, Louis, and Peter Morville. Information Architecture: For the Web and Beyond. Sebastopol, CA: O’Reilly Media, Inc., 1998.

[2] Krug, Steve. Don’t Make Me Think! A Common Sense Approach to Web Usability. Berkeley, CA: New Riders, 2006.

[3] Garrett, Jesse James. The Elements of User Experience: User-Centered Design for the Web and Beyond. Berkeley, CA: New Riders, 2011.

[4] My official definition on the DSIA Research Initiative site states that site structure is: “The coherent order and relations between physical and abstract constructs in support of a communicated design.”

[5] Davis, Nathaniel. “Getting Your Web Site’s Structure Right.” UXmatters, April 22, 2013. Retrieved February 4, 2017.

[6] Jorge Arango expresses a similar perspective in his blog post, “…for the World Wide Web,” in which he postulates that information-architecture practice exclusively concerns “the structural integrity of meaning across context.”

[7] The term static models refers to traditional diagrams, while integrated models have a programmatic connection to a Web site’s back-end architecture.

Source link

Leave a Reply

Your email address will not be published.