best serve the user experience - eclipsecon 2020 · best serve the user experience a few usability...
TRANSCRIPT
![Page 1: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/1.jpg)
Best serve the User eXperience
A few usability principles
and their Eclipse rendering
Nathalie Cotté
@NathBonitasoft
![Page 2: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/2.jpg)
© 2015 Bonitasoft 3
BONITASOFT, ECLIPSE, AND I
USERS, R&D, AND I
UX AND USABILITY PRINCIPLES
USER EXPERIENCE
DAVE
USABILITY PRINCIPLES
USABILITY PRINCIPLES – DETAILS
CREATE GOOD UX
![Page 3: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/3.jpg)
and I
© 2015 Bonitasoft 4
![Page 4: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/4.jpg)
Bonitasoft, Eclipse, and I
• Open source, BPM, any vertical • Automate processes, connect with the IS • Efficiency, security, traceability, flexibility => A generic product that needs a good UX
![Page 5: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/5.jpg)
Bonitasoft, Eclipse, and I
Bonita BPM
Studio &
UI Designer
Form
application
Bonita BPM
Portal
Living
Applications
© 2015 Bonitasoft 6
![Page 6: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/6.jpg)
Bonitasoft, Eclipse, and I
Bonita BPM
Studio &
UI Designer
Form
application
Bonita BPM
Portal
Living
Applications
© 2015 Bonitasoft 7
![Page 7: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/7.jpg)
Bonitasoft, Eclipse, and I
© 2015 Bonitasoft
• Bonita BPM Studio • RCP application • Built on Eclipse 4.4
![Page 8: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/8.jpg)
Bonitasoft, Eclipse, and I
© 2015 Bonitasoft 9
Main components
Welcome page
Process designer
"Coolbar"
Custom wizards
![Page 9: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/9.jpg)
Bonitasoft, Eclipse, and I
• Product started in 2009, I onboarded in 2013 • Cognitive psychology background • 10 years as a consultant
• Only know the studio UI but no eclipse
• UX methods apply whatever the technology
© 2015 Bonitasoft 10
![Page 10: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/10.jpg)
Users R&D & I
© 2015 Bonitasoft 11
![Page 11: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/11.jpg)
© 2015 Bonitasoft 12
Users, R&D, and I
Users
Java application
developers
on Eclipse
![Page 12: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/12.jpg)
© 2015 Bonitasoft 13
Users, R&D, and I
R&D
Java application
developers
on Eclipse
![Page 13: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/13.jpg)
© 2015 Bonitasoft 14
Users, R&D, and I
SKILLS
POINT OF VIEW
CONTEXT
![Page 14: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/14.jpg)
© 2015 Bonitasoft 15
Users, R&D, and I
SKILLS USABILITY
![Page 15: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/15.jpg)
UX and Usability Principles
© 2015 Bonitasoft 16
![Page 16: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/16.jpg)
• UX = make your • U • S • A • B • L • E
• From the scope of a feature
to the very details of the UI
UX and usability principles
• UX = make your • Users • Succeed • Avoid and recover from error • Be efficient • Learn • Enjoy
• From the scope of a feature
to the very details of the UI
© 2015 Bonitasoft 17
![Page 17: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/17.jpg)
Users, R&D, and I
18
![Page 18: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/18.jpg)
UX and usability principles
UX = User-Centered Design (UCD)
But
WHO - WHAT is the USER?
© 2015 Bonitasoft 19
![Page 19: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/19.jpg)
UX and usability principles
Creating UX = Solving the equation
Cognitive similarities x
Context-specific use-cases
© 2015 Bonitasoft 20
![Page 20: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/20.jpg)
Cognitive similarities: A Brain is a Brain
© 2015 Bonitasoft 21
![Page 21: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/21.jpg)
A Brain is a Brain
© 2015 Bonitasoft 22
GOAL
SUB-GOAL
TASK
• From task to goal
E.g.: Customer Support team
Pick a ticket
from a sorted
list
Answer tickets
relevantly and
on time
Expand
Please
customers
![Page 22: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/22.jpg)
A Brain is a Brain
© 2015 Bonitasoft 23
![Page 23: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/23.jpg)
A Brain is a Brain
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs
• Human-Machine interaction
Senses
Inspired from : Albert Ellis
![Page 24: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/24.jpg)
Context-specific use-cases: Every situation is unique
© 2015 Bonitasoft 25
![Page 25: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/25.jpg)
Every situation is unique
© 2015 Bonitasoft 26
A user has A role, in A company, at A given time
+ a unique skill set, history, personal life events, emotions, and more
![Page 26: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/26.jpg)
Every situation is unique
© 2015 Bonitasoft 27
Physical state
Mental state
Gender
Skills
Seniority
Prescription
Materials
Machines
Social relationships
Organization
Work time
Work space
Activity
Health
Security
Skills
Satisfaction
Production
Quality
Robustness
Imp
acts
Imp
ac
ts
Pa
ram
ete
rs P
ara
me
ters
![Page 27: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/27.jpg)
UX = Solving the equation
… here comes “Dave”
© 2015 Bonitasoft 28
![Page 28: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/28.jpg)
Solving the equation
• Dave is a personum.
• He is our Java Application DEVeloper
© 2015 Bonitasoft 29
![Page 29: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/29.jpg)
Solving the equation
• Create persona:
– Define a scope worth learning about:
• Responsibilities in the project
• Goals
• Technical skills & environments
• Usage habits, common references
• Likes, don’t likes
• Geographies
© 2015 Bonitasoft 30
![Page 30: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/30.jpg)
Solving the equation
– Apply methods to learn about the scope:
• Surveys
• Observations
• Interviews
• Market listeners
– Learn about specific use-cases as you go
– Keep it dynamic: skills evolve, contexts evolve…
© 2015 Bonitasoft 31
ACME
![Page 31: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/31.jpg)
Solving the equation
• Apply knowledge: Persona
© 2015 Bonitasoft 32
Sam (System Admin)
Fred (Front-end Developer)
Dave (Java Application Developer)
Anna (Business Analyst)
Andy (End-User)
![Page 32: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/32.jpg)
Solving the equation
• Dave’s scope:
– Geography • USA, France, LATAM, Spain, Italy, Brasil, Germany
– Responsibility in the project • Main developer, interfacing with Anna , Sam, and Andy
– Technical skills / environment • Java, Groovy, Eclipse, BPMN(?)
– Habits and common references • Eg.: ctrl+space for auto-suggestion
– Likes, don’t likes • Eg.: Changing specs, lack of versioning, slow tools
– Goals • Create slick code, deliver on time (make Andy happy)
© 2015 Bonitasoft 33
![Page 33: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/33.jpg)
Solving the equation
What Bonita BPM needs to do to let Dave use it
What Dave needs to do to use Bonita BPM Studio
User-centered design
Techno-centered design
34
• Do it
![Page 34: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/34.jpg)
Solving the equation
• Create empathy for the users
• Enforce a process
– New feature
– Improvement
© 2015 Bonitasoft 35
Design
Implement
Check Deliver
Knowledge
Data from
the field
Argue,
lobby,
train
Check
Check
![Page 35: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/35.jpg)
Usability principles - Details
© 2015 Bonitasoft 36
![Page 36: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/36.jpg)
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs Sense
Capture, guide
![Page 37: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/37.jpg)
Information structure, incitation
• Organize the content
• Give it a visual hierarchy
• Create space around what’s
important
• Use colors and images
– Menu / Properties / Palette
– Tree
– BDM manager
– Top menu
© 2015 Bonitasoft 38
![Page 38: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/38.jpg)
Information structure, incitation
• Good: BDM manager
![Page 39: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/39.jpg)
Information structure, incitation
© 2015 Bonitasoft 40
• Good: Insert Data and Development menus from the Welcome page
![Page 40: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/40.jpg)
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs Sense
Build meaning
![Page 41: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/41.jpg)
Help
• Name the models used as
references
• Explain the concepts, the
paradigm
• Describe or lead through a
basic workflow
• Explain useful tips and tricks
• Warn against pitfalls
• Open to more information
– Contextual help
– “i”
– Links to web
– Documentation
– Tutorials
© 2015 Bonitasoft 42
![Page 42: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/42.jpg)
Help
• Good: Contextual help and tooltips
It can be hidden
![Page 43: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/43.jpg)
Help
• Good: Links to documentation, tutorials, process examples
![Page 44: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/44.jpg)
Help
• Name the models used as
references
• Explain the concepts, the
paradigm
• Describe or lead through a
basic workflow
• Explain useful tips and tricks
• Warn against pitfalls
• Open to more information
– Contextual help
– “i”
– Links to web
– Documentation
– Tutorials
– Pop up guidance
– Question marks
(video 1:09:07)
© 2015 Bonitasoft 45
![Page 45: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/45.jpg)
Help
• Improve: Make better use of guiding space in pop ups
![Page 46: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/46.jpg)
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs Sense
Ease the right
choice
![Page 47: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/47.jpg)
Minimize workload
• Minimum memory calls
• Recognition rather than recall
• Offer the right options
• Clarify labels of choices
– Lists
– Expression editor
– Ctrl+space
– Dropdown
– Checkbox vs radio
buttons
© 2015 Bonitasoft 48
![Page 48: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/48.jpg)
Minimize workload
© 2015 Bonitasoft 49
• Good: Expression editor has plenty of lists
![Page 49: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/49.jpg)
Minimize workload
• Good: Radio buttons give a clearer explanation of the options
![Page 50: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/50.jpg)
Minimize workload
© 2015 Bonitasoft
51
• Improve: Visibility of the provided lists
![Page 51: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/51.jpg)
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs Sense
Make the controls
obvious
![Page 52: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/52.jpg)
Graphical parameters
• Location
• Size
• Colors
• Fitt’s law: closer and bigger
targets are accessed faster
• :
– The whole
checkbox line
clickable
– Buttons for tables
– Expression editor
– List of options
– Question marks
© 2015 Bonitasoft 53
![Page 53: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/53.jpg)
Graphical parameters
• Improve: Location of buttons
![Page 54: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/54.jpg)
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs Sense
Give the power to
the user
![Page 55: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/55.jpg)
User control and freedom
• Give flexibility
• Give various means to do a task
• Consider the phase of a project
• Adapt to levels of expertise
– Preferences
– Environments
– Contextual palette
– Shortcuts on
create variables
– Default names
© 2015 Bonitasoft 56
![Page 56: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/56.jpg)
User control and freedom
© 2015 Bonitasoft 57
• Good: Preferences wizard
![Page 57: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/57.jpg)
User control and freedom
© 2015 Bonitasoft 58
• Good: contextual palette, shortcuts to create data
![Page 58: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/58.jpg)
User control and freedom
• Flexibility
• Variability
• Time of the project
• Expertise: shortcuts
• No kidnapping
– Preferences
– Environments
– Contextual palette
– Shortcuts on create
variables
– Default names
– Cancel is unavailable
– Welcome page is
forced on each start
© 2015 Bonitasoft 59
![Page 59: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/59.jpg)
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs Sense
Guide on what
needs to be input
![Page 60: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/60.jpg)
Guidance on format
• :
– Tooltips
– Placeholders
– Hints
© 2015 Bonitasoft 61
![Page 61: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/61.jpg)
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs Sense
Success or error:
tell them
![Page 62: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/62.jpg)
Visibility on the system status, feedback, waiting time, error management
– Validation
progress bar
– Error messages in
properties
– Default names
– Random progress
bars
– Live validation
problems over the
workspace
© 2015 Bonitasoft 63
![Page 63: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/63.jpg)
Visibility on the system status, feedback, waiting time, error management
© 2015 Bonitasoft 64
• Good: Default names to avoid unstable status
• Good: Instant error detection
![Page 64: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/64.jpg)
Decision
Making
Action Feedback
Decoding Attentional
Focus
Memories Beliefs Sense
Use standards and
consistency
![Page 65: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/65.jpg)
Consistency & standards
• Eclipse pop ups and wizards
• Same UIs for similar uses
– Titles
– Button position
– Ctrl+space
– Labels
© 2015 Bonitasoft 66
![Page 66: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/66.jpg)
Consistency & Standards
• Improve (?): Default labels sometimes tricky
![Page 67: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/67.jpg)
Usability principles - Details
• Summary
– User guidance, information structure, incitation
– Help
– Minimal workload, concision, low density
– Consistency & standards
– Visibility on the system status, feedback, waiting time
– User control and freedom
– Flexibility, variability intra-individual
– Avoid errors and help error recovery, manage delete
© 2015 Bonitasoft 68
![Page 68: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/68.jpg)
Usability principles - Details
• Sources:
– Bastien, J. M. C., & Scapin, D. L. (1993). Ergonomic criteria for the
evaluation of human-computer interfaces (Report No. 156).
Rocquencourt, France: Institut National de Recherche en Informatique
et en Automatique.
=> http://www.ergoweb.ca/criteres.html
– Nielsen, J., and Molich, R. (1990). Heuristic evaluation of user
interfaces, Proc. ACM CHI'90 Conf. (Seattle, WA, 1-5 April), 249-256.
=> http://www.nngroup.com/articles/ten-usability-heuristics/
– ISO 9241-110
=> http://www.userfocus.co.uk/resources/iso9241/part110.html
© 2015 Bonitasoft 69
![Page 69: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/69.jpg)
Create Good UX
© 2015 Bonitasoft 70
• UX = make your
• Users
• Succeed
• Avoid and recover from error
• Be efficient
• Learn
• Enjoy
• UX = User-Centered Design (UCD)
![Page 70: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/70.jpg)
Create Good UX
• Meet your users
• Create persona
• Build empathy
• Design for the persona
• Apply principles
• Check on the field
© 2015 Bonitasoft 71
![Page 71: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/71.jpg)
Thank you, heroes.
![Page 72: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/72.jpg)
![Page 73: Best serve the User eXperience - EclipseCon 2020 · Best serve the User eXperience A few usability principles and their Eclipse rendering Nathalie Cotté @NathBonitasoft nathalie.cotte@bonitasoft.com](https://reader034.vdocuments.site/reader034/viewer/2022050109/5f46ca9e1d9a63367c7bca87/html5/thumbnails/73.jpg)
Visit us online bonitasoft.com
Join our community Bonitasoft.org
Download Bonitasoft.com/downloads
Follow us on twitter @bonitasoft
Meet your users
@NathBonitasoft
© 2015 Bonitasoft 74