Object-Oriented UX (OOUX): A scalable model for user-centered design to increase collaboration across disciplines and teams.

1. OBJECT-ORIENTED UX (OOUX)
A scalable model for user-centered design to increase collaboration
across disciplines and teams.
12 OCT 2016
Ed Hertzog
Sr. UX Engineer
Georgia Spangenberg
Sr. Researcher

2. #OOUX
IN CONTEXT
PAST PRESENT FUTURE

3. #OOUX
THE PAST

4. #OOUX
LINEAR AND ATOMIZED
TRADITIONAL PROCESS
01 02 03RESEARCH DESIGN DEVELOPMENT

5. #OOUX
RESEARCH DEFICITS
TRADITIONAL PROCESS
Puts focus on user in
up-front research
phase: lack of user
focus in later phases
Conceptual and
discovery research too
early, often too
abstract for other
disciplines

6. #OOUX
DESIGN DEFICITS
TRADITIONAL PROCESS
Interactive focus -
lacks opportunities
for abstraction for
developers
Atomized focus on
interaction before
data
Voice of user can be
lost

7. #OOUX
IMPLEMENTATION DEFICITS
TRADITIONAL PROCESS
Developers see little
interest in research
phase (not relevant
to their needs yet)
“Whisper down the
lane”

8. #OOUX
WHAT IS THE PROCESS REALLY LIKE?
PROCEDURAL DESIGN & PROGRAMMING

9. #OOUX
How have we moved beyond that?

10. #OOUX
THE PRESENT

11. #OOUX
A shift in mindset.

12. #OOUX
A SHIFT IN MINDSET
Research engaged
throughout the
project; all disciplines
use sprints to deliver
value.
Research is a design
and development tool
for creating a “user-
center designed”
product.
Abandon the
assembly line
process.

13. #OOUX
THE GOAL
As a
researcher,
I want to
get to findings &
insights (quickly),
so that
we can get to a
good design
(quickly).
USER-CENTERED DESIGN

14. #OOUX
What’s it look like?

15. #OOUX
THE AGILE TRINITY

16. #OOUX
EVALUATE EVALUATE EVALUATE
RESEARCH DESIGN BUILD

17. #OOUX
SPRINT 0 SPRINT 1 SPRINT 2 SPRINT 3 SPRINT 4 SPRINT 5 SPRINT 6 SPRINT 7

18. #OOUX
SPRINT 0 SPRINT 1 SPRINT 2 SPRINT 3 SPRINT 4 SPRI
kickoff

19. #OOUX
STAKEHOLDER
INTERVIEWS
IN-DEPTH USER
INTERVIEWS
TECH ASSESSMENT
COMP
SPRINT0
Week 3 Week 4Week 1 Week 2
SPRINT1

20. #OOUX
FRAMEWORK DESIGN
NT
COMPETITIVE ASSESSMENT
Week 3 Week 4 Week 6Week 5 Week 7
RESEARCH SYN
USABILITY TESTING
SPRINT1 SPRINT2
MVP DEVELOPMENT
PTH USER
RVIEWS

21. #OOUX
SPRINT 0 SPRINT 1 SPRINT 2 SPRINT 3 SPRINT 4 SPRINT 5 SPRINT 6 SPRINT 7

22. #OOUX
CURRENT PROCESS
Assumes and relies
upon close physical
proximity of teams
Assumes and relies
upon hyper-
communicative team
members
Not necessarily scalable
when utilizing
geographically remote
teams

23. #OOUX
How can we iterate on this process?

24. #OOUX
THE FUTURE

25. #OOUX
A change in mindset.

26. #OOUX
Object-Oriented UX
#OOUX
A change in mindset.

27. #OOUX
OOUX ORIGINS
Dave Collins (1994)
Designing Object-Oriented User Interfaces
Sophia Voychehovski (2015)
http://alistapart.com/article/object-oriented-ux

28. #OOUX
OOUX
Place object design
before interaction
design.
Place data before
logic.
Abandon the
assembly line micro-
process.

29. #OOUX
PROCEDURAL

30. #OOUX
PROCEDURAL vs.

31. #OOUX
PROCEDURAL vs. OBJECT ORIENTED

32. #OOUX
WHY DO WE WANT TO DO THIS?
So we can think about the entire system in line with real-world
objects in users’ mental model, not digital-world actions.
We don’t go to a web site because we want to search, filter, or
check-out. We go to a web site because we want a plane ticket. We
want relationships. We want food.
We want a book.
We want things.

33. #OOUX
You might be thinking, this all sounds great, but we have a lot of
invested in Agile.
We have user stories, we have workflows, we have a minimal viable
product we need to produce in a few weeks.
What does that all mean?
BUT WE’RE SO INVESTED IN AGILE!

34. #OOUX
Start with a discrete “object”, which can have associated
“actions” and “adjectives” associated with it.
OOUX & “THINGS”
Example:
Object: Coin
Verb: Rate
Adjective: Year

35. #OOUX
As a user I can view numerous coins so that I can rate each coin.
As a user I can add/edit/delete comments for each coin and sort by date
posted.
As a user I can view the properties of each coin, so that I can see what the
current average rating is, as well as view the year, mint, type, obverse and
reverse image and see who the user is who originally uploaded the coin.
THE USER STORY
Noun, Verb, Adjective, Metadata

36. #OOUX
1. Nouns are objects
2.Verbs are methods of objects (CTAs)
3.Adjectives are properties of objects
4.Collection of adjectives are metadata
5.Find relationships between objects
6.Find dependencies between objects
7.Code before wireframes (!)
Object Mapping
More on Sophia Voychehovski’s Object Mapping process
http://rewiredux.com/ooux

37. #OOUX
Another Example: Researcher is planning usability testing, gives
developer a list of workflows to build into prototype.

38. #OOUX
So, what’s the problem?
1. Vaguely defined pages that reflect only
the researchers mental model of it (not
design or dev)
2. Sentence fragments instead of user
stories
3. No clear delineation between page and
action or relationship between them
4. No URLs referenced which can be
confusing for developers who likely just
came onto the project

39. #OOUX
Reframed as an OOUX: Researcher is planning usability testing, gives
developer a list of workflows to build into prototype.

40. #OOUX
So, what’s different?
1. Object State: Workflows are collections of
related objects
2. Clear Identifiers: Each object has a clear
ID, the team has the same understanding of
that object and which workflows utilize an
object
3. Color Coding: Colors distinguish objects
and CTAs (adopted from OOUX object
mapping*)
4. Colloquial Naming: Each object state has
one to ease communication
5. URLs: Each object state has one making it
easier for all team members to locate assets
*for more on OOUX object mapping: Object-Oriented UX by Sophia
Voychehovski http://alistapart.com/article/object-oriented-ux

41. #OOUX
THE EFFECT OF OOUX ON PROCESS?
Research, then design, then development
vs.
Research and design and development

42. #OOUX
SPEAK THE SAME LANGUAGE

43. #OOUX
…about this idea?
…what role research and design play in defining objects?
…other challenges we should solve for?
WHAT DO YOU THINK?

44. #OOUX
THANK YOU
Ed Hertzog
edhertzog@gmail.com
Georgia Spangenberg
georgiaspangenberg@gmail.com