How to use OOUX to make sense of the mess.
I've been working on earning a certification as an Object-Oriented UX professional and I made this presentation, originally in Mural, as part of hosting a Lunch & Learn session for my UX colleagues.
Object-Oriented UX, also known as OOUX, is a UX process that unwraps complexity by way of focusing navigation elements as easy-to-recognize nouns, in keeping with how brains learn and work.
Discovery
Since this was a Lunch & Learn presentation, I was looking for a lunch-related theme to explain OOUX. It's not that difficult to find a food-related website that could use some OOUX magic. For this presentation, I chose @TacoBell as a project to break down and build back up. Why? Here's my story:
When I have a Taco Bell craving, that craving does NOT last very long for me, a few minutes at most before I come back to my senses. One day recently, I was craving the usual 3 Taco Supreme combo that I would get at the drive-thru before the pandemic.
Let's just say the online experience is more cumbersome than the drive-thru experience. First, this is Taco Bell's menu page:
I like the colors and icons, but it's not easy to find my usual combo, first I went to "My Cravings" since that was in the top left. This is what I see:
So that obviously is not right. I end up seeing "Combos" and I was able to find my usual combo, and customize it. You have to customize each one, which honestly is OK.
Current workflow to customize your Taco Bell order.
Only when I was done customizing, I realized I had the wrong restaurant selected in the top right. Once I selected the correct restaurant, I discovered that my order was NOT saved, because Taco Bells have different menus. So I gave up on my order!
During this process, I saw two usability issues that could be corrected using the OOUX process:
1. Make the menu items easier to find! In the current grid, menu items, combo items, party boxes, and selected filters al LOOK THE SAME and it takes some cognitive load to figure out what you want.
2. Make sure hungry people select a restaurant BEFORE creating an order, especially at a place like Taco Bell where you can do a lot of menu item customizing.
Solution: OOUX to the Rescue!
The first step in the OOUX process is discovering the nouns that show up over and over again in a company's materials such as FAQ pages, case studies, competitor sites, or anything else you can find. If you have user interview transcripts at your disposal, that would be ideal. Just from some time highlighting items from Taco Bell's FAQ page, these are the nouns that I found, with some affinity mapping for synonyms and proper names:
Taco Bell noun foraging project
Object Matrix
From this affinity mapping exercise, five objects emerged for me:
1. Order (a group of items)
2. Item (a group of ingredients)
3. Ingredient (because of the high amount of customizations on items)
4. Restaurant
5. Fan (I chose fan instead of a more generic "customer" because of the Taco Bell merch on the site, independent Taco Bell fan sites out there, and the fact that I almost incorporated hot sauce packets that said "marry me" in my own wedding, which unfortunately was NOT at the Taco Bell Wedding Chapel in Las Vegas.)
In the object matrix I mapped out the basic relationships between the objects. For reference, it took roughly an hour to do these first two steps:
Taco Bell's Online Menu, Analyzed
Now that I had my defined objects, I did an analysis of Taco Bell's online menu. I highlighted which of the menu items are objects (in blue) and which ones are actually filters (in pink). Based on this, I reorganized the menu based on, from left to right, menu items, groups of menu items, and two columns of filters.
The Taco Bell Menu, analyzed. Blue stickies are objects, pink stickies are filters.
New Information Architecture In Action
From this exercise, I did two quick mocks based on the new information architecture. The first mock depicts the reorganized menu as well as the reorganized menu on the left:
my quick & dirty mock of the new menu page
The second mock shows that initiating an order depends on first selecting a restaurant, which is based on the workflow that currently lives under "choose restaurant" in the top right:
My quick-and-dirty mock of a workflow that would enforce choosing a restaurant before starting an order.
I was able to use OOUX processes and principles to get to the mocks very quickly and make confident, research-based decisions for my information architecture.
