Have conceptual grammars finally arrived to UX design?
Conceptual grammars help align a product’s design with the mental model of the users for better usability. UX has historically ignored them.
Over the last decade, we have seen the emergence and consolidation of fundamental UX-related design trends like design thinking, user research, and the adoption of design systems which have made the practice of UX design more robust, predictable, and respected. These trends have allowed us to successfully address or at least ease many of the challenges of digital product design.
However, we still have a biggie pending: conceptual model design. Since the very inception of UX, we knew of the importance of conceptual models for design success. Don Norman already stressed it in his germinal book The Design of Everyday Things (1988). Nonetheless, historically UX design methodologies have underdeveloped conceptual model design and especially the creation of conceptual grammars. The later is a practice that helps align the product’s high-level design with the mental model of the users which in turn produces better overall usability and subjective experience. We will see more about it in a minute.
Lately, I have the feeling that we are finally starting to see some light at the end of the tunnel. In the last couple of years, design advocates like Daniel Rosenberg with his UX Magic book (2020), and Sophia Prater with her OOUX methodology have made significant contributions to raise awareness about the need to incorporate conceptual model design into our design processes. Moreover, Sophia Prater has recently released the Object-Oriented UX (OOUX) Fundamentals course on Udemy which provides an even more convenient and affordable learning resource on conceptual model design. So, this is probably the best moment ever to get acquainted with this formidable design tool.
The Basics
A mental model is a representation that each user makes of how a product works. It is superficial, dynamic, and initially based on their prior experiences.
A conceptual model is a blueprint of how a product works. A practical way to differentiate the two is to think that we research the users’ mental model, but we design the product’s conceptual model.
Note: Different authors have slightly diverging views on the meaning of the terms mental model and conceptual model. Some even consider these synonyms. To avoid complicating things too much, I have provided the simplified definitions I use in my classes.
Conceptual model design is done by the product designers at the beginning of the design phase. It is, therefore, a high-level design practice (i.e. done before the detailed screen or page design) that tries to provide an overall, abstract model of how a product will work. It usually involves the creation of design artifacts such as task flows, user flows, information architectures, taxonomies, sitemaps, and conceptual grammars.
A Rising Star: Conceptual Grammar
In my opinion, the most powerful and paradoxically least used element of a conceptual model is the conceptual grammar, also known as UX grammar, interaction grammar, or semantic grammar.
A conceptual grammar in its most basic form, is just an inventory of the most relevant concepts that a user would need to be familiar with to understand how the product works. A well-defined conceptual grammar would potentially match the most prevalent concepts present in the users’ mental models for the product.
For each concept in the grammar, we would also capture the data attributes that make it up and the actions that can be taken on it. Additionally, we would also document the relationship with the top concepts that form the grammar.
Note that the authors I mentioned favor the use of the term Object instead of Concept as it connects better with software development tradition and avoids potential confusion with the similarly named conceptual design which actually means high-level design.
There is much more to the creation of a conceptual grammar including concept discovery, refinement, prioritization, and presentation in the UI. Check the learning resources below for more details.
A Simple Example
Let’s imagine we want to create a dog care app. The top two concepts or objects of its conceptual grammar would be:
Just having these two concepts well defined is enough to see how easily we would be able to design a dog or owner card for a list view in the app or the corresponding detail screens of each concept including the applicable CTAs.
The above relationships reveal that there are other concepts in the grammar like insurance policies and payment methods. Notice how relationships also define the cardinality of the relation (e.g. one-to-one, one-to-many, etc).
The Benefits of Conceptual Grammars
Human thinking and learning are mainly concept-oriented. When we interact with apps, we use the same cognitive capabilities that we use to cope with everyday real-world situations. That is to say, we think mainly in terms of concepts. So it seems only natural to use conceptual grammar as the foundation of our digital product design specifications. Doing so will bring us significant benefits such as:
- Creating more intuitive and easy-to-use experiences for users
- Minimizing the cognitive load of our solutions
- Facilitating the designer’s work as concepts, properties, actions, and relationships usually have a clear and direct translation into different UI patterns
- Creating a more consistent, structured, and optimized design with fewer screens and elements
- Adding a real synthesis phase in the design process that allows creating an actionable foundation from all the information gathered via user research and other sources
- Reducing project risk by clarifying concepts, properties, and their relationships in the early stages of product development
- Providing a more developer-friendly conceptual model deliverable as programmers can easily translate grammar elements into Object-Oriented Design (OOD) and Object-Oriented Programming (OOP) code.
Simplify if Needed
The approaches advocated by Daniel Rosenberg and Sophia Prater are robust and scale well for large team use. However, from my work with students, I found that in practice even more modest attempts at defining a conceptual grammar can provide very similar benefits to our designs. If you are interested in learning how to create and apply a conceptual grammar, I would recommend you go through either Daniel’s book or Sophia’s course. Or both. And if you feel their methodologies exceed your needs at the time, focus initially on grammar discovery and presentation. You may also exclude relationships from your first attempts. Even with all these limitations, you will see the immediate benefits of incorporating conceptual grammars into your design process.
Learning Resources
- UX Magic — book by Daniel Rosenberg (2020)
- Sophia Prater’s Object-Oriented UX (OOUX) Fundamentals — Udemy course
- Daniel Rosenberg at CMU — UX Magic seminar — 1-hour video
- Sophia Prater’s OOUX launch guide — Booklet (Newsletter subscription required)
- Introduction to UX Magic — IxDF book review
Additional Resources
- Conceptual Models: Core to Good Design — book by Jeff Johnson & Austin Hendersons (2012)
- Object Modeling & Flow Diagramming for Designers — book by Heidi Adkisson (2022)
- Designing Object-Oriented User Interfaces — book by Dave Collins (1995)
About me
I have been developing and designing software since 1998. I got my first UX-titled job more than a decade ago. I have worked for top banks and IT Fortune 100 companies. I have designed learning and productivity tools. I co-founded a couple of startups that didn’t make it. But lately, I have specialized in complex and enterprise application design. Currently, I am teaching UX and product design at UPM University and the CareerFoundry design school. Feel free to visit my portfolio and LinkedIn profile.
