READ MORE
Visual

Motion


 
READ MORE
User

complexity/simplicity

REVIEW
 
READ MORE

Lines

 
READ MORE

Maps


 
READ MORE

Speed

 
READ MORE

Texture

 
READ MORE
User

Temperature

REVIEW

 
READ MORE
User

Color

REVIEW
 
READ MORE

Direction

 
READ MORE
User

Distance

REVIEW

 
READ MORE
User

Frequency

REVIEW
 
READ MORE

Order

 
READ MORE

Pitch


 
READ MORE

Presence

 
READ MORE

Proximity

 
READ MORE

Scale


 
READ MORE

Separation Devices

 
READ MORE

Text

 
READ MORE
User

Transparency

REVIEW

 
READ MORE
User

Typography

REVIEW
 
READ MORE

Vibration

 
READ MORE

Volume


End of the line!
Trending Past Month
Top Ten All Time
 
1
Lines
 
2
Color

 
3
Motion
 
4
Texture

 
5
complexity/simplicity
 
6
Scale

 
7
Distance
 
8
Temperature

 
9
Typography
 
10
Pitch

Jump right in
 
READ MORE
Visual

Motion

Motion is any movement or change in position or time (wikipedia)

The Google Material design style has a whole section dedicated to motion in digital interaction design.

Google Material Design Style motion guidelines

Motion is essential in animation in order to make characters objects seem alive: Dumb Ways To Die (animated short) Analysis

Informational

Motion is naturally highly informative, if used with thought & intent. Very few successful motions exists on their own. This element is used to connect sequence through structure; highlight elements and dim others through zooms; relay a mood or feeling through embodiment. It is a design element that is 4D in that it uses time as a variable.

Orientational

Motion can be invariably used for many, if not almost every digital interaction. However an element unique to screen based interactions might be in ability to give contextual feedback to user actions and commands. The design challenges deals specifically with the limitations of hardware specifications that are overcome and differentiated with a fluid software interactions.

Feedback

Because motion is an “in-between” design element, it is difficult to pinpoint “A” example. One approach is to see motion’s role; it acts as a bridge. It is a mechanism for feedback that needs to connect a user action with a task the user is trying to accomplish. Because the user is [...]

CONTINUE READING
 
READ MORE
User
Social

complexity/simplicity

REVIEW

Something with many parts versus something with few or one part. Complexity maybe considered relative to skill of the person performing a task. In that case, it might be desirable or undesirable for something to be complex or simple (think Mihaly Csikszentmihalyi’s work on optimal flow). From the other side, designers often say it’s really difficult to design something simply.

Mihaly Csikszentmihalyi’s model of flow (via wikipedia)

If a person can easily accomplish an activity effortlessly or understand it, it is considered simple. A thing’s complexity or simplicity is judged by how easily it can be understood/accomplished.

A normally simple task like putting on one’s shoe can become extremely difficult in some occasions…

Orientational

One could assume that users would gravitate toward simple instructions– so the farther along one is on a path to understanding, the more simple the thing may be considered to be.

Feedback

Perhaps the more action a user takes, the more complex the experience becomes. The more steps involved in a set of instructions, the less they are considered to be simple.

A popular toy/game  in the 90s called Simon (based on the school game Simon Says) asks players to repeat a pattern that it gives off on its four panel display of lights/colors. It starts simply and gets more complex as players have to remember a longer [...]
CONTINUE READING
 
READ MORE
Visual

Lines

Lines are a long narrow band, continuous, directional. In geometry, they are defined as a series of points.

Illustration of different line types from Britannica.com

Analysis

Informational

Lines help create both connections and separation between content

Lines to direct and separate in infographic (via nensi.net)

Orientational

It can help create a path, show progress in fulfilling a task. It can help organize content A line on a screen can help create proximity and therefore group pieces of information together so we view them as a set. It can help guide users to stay within certain areas or discourage exploration

Feedback

It can be used to show when a portion of a task is completed: Everything that is done is put one side of a line and the rest you need to do is put on the other.

Line divider in a grocery store. Also helps checker know what they have left for each customer.

 Metaphorical

This can reference the idea of hanging things up on a line (like laundry or developing photographs)

Clothes hanging on a line also creates a visual line. (via solitaryspinster.com)

Lines can be a metaphor to boundaries or borders. The green line in the map below might have political meaning for some people knowledgable on the middle eastern affairs. These borders have great significance to these [...]

CONTINUE READING
Fonts by Google Fonts. Icons by Fontello. Full Credits here »