25
Exploring UX Techniques and Practices When should they be applied? Ariadna Font UX Lead @Vivisimo, an IBM Company @quicola #leanux #pghtechfest Tuesday, June 12, 12

Exploring UX Techniques and Practices 4 Product Development

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: Exploring UX Techniques and Practices 4 Product Development

Exploring UX Techniques and PracticesWhen should they be applied?

Ariadna FontUX Lead @Vivisimo, an IBM Company

@quicola #leanux #pghtechfestTuesday, June 12, 12

Page 2: Exploring UX Techniques and Practices 4 Product Development

Goal of the session

Map out what UX techniques to do when during the development cycle

Tuesday, June 12, 12

Page 3: Exploring UX Techniques and Practices 4 Product Development

What’s UX (User Experience)?

• How do people feel about (using) a product / site

• User-Centered design and development

• Experiential, affective aspects of human-computer interaction

• Perceptions of utility, easy of use and efficiency

• Subjective in nature

• Dynamic, it changes overtime

Tuesday, June 12, 12

Page 4: Exploring UX Techniques and Practices 4 Product Development

What’s Agile development?

• A Philosophy / State of mind

• Continuous improvement

• Flexible and Adaptable

• Iterative

• Puts communication at the center

• Autonomous Teams

• Customer-driven development and predictable deliverables

Tuesday, June 12, 12

Page 5: Exploring UX Techniques and Practices 4 Product Development

Agile Manifesto

• Individuals and interactions over processes and tools

• Working software over comprehensive documentation

• Customer collaboration over contract negotiation

• Responding to change over following a plan

Tuesday, June 12, 12

Page 6: Exploring UX Techniques and Practices 4 Product Development

Product Development Stages

• Goal & Scoping

• Requirements

• Analysis

• Design

• Development

• QA

• User Research

• Scoping

• Prototyping

• Development

• Acceptance / User testing

• Demo/Retro

• Generate, group and prioritize features

• Initial UI design and workflow (Explaining/defending UI design and workflow to stakeholders)

• Design revisions / iterations

• Just in time (JIT) design design)

Tuesday, June 12, 12

Page 7: Exploring UX Techniques and Practices 4 Product Development

UX practices - User Research

• What problem are we trying to solve? Who are we building this for?

• Contextual Inquiry (day-in-the-life sessions, interviews)

• Personas (also for Scoping)

• Stakeholder map

• Popping the “why” stack

Tuesday, June 12, 12

Page 8: Exploring UX Techniques and Practices 4 Product Development

UX Practices - Scoping

• User stories

