Welcome to User Experience (UX) Design at EMBL-EBI

82
Welcome to UX Design at EMBL-EBI

Transcript of Welcome to User Experience (UX) Design at EMBL-EBI

Page 1: Welcome to User Experience (UX) Design at EMBL-EBI

Welcome to UX Design at EMBL-EBI

Page 2: Welcome to User Experience (UX) Design at EMBL-EBI

European Bioinformatics Institute Galabina Yordanova, UX Designer

WHYthis seminar

Page 3: Welcome to User Experience (UX) Design at EMBL-EBI

a 5-minute case

Page 4: Welcome to User Experience (UX) Design at EMBL-EBI

one of our services

Page 5: Welcome to User Experience (UX) Design at EMBL-EBI

personas

Page 6: Welcome to User Experience (UX) Design at EMBL-EBI

jobs to be done framework

Source: https://jtbd.info/replacing-the-user-story-with-the-job-story-af7cdee10c27#.9er45jsom

Page 7: Welcome to User Experience (UX) Design at EMBL-EBI
Page 8: Welcome to User Experience (UX) Design at EMBL-EBI

team iterations

Page 9: Welcome to User Experience (UX) Design at EMBL-EBI

the process

Page 10: Welcome to User Experience (UX) Design at EMBL-EBI

the outcome

curiosity

general excitement, more surveys, and desire to learn more about their user needs

Page 11: Welcome to User Experience (UX) Design at EMBL-EBI

1. Interest in UX work for their own service 2. Interest in our tools and methods 3. Interest in the measurable benefits of UX design

“I want to learn about our users, too.”

the outcomes

Page 12: Welcome to User Experience (UX) Design at EMBL-EBI

today…

Page 13: Welcome to User Experience (UX) Design at EMBL-EBI

1. Showcase our work and methods 2. Bust some UX myths 3. Ideas on how you can apply UX design

practices in your team

An opportunity to make an impact in building digital services for life scientists.

the opportunity

Page 14: Welcome to User Experience (UX) Design at EMBL-EBI

UX

Page 15: Welcome to User Experience (UX) Design at EMBL-EBI

Today: Nikiforos Karamanis, Michele Ide-Smith, Gabby Yordanova, Revathi Nathaniel

Page 16: Welcome to User Experience (UX) Design at EMBL-EBI

UX in Web Development team

Nikiforos KaramanisUX Designer

Jenny ChamLead UX Architect

Revathi NathanielUX Designer

Galabina YordanovaUX Designer

Page 17: Welcome to User Experience (UX) Design at EMBL-EBI

Literature Services

Michele Ide-SmithProduct Manager

Anusha IyerUX Architect

Sangya PundirUX Manager

Protein-related Services

Page 18: Welcome to User Experience (UX) Design at EMBL-EBI

What is User Experience?

Michele Ide-Smith, Product Manager and UX Europe PMC

Page 19: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

"User experience" encompasses all aspects of the end-user's interaction with the

company, its services, and its products.

- Nielsen Norman Group

Page 20: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

“I invented the term because I thought

human interface and usability were too

narrow. I wanted to cover all aspects of the

person’s experience with the system.”

- Don Norman

Page 21: Welcome to User Experience (UX) Design at EMBL-EBI

What UX isn’t…

Page 22: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Page 23: Welcome to User Experience (UX) Design at EMBL-EBI

What UX is…

Page 24: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Empathy with users

Page 25: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

“Efficiency is doing things right;

effectiveness is doing the right

thing” - Peter Drucker

Page 26: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Problem solving

Problem solving

Page 27: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

A team sport

Page 28: Welcome to User Experience (UX) Design at EMBL-EBI

When do you do UX?

Page 29: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Throughout the project/product lifecycle*

*Ideally

Page 30: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

UX is a continuous process

Discovery

Design Validation

Page 31: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Discovery

Design Validation

User researchCompetitor benchmarkingTask models & user journeysPersonas

Frame the problemInterview stakeholdersWorkshops

Page 32: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

“What features would you like?”

“How can we make this feature better?”

“How do you think this should work?”

Page 33: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Qual and quant research

Context of use

Primary users Stakeholders

Behaviours

Activities

Pain points

Motivations

Page 34: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Validate assumptions continually

Page 35: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Discovery

Design Validation

Ideation SketchingPrototypingCodingContent writing

Page 36: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Prototyping

Sketches and prototypes

Page 37: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Legend

