ui design based on schematics and calm technology by omar sosa tzec et al., cidi 2009

Designing a user interface based on the calm technology paradigm and schematic visualization, and its evaluation from a communicability and rhetoric standpoint.

Omar Sosa TzecCIRIA – 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.

InformationDesign.

Otherdisciplines &paradigms.

Human – Computer

Interaction.

Schematic InformationVisualization.

User InterfaceDesign.

Calm TechnologyDesign Paradigm.

Users’Needs.

DesignProcess.

PrototypeProposal. Evaluation.

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

Periphery

Center

Periphery

Center

User Interface.

Interfacecomponents.

Interface componentat user’s center.

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

User workingwith a laptop and chat client

running.

Visual records from location

of chat windows.

Fusion of visual recordsin order to identify patterns.

Text recordsabout the inner

experience at that time.

Records grouped intopossible ESM categories.

Needfinding Excercise

Chat clientis running.

Questionabout the

contact’s innerexperience.

IM shows upon contact’s

side.

Contact’sanswer.

Recordedanswers are grouped into

ESM categories.

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

Scenario.

Designideas.Persona.

Plenarysession.

Designideas.

Designideas.

Sketching.

Sketching.Low–fi prototype

design.

Sketching.

Sketching.

Evaluation

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

User Interface.Designer. User.

Speech.Speaker. Listener.Rhetorical appeals: Logos, Ethos, Pathos.

Accomplish a task.

Takeaction.

Logos.

Ethos. Pathos.

Design process.

Designphase.

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.

Prototype.

Usability issues.

Communicabilitybreakdowns.

Scenario.Insitunotes.

Globalanalysis.

Think aloud.

Video fromthe testing.

Printed image of prototype.

Tagging with colored sticky notes.

Tagging with colored sticky notes.

Tagging with colored sticky notes.

Globalanalysis.

Inferenceby

users’overall

tagging.

What and why: logos, ethos, andpathos.

What is an evident functional feature?What can be interpreted as a design feature?What may be related with something emotional?

Results.

Wha

t’s th

is?

Participant 1

Why

doe

sn’t

it?

Whe

re is

it?

Wha

t now

?

Wha

t hap

pene

d?

Oop

s!

Whe

re a

m I?

I can

’t do

it th

is w

ay.

Than

ks, b

ut n

o, th

anks

.

I can

do

it ot

herw

hise

.

Look

s fin

e fo

r m

e.

I gi

ve u

p.

Hel

p.

Participant 2

Participant 3

Participant 4

Participant 5

Conclusions.

User can decode a considerable amount ofinformation 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.

* 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.

Postdesign. ParticipativeObservation.

ESMParticipative

Design.

Needfinding.

* 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.

Unconventional oruntraditional user interface.

Comunicabilitytesting.

Semioticengineering.

* 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 athttp://www.tzek-design.com

Facebook:http://www.facebook.com/omitzek

Twitter:http://twitter.com/tzek/

Information design blog:http://www.tzek-design.com/blog