What Is Object-oriented UX Design and How to Design It?

FlowMapp
5 min readOct 22, 2022

--

The picture below represents the object-oriented UX design in real life. Let’s have a look at the physical embodiment of OOUX first. When you are in a grocery store you don’t need to ask someone where the milk products section is. The section markers will navigate you. All the products are categorized by context. So the object-oriented design does the same: helps users to reach their goals while using your product.

What Is OOUX

Object-oriented UX design is a design methodology to describe the planning of the interactions of objects and the content. It is an additional action to the whole process of creating a product in which we register objects and actions with these objects.

For now, to understand the OOUX:

  • OOUX is a design methodology
  • and the preparatory stage of work
  • OOUX is based on the objects concept
  • OOUX helps to create a better product

OOUX brings clarity on what a final product will look like.

When to Use It

Object-oriented UX design is for large websites that are always updated with information. In other words, OOUX is for more complicated products. You won’t use it for small sites with a few pages just because there are not enough objects, and you don’t need to create this additional planning step.

When we talk about object-oriented UX design we want to mark out the definition of the heterarchy when each object manages or is being managed depending on circumstances. Heterarchy is more flexible and means that objects interact nonlinearly. In the form of the spiderweb. So we need the OOUX if the user goes out of his user flow and acts nonlinearly.

As in the case with the grocery store, objects — products sections — are arranged according to the principle of heterarchy. So no one tells you what you need to buy first, but the system is built the way that is the most comfortable for the user on his user path. We use object-oriented UX design because his user path includes changing contexts and desires, and the system is complicated. And actions go after objects: we enter the store, see the certain section and decide if we will buy something in here.

Nouns and Verbs

In a world of object-oriented UX design, we tend to view objects and call-to-actions more thoroughly. Objects are nouns here, and actions — what to do with the object — are verbs.

In the OOUX world nouns always go first, verbs — afterward

It means, that first, we set up all the possible and meaningful for the users’ objects, and after that will set up a call-to-action system for our users.

So What Are Objects

Let’s imagine that we are building a website to sell fresh flowers from the local farms. The first and the main object is a flower. After we define our first object, we will add the core content to it. In our case, the core content for the object “the flower” is the flower’s Latin name, common name, color, etc. Everything that reveals our object for a better user experience.

Next, what are our nested objects? For instance, the farm. So the user can find the needed object at “the flower” section or at “the farm” section. We allow our users to choose the best decision for them, when we invent objects first. So if it is more comfortable for him to choose the nearest farm he will use your website because you give him this opportunity. Let’s have a look at the pic below:

Actions With the Objects

Call-to-actions in the OOUX methodology go after we set the objects. What will the user do with a certain object? In our case with the flower. He wants to put the flower in the “basket”, also he wants to “add” more objects, he wants to “buy”. All these actions are based on the objects.

As we mentioned above we use the object-oriented UX design with complicated websites with lots of objects and actions, so we make the whole development process more efficient. Now let’s sum up the basic steps for the OOUX design.

Principles of the OOUX

#1 — Set up objects

We set up objects based on the users’ and the brand’s needs and goals. In our case with the flower website we collect the users’ needs in buying fresh flowers, add the needs of farms in selling them, and add the needs of the brand — the website — to be a part of the process.

#2 — Add the core content

The core content opens up the objects, makes them more clear for the users, and shows the benefits of the objects.

#3 — Create the spider web between the objects

Each object of the complicated product has relationships with other objects, so create associations between them. In the case of a flower website, we can cross-link such objects as “the flower” and “the farm” to create a better user experience.

#4 — Add actions to the objects

We create our product to make the user do something. For simple websites, we create common pathways and scenarios of actions. In the OOUX design we set up objects first, and then add actions that help the user reach his goal.

#5 — Consider the main and nest objects

We should decide which objects are main and which of them are added. For this, we research our key audiences. What is the most important for our users, and what are their goals?

#6 — Test the system

The OOUX is a preparational step before the development process. So change elements if it’s needed.

Benefits of OOUX

for the development process

OOUX helps to create high-quality complicated products because all the creative team members work together at the same time — designers, SEO specialists, copywriters, etc. OOUX is a step when all the participants are involved in the process while working on a product. This step helps the team to make better decisions.

for the users

OOUX helps to create high-quality products for our consumers. OOUX is needed when we want to create a complicated product to meet the consumers’ needs.

Conclusion

The user flow-oriented design method is popular, but with complicated websites with lots of information — objects — it’s better to add the step where we create the system of objects and actions with these objects. It will help us to build a better user experience.

Great web design starts with planning. Great planning starts with FlowMapp

Meet the FlowMapp 2.0. Complex solution for all stages of planning process. From idea to clickable prototypes. Add FlowMapp to you toolkit

Originally published at https://www.flowmapp.com.

--

--

FlowMapp

Design exceptional UX for beautiful websites and products with online collaborative tools