Contextual Elements

This is not a framework. This is not a new methodology. This is a way of thinking abstract about design and map your elements.

Ivan Netto

Sep 6 · 2 min read

The process of thinking about design among different groups of professionals, mainly designer and engineers, during the years has become more and more blurry.

From one side we have heard “consistency must be our flag!”, from another “and if we change just here?”

Both professionals are definitely right, they have different backgrounds and reasons to push it hard. However, I would like to ask you to take a step back and observe that it is not working anymore.

It is an approach of thinking, just a way to look through your interface and help out with decisions.

Defining invisible borders and constraints on your application is unpredictable, but it is best if they are mapped somehow, therefore the Contextual Elements approach is just a way of helping you to mapping them out.

An element can have four key concepts.

  • Context: It is the locale in the system where the Element must be applied;
  • Responsibility: It is the Elements’ goal, what it needs to achieve, was made for;
  • Neutral behavior: The Element must not affect in anyway other parts of the system;
  • Exponential risk: The most an Element is applied throughout a system, higher is the risk of breaking something else.

Global Elements

They have no context, no predefined responsibilities and neutral behaviour. This type of component can be used anywhere in the system, it guarantees consistency and so, the ease to learn.

  • Context: No;
  • Responsibility: No;
  • Neutral behavior: Yes;
  • Exponential risk: Yes.

Contextual Elements

They have context, predefined responsibilities and do not have neutral behavior. This type of component is based on its context and responsibilities and must not used in a context or be responsible for something it was not initially created for.

  • Context: Yes;
  • Responsibility: Yes;
  • Neutral behavior: No;
  • Exponential risk: No.

Global + Contextual

Because real application are not that easy.

  • A Global Element can be used anyway, so it has neutral;
  • A Contextual Element can have Global Elements inside its body, so in these cases, the Contextual one can control the properties of the Global.

This was just a draft of thoughts on my google docs, I hope it makes someone else’s life easier. It made for me.

Published
Categorized as UX

Leave a comment

Your email address will not be published.