Elements of UX Design

Liip Techtalk November 9th 2010Memi Beltrame: The UX Design Process

Memi Beltrame

The UX Design Process

Creating User Experiencefrom Research to Implementation

Liip techtalk, November 9th 2010

User ExperienceDesign

Content

BehaviourForm

Content

BehaviourForm

Information Architects

GraficDesigners

InteractionDesigners

No Design without Research

Who? What? Why? How?

UX Design follows the 5S Pattern

Abstract

Concrete

Research

Implementation

Strategy

StrategyFind out● Context● Purpose/Range● Focus Group(s)● Mission Statement

ScopeFind out● Personas● Their Goals● Their Motivation● Their Usecases

Personas A Short Introduction

A Persona is a representative of a certeain user group.

Define Target Audience

Analyze Users Group Users Form Persona

Personas● Are tangible● Provide a common ground for conversation ● Help prioritize tasks in regard to business relevance

Personas● Name them● Give them a background ● Define their level of skills● Define motivation & needs

The Weiss family Jeff & Lize Kevin & friends

Example: Swiss Winter Resort

The Weiss family Jeff & Lize Kevin & friends

Who are they? What are their needs?

The Weiss family Jeff & Lize Kevin & friends● Middle class couple● Jeff: Lawyer, Lize: Teacher● Travel a Lot● Like sports & nature● Want to find out on their own what suits them most

● Student● Very social snowboard nerd● Good offers are crucial to him● Likes adreanline kicks● Depends on public transport● Wants to get on the slopes as easily as possible

● Shoe-Shop owners with 2 kids● Have been here before once● Come by car● Only during school holidays● Want to be sure to get best offers to match their budget

● Need planning support

Structure

StructureFind out● Workflows● User Priorities: Tasks & Information

Skeleton

Translate Usecases and Tasks to Prototypical Screens

Skeleton

Translate Usecases and Tasks to Prototypical Screens

Make Prototypes → Test → Iterate

Skeleton

Tests verify assumptions on● Tasks● Workflows● Content

Skeleton

Define Patterns for Interaction and Design Principles

Surface

Design Layouts and Grafical Elements.

Surface

Implement Design and Interactions

Surface

Implement Design and Interactions

Implement → Test → Iterate

Surface

Tests give feedback on● Functionality● Content● Aesthetics

Mission, Focus Groups

Personas, Tasks

Workflows, Information Architecture

Prototypes, Design Patterns

Screens, Implementation

Any Questions?

Thank you!

Creative Commons Credits:

By Steve Polyakhttp://www.flickr.com/photos/spolyak/1031569673/

By David – Studio 757http://www.flickr.com/photos/studio757/4515640847/

By Sport Communitieshttp://www.flickr.com/photos/sportcommunities/2200759639/

Elements of UX Design

Technology

UX design Guide

The elements of UX

UX DESIGN UX DESIGN FOR STARTUPS

UX design challenges

Realtime UX Design & The Growing UX Developer

Atypon Design Studio · UX design is an art and a science. Atypon’s UI and UX designers know your readers and understand intuitively what website interface elements are key to a

UX design 101

25 POINT UX DESIGN CHECKLISTUX+Reports/25+Point+UX+Design...25 POINT UX DESIGN CHECKLIST by Laith Wallace | UX MASTER CLASS 13. UI ELEMENTS 16 Its best when working on a project to

Digital Media, UX-UI Design > UX-UI Design > Interaction ... · Therefore, animated and interactive elements are an important part of conveying our digital content. They are found

Elements of UX

Elements of User Experience Design - WordPress.com · Elements of User Experience Design ... bit.ly/jmu-ux. Elements of User Experience Concept, Execution, Assessment ... Analytics

UX Disrupted - a new reality for UX design

Qs, ux, design

UX-REPUBLIC Poster about UX Design Thinking

UX in Design

UX Design Portfolio

UX Design, Services Design & Design Thinking

UX Portfolio Derek Smith. Overview Slides to walk through the UX activities of a sample project Present key design elements of the sample project Some

Ux design workflow

UX Design Presetation