Existing page

New page

Decision

3rd party service

Create account

ORCID

Plus

Twitter

EPMCHas

signed in before?

YesSelect

account to sign in

Link accountsUse 3rd

party account?

No

Sign in

No

3rd party serviceYes

Visited ‘link

accounts page?’

My Europe PMC home

No

Yes

Finished linking?

Yes

No

Link accounts popup

https://plus.europepmc.org

https://www.europepmc.org

Seen ‘link accounts’

popup before?

YesPlus sign in

No

User only sees this page once - store DB flag

User only sees this page once - store DB flag

Plus home page

Europe PMC - Merge User Accounts Flow

Link accounts

Confirmation popup

User only sees this page once - store DB flag

Is signed into

EPMC? Yes

No

Validate email address

User journeys

Page 38: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Flows and mockups

Page 39: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Discovery

Design ValidationUsability testingA/B testingAnalyticsSurveys

Page 40: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Usability testing

Page 41: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Analytics

Page 42: Welcome to User Experience (UX) Design at EMBL-EBI

UX is collaborative

Page 43: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Own the user experience of your service!

Page 44: Welcome to User Experience (UX) Design at EMBL-EBI

@micheleidesmith

Get involved…

• Empathise with users - observe/run usability tests, gather user feedback, ask “Who is using our service? What are they trying to achieve? Why?”

• Be a designer - it’s about problem solving, and the best ideas come from team collaboration

• Use design guidelines - e.g. the EBI style guidelines

Page 45: Welcome to User Experience (UX) Design at EMBL-EBI

WhyistheOpenTargetsPlatformintuitive?

Dr NikiforosKaramanis

LeadUser ExperienceDesignerEuropean BioinformaticsInstitute

www.targetvalidation.org

Page 46: Welcome to User Experience (UX) Design at EMBL-EBI

• Veryintuitive,youjustsearchforyourtargetandyougettheinformation.Itdoesn’trequiretraining.

• Pullslotsofinformationtogetherinanintuitiveinterface.

• Powerfulresource,clearlinksandeasytousewithouttraining,especiallyforanon-bioinformatician.

Acomprehensiveandintuitiveresource

Page 47: Welcome to User Experience (UX) Design at EMBL-EBI

WhyisthePlatformintuitive?

• Wetrytoknowourusers

• Wedesignandtestasateam

• Wedesignandtestiteratively

Page 48: Welcome to User Experience (UX) Design at EMBL-EBI
Page 49: Welcome to User Experience (UX) Design at EMBL-EBI

HelpR&Dscientistsidentifytherighttargetfora drug

Page 50: Welcome to User Experience (UX) Design at EMBL-EBI

Based on Lean UX: Chapter 3 (p26-29)

Page 51: Welcome to User Experience (UX) Design at EMBL-EBI

InterviewsandObservations

Page 52: Welcome to User Experience (UX) Design at EMBL-EBI

Wedon’taskuserswhattheywant…

Wetrytounderstand

whattheywanttoachieve!

Page 53: Welcome to User Experience (UX) Design at EMBL-EBI

DerekResearch scientist in “Best Pharmaceutical”

working on drug discovery

Background and motivations:• PhD in systems biology, post-doc in mechanisms involved in metabolic disorders.• Keen on working in a hands-on role in the industry to broaden his expertise and make a difference.

Research questions:• Which targets can be associated with asthma?• Which diseases can be associated with PDE4D?

Behaviours:• Spends about half of his time in the lab. Often stays in the lab until late to set up or complete experiments. • Accesses information via PubMed and internal databases.• Tried to use bioinformatics tools and software but finds them hard to learn, understand and use.

Needs and painpoints:

• To make decisions about the association between a potential drug target and a disease, I require information from various data sources.

• I need support by a bioinformatician to put together and access all this information. But a bioinformatician is not readily available to help me answer simple queries related to my research questions.

• Not all data is equal: Where was this study published? How long ago?

Serve Derek by…

• Integrating the dispersed evidence and enabling him to access it directly.

• Helping him answer simple queries more easily.

• Providing him with links to supporting publications.

Based on Lean UX: Chapter 3 (p26-29)

Page 54: Welcome to User Experience (UX) Design at EMBL-EBI

Knowyourusers:Thequickwin• Writedownwhoyouthink yourusersareandwhattheydo.

• Lookforpeoplelikethatandfindoutmoreaboutthem.

