Web interaction design with contraints

Constraints aren’t evil. Placing restrictions on what is ´allowed´ will save you time and help achieve your goals faster. Often dictated by the client, they are the restrictions narrowing the scope of the design space. Constraints are welcome in the design process.  They narrow the decision space so you don´t have to worry about every detail.

Take the analogy of looking for a holiday hotel. If you know that you want to go to Europe in the summer at certain dates and within a certain budget, you enter these as filters or options on the hotel booking website. By narrowing down, the selection of hotel options becomes smaller until you have found what you´re looking for. If you make decisions, it is easy to find a solution. Even if you have made the wrong decision, you will know in the end what doesn´t work for you. So making decisions and setting constraints helps.

Constraints are useful when there are too many design possibilities to chose from. In the creative process, the designer narrows the possible designs with knowledge of what is fixed, what works and what won´t work. By making up constraints a process of elimination takes place. Effectively you are limiting the amount of possible design solutions and speeding up working towards a final design. Constraints can mean less time to spend on a design and are considered highly desirable. Set constraints too soon, however, and you might come at a dead end.

If you still don´t understand what contraints are, take this example. You have been given the task of redesigning a webpage with an embedded video player in it. The designer was told to redesign the page (and the elements on it) so that it is more usable. Knowing that only the video player must change, and changing other things on the page is not feasible, this is useful. The designer then knows what to concentrate on, what not to change.  …

Sources of constraints

Constraints at first come from external sources. The source might be a manager’s ‘blue sky’ vision or a client demands perhaps. Constraints are sometimes hard like facts, or flexible like wishes. Constraints are not always set in stone, if it gives you too much trouble you can challenge the one who made it up.

For web interaction designers, the constraints may be:

  • Requirements specification
  • Product definition document
  • the design dimensions (resolution, page space for an element)
  • accessibility
  • technology/technical constraints (dictated by technical feasibility, format or available technical resources and employee skills)
  • SEO related constraints – is it relatively more important to have a flashy player/browser than it is to have a
  • applications of use  –  what will it be used for? …
  • audience – who will it be used for? what are their skills? …
  • Other: Browser/platform compatibility, performance, w3c code validation (javascript), text size
  • Resolution: the order button (or other call-to-action) must be above the fold.

It is often the designer’s task to find out what the constraints are by asking the right questions (to the right people). Finding constraints equals narrowing scope. Make it clear what consequences a constraint has ‘by dicating this requirement, you will get this, and not this’.

When there is a lack of constraints, or a vagueness about them, the designer’s task is made more difficult. It leads to dillemas and unknowns. At the other extreme of constraints is flexibility, a characteristic which describes the generic form of something. If there is a lack of constraints, you have to be creative.

It is easy to get stuck in constraints and detail. What you should then aim for is flexibility. Present a proof of concept, present the ideal design for one particular situation. In other words, make your own (realistic) assumptions of what would work. If you get stuck in constraints and details, ask the client for clarity. Start high-level, begin with what you know (collect all the facts that are fixed, static) and spiral down into detail.


2 Responses to Web interaction design with contraints

  1. […] Further reading Making design decisions Setting contraints and worrying about detail […]

  2. […] Application/website constraints (re-usable templates, fixed navigation elements) – these become your design constraints. […]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: