By Aaron Gustafson CHAPTER 7section headers will fit horizontally when rendered as tabs. If they fit, the
script can proceed and build out the rest of the interface. If not, the script
can stop where it is and leave the linear content as it is. This test could even
be a live check (using a function like watchResize) that triggers the con-
struction and destruction of the interface components as the browser size
or device orientation changes.
Again, by putting ourselves in our users’ shoes, we can discover that
there are many meaningful ways to interact with our content. And placing
those in a continuum can create an impressive adaptive interface.
Building Blocks
Despite how daunting they may seem at first blush, complex problems can
always be broken down into simpler ones. The same is true of complex
Web pages and complex interfaces.
It’s easy for me to get overwhelmed when first presented with an elab-
orate interface. When I begin to pick it apart into smaller page components
and discrete interactions, however, I begin to breathe a little easier.
Components are great because they can be built and tested individu-
ally, yet can be combined in myriad ways to meet the challenges of even
the most complicated of interface requirements. Often teams will organize
these components (or design patterns) into catalogs called pattern libraries.
Each component in a pattern library exists in isolation, with its own
requirements, capabilities and documentation. This allows it to be iterated
without affecting other UI elements in use on a website or across a family
of Web properties.
For me, the starting point for any adaptive component is the UI con-
struction flow I’ve mentioned a few times. Most are simple sketches on a
sheet of paper or a whiteboard that illustrate the different content states
and under what circumstances changes in the presentation or interaction
method occur.