Designing a user interface based on the
calm technology paradigm and schematic
visualization, and its evaluation from a
communicability and rhetoric standpoint.
Omar Sosa Tzec
CIRIA – UDLAP.
Samuel Cortina Arteaga.
Design Faculty – UDLAP.
Roberto Holguín Molina.
InSitum – México.
4th Information Design
International Conference.
Rio de Janeiro | Brazil | 2009.

Introduction:
Point of start.

Human –
Information
Computer
Design.
Interaction.
Other
disciplines &
paradigms.

User Schematic Information
Interface Visualization.
Design.
Calm Technology
Design Paradigm.

Users’ Design Prototype
Evaluation.
Needs. Process. Proposal.

Taking Calm Technology
into count:
What is to consider the paradigm
into the design process?

Periphery
Center

Periphery
Center

User Interface.
Interface
components.

Interface component
at user’s center.

Preliminary Work:
Design methods based on
Experience Sampling Method and
Participative Observation.

Visual records Fusion of visual records
from location in order to identify patterns.
of chat windows.
User working
with a laptop
and chat client
running.
Text records Records grouped into
about the inner possible ESM categories.
experience at that time.
Needfinding Excercise

Recorded
answers are
grouped into
ESM categories.
Contact’s
Question Chat client answer.
about the is running.
contact’s inner
experience.
IM shows up
on contact’s
side.

Design Process:
Sanders’ postdesign, participative
design, personas, and sketching.

Low–fi prototype
Sketching.
design.
Evaluation
Design
Persona. Sketching.
ideas.
Design
Plenary Sketching.
ideas.
session.
Scenario. Design
Sketching.
ideas.

Rhetoric Triangle Model:
A conjecture of how interface design
process evolves.

Designer. User Interface. User.
Accomplish
a task.
Take
action.
Speaker. Speech. Listener.
Rhetorical appeals:
Logos,
Ethos,
Pathos.

Logos. Design process.
Ethos. Pathos.
Design
phase.

Design Results:
MoviTalk, a UI proposal of an
IM Client for mobile devices.

Variation of size. Change in placement. Color code. Change in shape.
Transparency. Change in color. 3±5 feature. Drawers.
Tap. Drag/write. Usage of icons.

Evaluation methods:
Execution of usability and communicability
testing plus the rhetorical space
characterization on the prototype.

Insitu
Prototype. Scenario.
notes.
Think aloud.
Video from
the testing.
Usability
issues.
Communicability
breakdowns.
Global
analysis.

What is an evident functional feature?
What and why:
What can be interpreted as a design feature?
logos,
What may be related with something emotional?
Printed image ethos, and
of prototype. pathos.
Tagging with colored
sticky notes.
Inference
by
users’
overall
Tagging with colored tagging.
sticky notes.
Tagging with colored
sticky notes.
Global
analysis.

Results.

Participant 5
Participant 4
Participant 3
Participant 2
Participant 1
What’s this?
Why doesn’t it?
Help.
Where is it?
What now?
What happened?
Oops!
Where am I?
I can’t do it this way.
Thanks, but no, thanks.
I can do it otherwhise.
Looks fine for me.
I give up.

Conclusions.

User can decode a
considerable amount of
information at glance.
* By applying visual variables combined with other characteristics,
such as layers and easy-to-learn visual signs, users can focus only
on the design elements relative to their task at hand.
* The Calm Technology paradigm can be supported by applying the
schematic visualization of information to a GUI.

Postdesign. Participative Participative
ESM
Observation. Design.
Needfinding.
* It is remarkable that a great amount of valuable information
can be obtained by doing this review since early stages of
design; and not only when working with interfaces, but also
with other design products.
* . It is appropriate to introduce a participative design exercise
to know about the users’ experiences in order to enrich further
stages of design.

Comunicability
testing.
Unconventional or
untraditional user interface.
Semiotic
engineering.
* It is important to remember that the fidelity of the
prototype should no be disregarded while evaluating
unconventional features. A still low fidelity prototype,
for example, lacks the movement and interactivity that
can reinforce the users’ semiosis during an evaluation.

* The design process can be qualitatively characterized by
using the rhetorical appealing modes: logos, ethos, and pathos.
* The logos appealing mode is closely related to the rational
aspects of design and the instances of well-known interface
elements. On the other hand, the pathos appealing mode is
concerned to those interface elements that can be directly
modified by the users, such as the personalization features.

Muito Obrigado!
Full work available at Facebook:
http://www.tzek-design.com http://www.facebook.com/omitzek
Twitter:
http://twitter.com/tzek/
Information design blog:
http://www.tzek-design.com/blog