Top 10 UX Guidelines to help instill user experience though out your company. Presented at the UX Camp Europe Conference 2015 in Berlin.

1. UX Guidelines

2. UX Guidelines
Jasson A Schrock
Head of User Experience at Onefootball
Melanie Daveid
Senior Product Designer at Onefootball
Top 10

3. 3 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Planning
UX Guidelines
3 © Onefootball GmbH / Top 10 UX Guidelines / 2015

4. It’s about the user
/ Speed and simplicity are important but are not
always the answer.
/ Empathize with the user to understand their
needs.
4 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Increase user happiness
1

5. 5 © Onefootball GmbH / Top 10 UX Guidelines / 2015 https://youtu.be/iueVZJVEmEs?t=6m21s
Perspective is
Everything
“…six million pounds was spent to reduce the journey time
between Paris London by about 40 minutes.
With 0.01% of that money you could put wifi on the trains
which wouldn't reduce the duration of the journey but would
have improved its enjoyment.”
– Rory Sutherland, TEDx Athens
600 MConstruction work
WIFI
VS

6. Toothbrush Test
"Is this something you will
use once or twice a day, and
does it make your life better?”
— Larry Page, CEO of Google
6 © Onefootball GmbH / Top 10 UX Guidelines / 2015
/ Timing and context are critical.
/ Ask, “What are the user’s needs?”
When and Why?
Solve a users need and make it a habit
2

7. 7 © Onefootball GmbH / Top 10 UX Guidelines / 2015-06-20
Toothbrush Test
"Is this something you will use once or twice
a day, and does it make your life better?”
— Larry Page, CEO of Google

8. 8 © Onefootball GmbH / Top 10 UX Guidelines / 2015
MVP = Minimum Viable Product
/ To gain traction the MVP needs to be more than just
what’s feasible.
What is the MVP?
Make it valuable not feasible
3
NOOOOOOO!!!

9. 9 © Onefootball GmbH / Top 10 UX Guidelines / 2015
/ To gain traction the MVP needs to be more than just
what’s feasible.
What is the MVP?
Make it valuable not feasible
3
YES! That’s perfect.
MVP = Minimum Viable Product

10. 10 © Onefootball GmbH / Top 10 UX Guidelines / 2015
What is the MVP?
Make it valuable not just feasible
3
VS
NOOOOOOO!!! YES! That’s perfect.

11. 11 © Onefootball GmbH / Top 10 UX Guidelines / 2015
/ Collecting ideas for the future shouldn’t derail
the process.
/ Prioritize items to move forward.
P0 – Mandatory
P1 – Important
P2 – Needed
P3 – Nice to have
Make priorities
Plan for the next steps but
focus on the MVP
5

12. 12 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Complexity
Balloon
Implicit over explicit personalization
6
Tailor to the User
/ Keep the complexity on our end, not the users.

13. Tailor to the user
13 © Onefootball GmbH / Top 10 UX Guidelines / 2015
6
Total Complexity

14. Tailor to the user
14 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Hard to Use Easy to Use
6
VS
Exposed to
the User
Handled by
the Product
Interface Handled by
the Product
Interface
Exposed to
the User

15. 15 © Onefootball GmbH / Top 10 UX Guidelines / 2015-06-20
Option = Decision
" Every time you give a user an option, you are
asking them to make a decision.
When a user doesn’t care or understand the option
this ultimately leads to frustration. “
— Tom McFarlin, Developer
https://tommcfarlin.com/wordpress-philosophy-decisions-not-options/15 © Onefootball GmbH / Top 10 UX Guidelines / 2015

16. 16 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Designing
UX Guidelines
16 © Onefootball GmbH / Top 10 UX Guidelines / 2015

17. 17 © Onefootball GmbH / Top 10 UX Guidelines / 2015
The Monomyth
aka The Hero’s Journey
Tell a story
6
It’s not a feature list
/ We’re all hardwired for stories…
create a story not a list of the feature functions.

18. 18 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Have a clear visual hierarchy
7
Visually guide users
/ When everything is important, nothing is important.
/ Does it pass the squint test?
Squint Test

19. 19 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Squint Test
Have a clear visual hierarchy
7
Visually guide users
/ When everything is important, nothing is important.
/ Does it pass the squint test?

20. 20 © Onefootball GmbH / Top 10 UX Guidelines / 2015
/ React to the user’s actions through visual,
audible, or haptic feedback.
Is this working?
Provide feedback for every
interaction
8

21. 21 © Onefootball GmbH / Top 10 UX Guidelines / 2015
“Because you watched
House of Cards”
Encourage interaction with context.
9
Explain why
/ Tangental content needs a reference point.
/ Use community details to improve gamification and
encourage exploration (eg. view count, ratings, shared by, etc).
/ However beware of too many repeated elements.

22. 22 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Do you know the answer?
Be consistent
10
Don’t reinvent
the wheel
/ Use common design frameworks so the user
knows what’s happening next.

23. Overview
23 © Onefootball GmbH / Top 10 UX Guidelines / 2015
Planning
1. Increase user happiness
2. Solve a user need and make it a habit
3. Make it valuable not just feasible
4. Plan for the next steps but focus on the MVP
5. Implicit over explicit personalization
6. Tell a story
Designing
7. Have a clear visual hierarchy
8. Provide feedback for every interaction
9. Encourage interaction with context
10. Be consistent
Top 10 – UX Guidelines

24. Thanks!
Melanie Daveid
Senior Product Designer at Onefootball
Melanie.Daveid@Onefootball.com
melaniedaveid.com
Jasson A Schrock
Head of User Experience at Onefootball
Jasson.Schrock@Onefootball.com
about.me/Jasson
@jasson
@melaniedaveid
24 © Onefootball GmbH / Top 10 UX Guidelines / 2015