Archive for the ‘Sketches’ Category

When dealing with problems of usability, I think it’s still relatively easy to rely on experience and be able to predict if a user will be able to manage through a task. Over time, an experienced designer builds up a number of rules, best practices, or guidelines that can help him or her to make an interface more usable (that is, answering the problem of: can people use it).

When dealing with problems of usefulness (that is, answering the problem of: will people actually use it) I think it becomes harder and harder to predict the answer. Problems of usefulness are of a higher complexity and therefore are more difficult to predict and resolve with just experience or guidelines alone. Instead, in order to improve usefulness of a product, the designer has to get scientific, measure, test, experiment and simulate.

Design artifacts such as sketches, wireframes, visual mockups, and prototypes are the essence of what interaction designers use to communicate their work. However, not all deliverables have equal scope. Instead, each deliverable type mentioned covers an area of the design space that is smaller or larger as they represent less or more screens.

From my personal experience I find that sketches (or wireframes) afford the designer to cover the widest possible scope. Sketches can be used to draw up or think through the widest possible design space. Sooner or later more detail is required beyond sketches as one steps into the world of visual design. Here the discussion takes on pixel level details, styles, branding elements, colours and fonts. At this level of detail, however the number of screens that are represented diminish relatively to that of sketches. Only a few selected screen types need to be explored as mockups. Finally, the scope that prototypes cover I find are the smallest. Most of my prototypes test the interactivity or behaviour for a particular page. These are often the closest in detail to the real thing as they often exist in HTML, Javascript form, and live in the browser.

What’s more interesting is that once the scope is broken up and varied across these various types of deliverables, they can begin working together in a hierarchy to serve different goals. Sketches are used to explore the breadth and flow of the interface as they unify the largest numbers of screens with user scenarios or stories. Visual design mockups are used to test the visual style details for a couple of page types. Finally, prototypes are used to test experimental page level interactions and convey the feeling of rich interactivity to get stakeholders excited about a particular concept. Taken together, each deliverable only needs a uniquely defined scope to fulfil its purpose.

Inspired by evolutionary thoughts, variation is one idea that helps to achieve the most optimally fit forms during a design process. All the things we design, be it web sites, toothbrushes or orange squeezers, eventually leave the artificial boundaries of the studio and get in contact with a real environment to stand the test of time. One could argue that the more variety of ideas we have, the higher the chance that the form and context will be properly fit and adapted to each other. On this note, I wonder if we have enough variation in the artifacts we design, or perhaps could we strive for even more? Comparing a design process to what happens in nature, each individual living thing is slightly different. Each person is a little bit taller, has a slightly different face, etc, etc. But if we look more closely on the products we design, variation seems to be tighter and more artificially controlled. If we open up a delivery truck filled with well designed toothbrushes, we can probably identify a thousand individual objects that look exactly the same (something that is less visible in nature). In nature we have form variation within a population (between each individual object), whereas in a design studio we have variation in a more phased approach between each cycle or iteration.

Perhaps what I’m really wondering is if there is room in a design process to inject more variation to all instances of a product. What if each user was exposed to a slightly different product and the best forms trickled up automatically like in evolutionary biology? What if a web site, each time a user visited it, appeared slightly different. Perhaps this is too difficult (costly?) with real physical products which under the forces of industrialization have undergone a shift from highly variant art and craft products toward more standardized forms. In the virtual world of bits and bytes however, the cost of bringing back variety should be theoretically lower.

This is not to say that there already aren’t variation causing process. The popularity of sketching in design already is an approach which thrives on the multitude of ideas. Design studios also make use of A/B Testing, which is another sign that people are seeing the value of taking variety and experimentation into the real world. Nonetheless, this all makes me wonder what an automated method for A/B/C/D/E/F/G/H/.. testing would look like where every item produced is unique and thus more open to the laws of adaptation and survival of the fittest.

Sustainability, or the idea of zero waste and reuse of things created (concepts & code), also applies to the world of user interface prototyping. On one hand, there might be a push to build prototypes of such quality that the code that they rest on could be reused further in the development process. This so called “sustainability across a process” is just one approach of how UI waste can be reduced. Another way of building sustainable prototypes is by reusing elements from project to project. So if on one project a widget was used in a prototype, and then the same code is used on another project, it would be a sustainable act as well. This I’ll call “sustainability across projects”.

The truth is that at times there is more value of building “throw away” prototypes that are not of production ready quality. Building something quickly without regard for code quality, learning a lot from it, and then correcting the design direction could be more fruitful than building “high quality” prototypes whose code makes it into the future. However, in order to support sustainable or reusable prototype elements across projects, of course we need the right tools and setup. The idea of relying on emergent patterns is a sustainable across projects concept which EightShapes has been supporting with their unify framework, but also something I potentially want to implement for fluidia.

Thinking a bit about the generation of alternatives during conceptualization, it becomes apparent that a design process also has form. More specifically, here are at least two contrasting sketches on a structured and organic design process which contains an exploratory aspect. Explorations or alternations can happen in a very structured manner (3 concepts every 2 weeks, etc.), or they can happen in a more natural way (the designer generates alternative concepts as they emerge). I’m not sure which one is better. I do get a feeling though that my work is reflective more of the latter one.

The life of a prototype can vary. On one hand the time before a prototype expires and is thrown away can be very short like in wizard of oz paper prototyping. In this case the prototype also usually requires a great deal of hand holding and filling in the blanks. It requires someone to be present to breath life into it for the user to experience it during evaluation. In some way, the presence of the evaluator and short life makes such an evaluation more sterile or artificial.

On another hand, prototypes can also live longer on their own and be self-sustaining. These types of projects are visible in such things as labs prototypes which over the last few years have become quite popular. Such prototypes are very much close to finished products, yet the people behind them still see them as experiments worthy of being thrown away. More so, they allow the user to experience the prototype during a longer time frame making the evaluation of them closer to reality.

Very much related to the posts on alternatives, here is a quick sketch about one snapshot of what I believe constitutes good design. The sketch underlines the importance of stretching the design space by means of exploring alternatives. The wider the design space, the richer the pool of ideas from which the best can be selected by means of evaluation. (This sketch has been inspired by 90percent of everything, Bill Buxton and evolutionary design.)

Perhaps this is plain obvious, but interfaces are becoming more and more complex. Traditional physical interfaces of products (think lawn mowers and toothbrushes) do not change much as we interact with them. The toothbrush perhaps bends in and out due to pressure, and changes colour with time. Taking a step forward in the direction of screen based interfaces, the complexity of form begins to increase as the possibilities to interact with more and more pages widens. Now with the rise of state based interfaces (provided with AJAX and highly responsive rich internet applications) the complexity of form increases even more as individual elements begin to change around within pages. For me this raises one question. Namely, what is the effect of this rise in complexity on a design process.

As interaction designers or information architects we often envision the right paths for users to take in the form of user flows. In these documents activity is so sterile and perfect. Often these flows are represented as straight lines with clear beginnings and endings, and a high degree of simplification. Perhaps even to some of us it gives a false sense that we are in control.

However in reality, use is very much unpredictable. The activities people take have different lengths, starting, and end points. Activities of people form unpredictable patterns invisible to us during ideation. For me this way of looking at activity raises a question: can we create tools to help us visualize rapidly more complex patterns of real (not intended) user activity?