Heuri: Brutally Honest Design
When I was a kid, I loved drawing houses. In fact, most of the drawings my parents saved for me were just houses. When retrospectively viewing my artistic treasures the other day, I noticed a particular pattern: they were oversized, simplistic (duh!) and had pretty much nothing around them. The pinnacle of my graphical extravaganza was trees and picket fences. There were no people, no animals around, just the house, staring at you from the picture.
Flowers and birds are a superfluity. Image source: Picryl
Instead of psychoanalytically laying out what that might entail about my personality (a task left as an exercise for the reader), I’m mentioning this because I think that directness and crudeness still vastly define how I think and who I am today.
On Designing Things
When I started designing Heuri, all I considered important was what data to use and how robust my system architecture should be. It won’t surprise you I’m a software engineer. The more I developed the app, however, the more I realized how important the overall design is, including the graphical one.
This initial design of Heuri bites felt diffident to me, exactly how a student might feel about math after getting into regular contact with its merchant form. Image source: author
This month, I’ve started researching and putting together a more distinctive and assertive design system which highlights and fosters one of the few Heuri values, namely creativity and novelty.
Inspirations
It would be ludicrous of me to stitch everything together myself, so I searched around for a way to design Heuri scalably. I’ve found an incredibly vast amount of information, extending even to product design. I also didn’t want Heuri to look like a “vibecoded” SaaS from 2026, many examples of which I’ve already shown in previous articles. I hope I’m stating the obvious: if you want to build trust among users, you have to have an idea of what you’re doing.
Brutalism
I won’t even pretend to understand the intricacies and ingenuities of any of the art forms or web design trends. I just rummaged through a few web design and art articles I found on the internet and extracted whatever resonated with me the most.
I think brutalism best describes the crudeness part of my house drawings, which is why it resonated so much. It’s to the point, no questions asked. There you have it, take it or leave it. Exactly how I still think and what Heuri is trying to promote: it’s not here to hold your hand and prepare wonderful flashcards for you. Expect constructive and controlled struggle because that’s the natural part of any learning, at least from my experience. You make mistakes, you learn from them, rinse and repeat.
Let’s rage against the EdTech vibemachine. Image source: Picryl
Brutalist web design is sometimes criticized for its randomness, its inability to accommodate web accessibility, and the fact that it may even cause anxiety for some users (examples of these critiques and web brutalism can be found in the reading list below). I would argue, however, that was exactly the point in the 2010s when brutalism came about as a trend in web design. It was purely an experiment to see where else we can take web browsing. That’s why brutalism has never become a mainstream UX trend, as it’s not easily reproducible and transferable to any domain language. And that’s perfectly fine.
Neubrutalism
That doesn’t mean, however, that web designers haven’t taken inspiration from brutalism. Neubrutalism is an attempt to commodify and streamline the uncompromising pragmatism and boldness of heavyhanded brutalism: Crudeness as a Service, if you will. That’s why it makes sense to me to incorporate this style even in Heuri, as it provides dead-simple rules and guides on how to design a system accordingly.
The official neubrutalism guide showcases this exact aesthetic. Hard shadows, distinct palette, prominent fonts, minimum of animations, layout asymmetry. Even though it’s a 2020s trend, it’s also a timeless design methodology. Image source: neubrutalism.com
Nomenclature Comes First
One of the typical aspects of brutalism in architecture is the repeated patterns and modularity of the design. To me as a software engineer, thinking in terms of these constraints is second nature. That’s why I was ecstatic when I found out about Object Oriented UX (OOUX) through a very refreshing interview.
Sophia Prater, evangelist of OOUX, has a very compelling point: object-oriented programming isn’t useful only for software engineers and architects; it’s the natural way we process and understand the world around us. First, we establish nouns by which we grasp the concepts around us, and only then do we describe actions or verbs that define relationships between those nouns. Prater argues that traditional UX design has it the other way around: by designing flows (or verbs) without knowing the domain language, we might get trapped into designing a system that’s very hard to scale and test, as nothing is pluggable and/or reusable.
That’s why the fundamental principle of OOUX is defining a glossary first, or a ubiquitous language, as advocates of Domain-Driven Design (DDD) would put it: a unified, unambiguous language that’s ardently enforced throughout all divisions of the company: business owners, sales, marketing, software development, R&D, and so on. Such noun foraging is established as part of a process named ORCA.
Even though that might sound like something from a corporate business management book, trust me, it’s much more flexible and engaging than that: to me, ORCA has felt like one continuous back-and-forth brainstorming session, helping me realize what parts of Heuri are still ambiguous and relying on the presence of a rainbow fairy.
That’s why I’ve decided to adopt an incremental OOUX approach to my design process: whenever I’m designing a new, substantial part of Heuri, using this clever combination of object-oriented thinking and DDD will uncompromisingly guide me towards the decisions I need to make.
Heuri Glossary
Here is what I was able to establish during a 2-hour brainstorming session:
BITE: A little piece of granular mathematical knowledge that’s densely indexed. A bite purposefully segments the high school curriculum so that students can target specific areas and don’t have to navigate through long-form lectures or texts.
LEARNING LOG: A standalone data point capturing a snapshot of a user’s understanding and learning progress. It intentionally moves away from binary “right/wrong” paradigms to favor a standalone entity that can be leveraged as an input to a Socratic dialogue, counterexamples, etc.
KNOWLEDGE GRAPH: Shows what the user knows, organized in a densely interconnected graph that’s constantly evolving.
STUDY GROUP: A social boundary, or a collection of people in Heuri, that determines the way users are organized within the platform. It treats all possible external spaces architecturally the same, managing shared resources, custom permissions, and lifecycle rules.
This just shows the immense potential this approach has.
Happy learning!
Reading List
- 10 UX Writing Principles — ParallelHQ
- Atomic Design 101 — Radiant Digital
- Atomic Design and Modern Design Systems — Design Systems Collective
- Atomic Design Methodology — Brad Frost
- Atomic Design: Why the Labels Don’t Matter — Qt
- Bauhaus Brutalism — The Backward Vendor
- Bauhaus vs Brutalism: Impact on Modern Branding — PutraCetol Studio
- Bauhaus vs Brutalism: Key Differences — LearnArchitecture
- Brutalism vs Neubrutalism in UI Design — CC Creative
- Brutalism, Minimalism and Neobrutalism in Design — Medium
- Controlled Vocabulary: Practical UX Method — Chandan Mendiratta
- Controlled Vocabulary: Say the Same Thing the Same Way — Medium
- Design and Digital Interfaces — Barnes & Noble
- Design and Digital Interfaces — Goodreads
- Design Principles — Robot Moon
- Futura: The Typographic Avant-Garde — Medium
- Microcopy: The Book — Nemala
- Minimalism in Graphic Design — The Developing Life
- Neo Brutalism Web Design: A Guide — Alpha Efficiency
- Neobrutalism: Definition and Best Practices — Nielsen Norman Group
- Neubrutalism in Web Design — LogRocket
- Neubrutalism: UI Design Trend That Wins The Web — Bejamas
- Object-Oriented UX with Sophia Prater — InfoQ
- Object-Oriented UX: A Structured Approach — LogRocket
- Object-Oriented UX: The Power of Objects-First Design — UX Planet
- The Essential Guide to Microcopy — UX Magazine
- The Object-Oriented User — OOUX
- Top UI Design Books — Nucleus UI
- What Is Atomic Design? — FlowMapp
- What Is Neubrutalism? A Visual Guide — SVGator