• Includeyourteammates inuserresearch.

ØUse insightsfromuserresearchtostateproblemsthatyourdesignsshouldsolve.

Page 55: Welcome to User Experience (UX) Design at EMBL-EBI

Thequickread

Lean UX: Chapter 3

Page 56: Welcome to User Experience (UX) Design at EMBL-EBI

Designasateam

Page 57: Welcome to User Experience (UX) Design at EMBL-EBI

Designwithusers

Page 58: Welcome to User Experience (UX) Design at EMBL-EBI

Explorealternatives anditerate

Page 59: Welcome to User Experience (UX) Design at EMBL-EBI

Designasateam:Thequickwin

• Reserveonemorningpermonth foradesignactivity.• Sketchwithpenandpaper.• Sketchiteratively.• Includeyourteammates inthedesignactivity.

ØTest yourdesignswithusers.

Page 60: Welcome to User Experience (UX) Design at EMBL-EBI

Thequickread

Lean UX: Chapter 3 Five design sheets

Page 61: Welcome to User Experience (UX) Design at EMBL-EBI

Testasateam

Page 62: Welcome to User Experience (UX) Design at EMBL-EBI
Page 63: Welcome to User Experience (UX) Design at EMBL-EBI

Howmanyuserstotestwith?

Page 64: Welcome to User Experience (UX) Design at EMBL-EBI

Howmanyuserstotestwith?

Krug2006:p.139

Page 65: Welcome to User Experience (UX) Design at EMBL-EBI

Fromsketchtoreleaseinjust7iterations

Page 66: Welcome to User Experience (UX) Design at EMBL-EBI
Page 67: Welcome to User Experience (UX) Design at EMBL-EBI

Testasateam:Thequickwin

• Reserveonemorningpermonth forafeedbacksession.• Showyourdesigntoafewusers.• Includeyourteammates inthefeedbacksession.• Askforfeedbackearlyandoften.

ØAct onthisfeedback.

Page 68: Welcome to User Experience (UX) Design at EMBL-EBI

Thequickread

Lean UX: Chapter 3 Five design sheets Don't make me think: Chapter 9

Page 69: Welcome to User Experience (UX) Design at EMBL-EBI

• Ourdesignandtestingparticipants• OpenTargetsdevelopmentteamandleadership• UXcolleagues atEBIandFrancisRowland

Thankyou!

Page 70: Welcome to User Experience (UX) Design at EMBL-EBI
Page 71: Welcome to User Experience (UX) Design at EMBL-EBI

Interested in…

Team ownership of UX

Michele Ide-Smith

Page 72: Welcome to User Experience (UX) Design at EMBL-EBI

Interested in…

How to tap creative potential

Anusha Iyer

Page 73: Welcome to User Experience (UX) Design at EMBL-EBI

Interested in…

Product conceptualisation

Sangya Pundir

Page 74: Welcome to User Experience (UX) Design at EMBL-EBI

Interested in…

UX product planning, cost and strategy

Jenny Cham

Page 75: Welcome to User Experience (UX) Design at EMBL-EBI

Interested in…

Lean UX methodology

Nikiforos Karamanis

Page 76: Welcome to User Experience (UX) Design at EMBL-EBI

Interested in…

Job to be done framework

Galabina Yordanova

Page 77: Welcome to User Experience (UX) Design at EMBL-EBI

Interested in…

Lean user research

Revathi Nathaniel

Page 78: Welcome to User Experience (UX) Design at EMBL-EBI

How can we work together?

• Talk to us!

• Provide practical support and advice, templates etc.

• Request for UX support in EBI project

• Email [email protected]

Jenny ChamLead UX Architect

Nikiforos KaramanisUX Designer

Galabina YordanovaUX Designer

Jonathan HickfordWeb Development Team Lead

Revathi NathanielUX Designer

Page 79: Welcome to User Experience (UX) Design at EMBL-EBI

Learn more

• Engage with the UX community

• Join the EBIUX slack channel

• https://ebiux.slack.com/signup

Page 80: Welcome to User Experience (UX) Design at EMBL-EBI
Page 81: Welcome to User Experience (UX) Design at EMBL-EBI

• Engage with the UX community

• Join the UX slack channel

• https://ebiux.slack.com/signup

• Attend local UX conferences, Meet-ups

• UXCambridge, Cambridge Usability Group

Page 82: Welcome to User Experience (UX) Design at EMBL-EBI

Next

THANKS!