• Workflow models (story maps, storyboards, sketch-boards, user experience maps (Maria’s session)

• Affinity Diagrams (more traditional way to organize data into themes)

• “Agile Schedule” or Rich Visual Backlog (deadline/PM dimension overlaid on top ~ ariadna.font.cat)

• Inception Deck (Jonathan Rasmusson ~ @jrasmusson)

• “How to design stuff that matters fast?” (Eewei Chen ~ @Ultraman)

Tuesday, June 12, 12

Page 9: Exploring UX Techniques and Practices 4 Product Development

UX Practices - Prototyping

• Sketches - low fidelity on paper (1-up, 6-up, concept sheet)

• Wireframes - grayscale mockups showing layout and position of page elements (can range from low-fidelity to exact grid-based resolution)

• Paper prototypes - paper versions of wireframes or sketches that users can simulate slicks and talk through their thoughts and decisions

• Wireflows - a combination of wireframes and flowcharts that shows several pathways through an application

• Mockups - full color, full resolution designs (Photoshop)

• Functional prototypes - HTML or fully functional

Tuesday, June 12, 12

Page 10: Exploring UX Techniques and Practices 4 Product Development

UX Practices - Development

• Just-in-time design (see prototyping practices)

• BDD - executable acceptance tests (cucumber)

• Kanban

• Demos

• Retrospectives

Tuesday, June 12, 12

Page 11: Exploring UX Techniques and Practices 4 Product Development

UX Practices - Usability Testing (UT)

• Guerrilla UT

• Paper prototype UT

• Qualitative UT

• Task-based, few participants, facilitator, observers (Gotomeeting)

• Pair testing

• Controlled experiment (A/B Testing)

Tuesday, June 12, 12

Page 12: Exploring UX Techniques and Practices 4 Product Development

Human-Centered Design methods

• Collaborative design sessions (ideation/brainstorming)

• Round-robin (sketch, critique, improve,...)

• Rose, bud, thorn (improving existing functionality/design)

• Affinity clustering

• Business value/difficulty matrix

Tuesday, June 12, 12

Page 13: Exploring UX Techniques and Practices 4 Product Development

Stakeholder mapping

• A network diagram of the people involved with (or impacted by) a given system design.

• Establish shared ideas about stakeholders

• Help team focus on people, not technology

• Guide plans for user research

• Document research activities

Tuesday, June 12, 12

Page 14: Exploring UX Techniques and Practices 4 Product Development

Contextual inquiry

• Day-in-the-life sessions (for example: double jacking in a call center)

• Observe/interview people in their context

• Pair of observers is ideal

Tuesday, June 12, 12

Page 15: Exploring UX Techniques and Practices 4 Product Development

Personas

• User profile

• Demographics

• Context

• Needs

• Values

• Technical knowledge

Tuesday, June 12, 12

Page 16: Exploring UX Techniques and Practices 4 Product Development

User stories

• Software system requirement formulated in one or two sentences in everyday or business language of the user

• Needs to fit on a card (sticky)

• As a [type of user]

• I want to [perform some task]

• so that I can [reach some goal]

Tuesday, June 12, 12

Page 17: Exploring UX Techniques and Practices 4 Product Development

Story mapping (Jeff Patton ~ @jeffpatton)

• Organize and prioritize the functionality of a system (user stories)

• Initial discovery, planning and scoping of a project / product

• Just-in time story mapping for features

Tuesday, June 12, 12

Page 18: Exploring UX Techniques and Practices 4 Product Development

Affinity diagrams

• Organize ideas (opinions and issues) into themes

• A way to organize and visualize customer requirements

Tuesday, June 12, 12

Page 19: Exploring UX Techniques and Practices 4 Product Development

“Agile Schedule” or Rich Visual Backlog (ariadna.font.cat)

• Visual project schedule on butcher paper containing:

• Weekly milestones

• Existing design and layout info

• User stories with due dates

• Non-functional requirements

• Any other high-level task that needs to be tracked and completed before launch

Tuesday, June 12, 12

Page 20: Exploring UX Techniques and Practices 4 Product Development

Wireframes

• Grayscale mockups showing layout and position of page elements (can range from low-fidelity to exact grid-based resolution)

• Great to get early feedback

Tuesday, June 12, 12

Page 21: Exploring UX Techniques and Practices 4 Product Development

Kanban

Tuesday, June 12, 12

Page 22: Exploring UX Techniques and Practices 4 Product Development

Behavior-driven development (BDD)

• A template to capture a story’s executable acceptance criteria

• Documents and directly tests user and the system’s behavior

• Given some initial context (the given)

• When an event occurs

• Then ensure some outcomes

Tuesday, June 12, 12

Page 23: Exploring UX Techniques and Practices 4 Product Development

Usability Testing

• Technique used in user-centered interaction design to evaluate a product (or a website) by testing it on users.

• It gives direct input on how real users use the system

• UT focuses on measuring a product’s capacity to meet its intended purpose

• Usability testing measures the easy of use of a specific object

• Generally involves setting a series of tasks for people to complete and noting problems they encounter

Tuesday, June 12, 12

Page 24: Exploring UX Techniques and Practices 4 Product Development

Informal (Guerrilla) Usability Testing

• Quick and easy, you can do it yourself

• Relative inexpensive, can afford multiple tests

• Qualitative nature can provide improved design insight

• Results can be fed back into the design process immediately

Tuesday, June 12, 12

Page 25: Exploring UX Techniques and Practices 4 Product Development

Questions?

Ariadna Font ~ @quicola #leanux #pghtechfest

ariadna.font.cat

Thanks!!!

Tuesday, June 12, 12