presentation of our UX Expert at DrupalCamp London

1. User Centered Design
approach in a Drupal
agency: keep calm and
carry on
Anna Hanchar
@anna.hanchar

2. Agenda 1 What is UCD
2
3
4
What is the challenge
Why UCD
What is our approach
5 Our steps to follow
6 How we test
7 Tips and tricks

3. 1
2
3
4
Why UCD
What is UCD
What is the challenge
What is our approach
Agenda
5 Our steps to follow
6 How we test
7 Tips and tricks

4. User Centered Design
Early focus on users and tasks
Launch and Maintenance
Design and implementation
Conceptual design
Usability evaluation

5. 1 What is UCD
2
3
4
Why UCD
What is the challenge
What is our approach
Agenda
5 Our steps to follow
6 How we test
7 Tips and tricks

6. Client is NOT the user
Client defines how a website should look like

7. UCD is the link
Connects end-user and client
Usable products that end-users love
Happy customers and
saved/earned money

8. 1 What is UCD
2
3
4
What is the challenge
Why UCD
What is our approach
Agenda
5 Our steps to follow
6 How we test
7 Tips and tricks

9. The challenge is
How to sell it?!
• “Awesome UX comes naturally”
misconception
• Additional research/iterations/changes =
additional budget
• Client knows the best

10. 1 What is UCD
2
3
4
What is the challenge
Why UCD
What is our approach
Agenda
5 Our steps to follow
6 How we test
7 Tips and tricks

11. Start early, walk together
• Sell the client a product design process as a
whole
• Include specification workshops in the project
scope
• Personas
• Customer journey
• Conversion goals

12. 1 What is UCD
2
3
5
What is the challenge
Why UCD
Our steps to follow
Agenda
4 What is our approach
6 How we test
7 Tips and tricks

13. 1. IA is essential
• Milestones (Header, Footer)
• Clear structure and visual feedback

14. 2. Important parts of UX
• What are the most essential workflows?
• Notifications?
• Emails created and translated?
Image source: http://speckyboy.com/2011/03/31/10-essential-web-application-usability-guidelines/

15. 3. Wireframes and prototype are
part of specification

16. 4. Reduce to the max

17. 4. Reduce to the max

18. Agenda 1 What is UCD
2
3
4
What is the challenge
Why UCD
What is our approach
5 Our steps to follow
6 How we test
7 Tips and tricks

19. We conduct UX tests
Remote moderated usability test
• Participants are at home or what suits them best
• Script via Google Forms
• VC Software
• Video and audio recording

20. We test
• Clickable prototype with the homepage designed
• Target users
• Go through tasks and think aloud
• Rate the experience before and after interaction
• Complete System Usability Scale

21. We do the homework
• Analysis of videos
• SUS and questionary results

22. Present results wisely
• Always propose a way how to solve a problem
• Wrap as nicely as possible and add some sugar
• Visualise

23. Results side effects
“Thank God you get this feedback, you made
me very happy just now!”

24. Agenda 1 What is UCD
2
3
4
What is the challenge
Why UCD
What is our approach
5 Our steps to follow
7 Tips and tricks
6 How we test

25. Test and research
• As early as possible
• The most important interactions
• Embrace as much as possible of user experience

26. Rules to follow
• Never conduct usability tests shortly before
launch
• UX researcher is not interaction designer
discuss the results together
• Improvements can be implemented in different
phases

27. Always improve
Have a hypothesis that a feature is not user friendly?
• Guerilla tests with a couple of people
• Elaborate a better solution

28. Login redesign

29. Work as a team
• Slack UX-channel
• Feedbacks of the team on (clickable) prototypes and designs
• Design critique is an input and not critique
• Share best practises and findings on Demofriday

30. It’s worth it!
• Save costs in the long run -> fewer change
requests
• User friendly solutions and high quality
• Happy customers

31. Contribute
Drupal features can be improved
Create a solution (for your client)
Contribute this to drupal.org

32. Error messages
https://github.com/AmazeeLabs/ife

33. Questions?