user experience & front end development

User eXperience & Front End Development

Andrea Fallas & Dan Shearmur

UX & FED at Semantico

< 2010 The dark ages…

2011 FED – DanS

2012 FED – Zsuzsa & Gib

2013 UX Architect – AndreaHead of Design – Owen

What is User eXperience?

humans

computers

users

What is User eXperience?

humans

computers

human-computerinteraction

What is User eXperience?

cognition emotion behaviour

conscious

unconscious

What is User eXperience?

humans

computers

cognition

behaviour

emotion

What are user experiences?

experiential perceptive

subjective dynamic

emotive

Designing user experiences

User experience design (UXD) refers to:

"all aspects of [a] person’s experience with the system including industrial design graphics, the interface, the physical interaction and the manual."

— Don Norman (who invented the term)

user EXPERIENCE

design

Designing experiences for users

USER-CENTRED design

user EXPERIENCE

design

Designing experiences for users

USER-CENTRED design

limitationsneeds wants

feedbacktesting iteration

Designing experiences for users

needs, wants & limitations of

users

multi-stage problem solving

process

optimise the system to

accommodate user desires

USER-CENTRED design

Why is it important?

Why is it important?

Sometimes it's just not very clear what we're meant to be doing.

Why is it important?

Sometimes we can be fooled into trying to do the impossible.

Why is it important?

Conflicting instructions and design patterns can make for a very confusing user experience, so we develop useful conventions.

Why is it important?

Problems arise when we start mixing up the elements that constitute this pattern.

Why is it important?

Problems arise when we start mixing up the elements that constitute this pattern.

Why is it important?

Most doors are fairly simple.

What if you've never seen a door before?

How would you feel, faced with this one?

Usability v. usefulnessusability

usefulness

USER-CENTRED design

How can we measure user experiences?

survey users, goals & preferences

card sorting build information

architectures

prototype interaction

models

personas reflect user

groups

wireframe site & page architecture

interview users &

stakeholders in context

tree testinginformation

architectures

usability testinginteraction &

context

How can we measure user experiences?

interview users &

stakeholders in context

Outputs from UX practice

wireframe site & page architecture

What does this mean?

Helps us BUILD THINGS

Stop building USABLE WRONG THINGS

CONCEPTUALISE what we are building

FRAMEWORKS & benchmarks

ANTICIPATE problems

USER-CENTRED design

The interface with development

PRODUCT development

PLATFORM development

ACCESS management

BESPOKE development

FRONT-END development

ORCID development

USER-CENTRED design

UXAndrea

DESIGNOwen

Front-end development

Previously

● Outsource visual design● Tackle design or usability issues ourselves

Having a unified design team will

● Create a feedback loop making things a little bit more iterative

● Solidify process

A library of interface examples

● HTML prototypes● (Eventually) a client facing version● Scolaris re-design