Systematic UX: What’s in It for Me? | Njuškalo

Systematic UX: What’s in It for Me?

Ivan
Ivan Čiš
Systematic UX: What’s in It for Me?

Intro

A couple of months ago, Lex Fridman hosted David Heinemeier Hansson (aka DHH) on his podcast. David is the co-founder of 37signals, a software company known for fostering a developer-friendly environment, deep & remote work. They discussed the future of working with AI, and DHH raised some great questions:

  • Are we destined to become product managers guiding and editing AI agentic work?
  • Should we let the competence drain out of our fingers?
  • Do we let our craft die in pursuit of outcomes?

I highly recommend listening to this 4-minute clip from this 6-hour podcast. It made me reflect on human centricity as the core of our UX/UI/product design work, and on the role we continue to play as moderators and good hosts in interdisciplinary and multidisciplinary collaboration with our fellow humans. The question I tried to tackle here is: how might I articulate this kind of algorithm of human design work? In this blog, I’ll walk you through a relatively old, multi-phase Njuškalo app refactoring project—not from the perspective of “design systems” per se, but from my experience of collaborating and thinking in systems, while learning four simple lessons, that I keep re-learning, and keep returning to as first principles:

  1. Take Stock
  2. Bootstrap
  3. Confine Yourself
  4. Stack Dominoes

1. Take Stock

In 2020, we started adapting the iOS and Android Njuskalo apps for Bolha, a Slovenian Styria Group brand. As part of the team, I audited the current UI and found out that three different UI architectures coexisted with a wide variety of styles, components, and solutions. The team needed to declutter both the design files and the codebase.

Njuškalo iOS App in 2020

1.1.  Standards v1: Inventory

I’ve consolidated and structured curated set of artifacts into a Zeplin libraries tree.

  • Mobile Core as root (foundational colors and icons for both platforms and brands)
  • iOS/Android Core as branches (platform-specific fonts and components)
  • Njuskalo/Bolha as sub-branches (illustrations, icons, and images)

1.2. Boy Scout Rule

Every team’s collective work forms its own system of getting things done.

Though this be madness, yet there is method in't. (Hamlet, Act 2 Scene 2)

As designers, we often recognize new opportunities for how work gets done precisely because of our interdisciplinary perspective. Our design artifacts—rather than confusing others with unclear or messy work—can strengthen communication and build trust. Our job isn’t simply to pass work along or shift blame, but to ask ourselves: how might we best support those we work with?

Try and leave this world a little better than you found it. (Robert Baden Powell, first chief scout)

Think like a scout: prepare artifacts not only for yourself or a specific project but also for others and future work. Or, using the bee analogy: forager bees collect nectar from flowers, store it in their stomachs, and upon returning to the hive, pass it on to worker bees for processing. Be a helpful forager who provides the stock your fellow humans need. 🐝

2. Bootstrap

After completing work for Bolha, we decided to rearchitect the apps from the ground up, starting by refactoring core features such as searching, browsing, listing ads, and detail views. The key to the success of this project was a great collaboration with the iOS architect and our shared commitment to keeping a holistic view of the entire app in mind.

New UI Artifacts Bootstrapped in First Half of 2021

2.1.  Standards v2: Shape Up

Our goal was not to rebuild the entire design system all at once, but to bootstrap a new, robust standards essential for future projects.

  • simpler set of colors, interactions and states
  • new standards for tappable areas, 8pt soft grid spacing, elevations and corner radii
  • new icon sets, assets, container styles, and base components consistent across platforms

2.2. Selflessness as a Goal

A while ago, one of our colleagues wrote a blog titled Strife for Happiness, explaining how the Art of War can teach us about balance in our everyday work (by the way, check out this great graphical interpretation of the book). In a similar vein, here’s how John Wooden used to remind his players about the core of happiness, ad infinitum;

Happiness begins where selfishness ends. (John Wooden)

Selflessness is what any team needs most, especially when it consists of diverse roles. Throughout various projects, and especially in this one, I’ve often been reminded that the key to selflessly supporting others as a designer is to keep alignment, appetite, and autonomy always in mind.

2.2.1. Alignment

One thing designers can always improve on is understanding our colleagues’ perceptions and aligning with their perspectives on our shared goal. This way, we help the group stay pragmatic, resourceful, and more effective than when we contribute individually.

Ape alone weak. Apes together strong. (Caesar, Rise of the Planet of the Apes)

2.2.2. Appetite

Without a similar hunger in your colleagues, satisfying your own design hunger is unlikely. Don’t be delusional by battling windmills—discover what the team is truly hungry for, and they’ll join you in the kitchen. We all strive for a growth mindset—the key lies in knowing in which area.

Hunger is the best sauce in the world. (Don Quixote)

2.2.3. Autonomy

It’s a known fact that big things are often achieved by a small number of autonomous individuals. Be open to hands-on interactions. Rather than waiting for direction or getting lost in discussions, sharpen your questioning, articulating, and listening skills. Take ownership and let your design speak for itself.

Build projects around motivated individuals. Give them the environment and support they need,
and trust them to get the job done. Agile Manifesto

To conclude with another bee analogy: after the forager bees pass the nectar to worker bees inside the hive, the worker bees continue to process the nectar until it becomes honey, after which they cap the honeycomb cells with wax, signaling to other bees that the transformation is complete. 🐝

3. Confine Yourself

After clearing UI dead weight, launching Bolha apps, and establishing new  standards, refactoring followed on the user portal. Simultaneously, we transitioned to Figma, assessed our day-to-day work and enhanced the standards through atomic design methodology.

3.1. Standards v3: Systematization

The libraries were restructured by platform and brands:

  • components:
    • iOS Components
    • Android Components
  • assets:
    • Njuškalo Assets
    • Bolha Assets
  • colors:
    • Njuškalo Colors
    • Bolha Colors

3.1.1. Color Tokens

Colors from the existing palette were defined as tokens according to their purpose (icons, text, borders, containers, backgrounds).

3.1.2. Text Tokens

All the existing variations were streamlined into just three weights (regular, medium, bold) and four categories (title, body, subtitle, caption).

3.1.3. Base Components

Discrepancies between versions of the same component were resolved by creating entirely new base components (tab bars, top nav bars, buttons, dialogs, bottom sheets, ad cards etc.)

Figma Libraries in the Second Half of 2021

3.2. Power of Constraints

I recommend watching this 10-min talk by Scott Belsky, founder of Behance and 99U conference, which is now over 15 years old. Delivered in 2010 during the rise of broadband internet and mobile apps boom, the talk was given with the motto “1 percent inspiration and 99 percent perspiration,” emphasizing the craftsmanship. Sometimes what we want to work is impossible to do, it needs patience, the right approach, or the right timing. It might also be beyond the given resources and time. Our job is to have the discipline to make the most of the constraints we’re given.

Discipline is as important an aspect in any implementation of Agile development methodology as all the other 'classic' aspects such as communication, collaboration, and so on. Furthermore, discipline is what makes the latter truly effective. (Vedran Križek, co-founder of Trikoder)

https://youtu.be/_f0CQ5Lwdmo?si=F1FOgnf-RyjEOwyn

If we want to discover new opportunities, maybe we can think less “outside the box” and instead box ourselves within constraints more. To paraphrase Scott: instead of defying them, we should value them. From Marcus Aurelius' perspective, the self-discipline to confine yourself to the present is one of the cardinal virtue.

Wipe out vain imagination. No longer allow your passions to pull you around like a puppet. Confine your attention to the present time. Learn to recognize what is happening to yourself or another. Divide and analyse every given object into the material and the causal. Give thought to your last hour. Let the wrong committed by another remain where it first arose. (Meditations, 7.29)

4. Stack Dominoes

Over more than two years, we redesigned and refactored a large part of the app’s sitemap, while partially refreshing the rest of the app by applying the new standards:

  • Home
  • Category List
    • Ads List
      • Search
      • Ads Map
      • Ad Detail View
      • Filters
  • Saved
  • Ad Submit
  • Messaging
  • Moje Njuskalo
    • My Ads
    • PayProtect
    • Saldo
    • More info
  • Login & Registrations


4.1.  Standards v4: Evolution

4.1.1. Dark Mode

After discovering that 1 in 3 iOS users and 1 in 4 Android users had dark mode enabled on their phone while using our app, we decided to add dark mode to the app. Since almost everything was built with tokens and molecules by that time, it took us just a couple of sprints to implement dark mode. Additionally, during prototype testing, we discovered the benefit of using fewer labels in the accent color, which was also easy to achieve by updating the base components.

Njuškalo iOS App in Second Half of 2022


4.1.2. Njuskalo Identity Refresh

Early 2025: Njuškalo refreshed its mascot, and all assets were updated within one sprint.

4.1.3. Accessibility Updates

Mid-2025: all color tokens were updated in one sprint to meet WCAG 2.1 accessibility standards.

4.2. Humans and Domino Effect

The alternative to humans taking a systematic approach has always been simply vibing from project to project. While “vibing” has its place in discovery, it can easily trap us in endless idea generation and distract us from the deliberate practice needed to excel in quality.

If you're learning how to play the guitar, you can watch as many YouTube videos as you want. You're not gonna learn the guitar. (DHH on Lex Fridman podcast).

Projects are like dominoes—we can play for individual wins, or repurpose the pieces to stack them one after another so a single push transfers momentum all the way to the desired goal. AI can’t do this for us. It’s up to us, as humans, to choose which projects to stack in line to create the domino effect. Most of the work I’ve described here depended on our basic human skills like active listening, good articulation, understanding and respect. AI can’t do this for us either. It’s up to us, humans, to choose what habits and behaviors are worth keeping, and which ones to let go.

All big things come from small beginnings. (James Clear, author of Atomic Habits)

To conclude, user growth also compounded with time. While doubling the velocity of both design and development for new projects, as well as doubling the iOS user base, we increased the overall total number of all users across all mobile apps by 35%and boosted app visits by 60%.

Conclusion

According to Iain McGilchrist our brain is divided into two complementary hemispheres. The right is the holistic, big-picture "Master" grounded in experience, while the left is the analytical, detail-focused "Emissary" lacking insights and depth.

Old-school designers understood this dichotomy through hands-on practice, so it’s no surprise that some industry standards have endured the test of time by mirroring how our minds work:

In November 2022, Jakob Nielsen published NN/g slogan #7, “UX is people”, once again emphasizing that the core of our practice is not technology, but people—both the users and our teams. The video was released just nine days before ChatGPT launched publicly. Since then, over the past three years, we’ve been going through yet another Gartner Hype Cycle. The best way, I believe, we can preserve our sanity in this rollercoaster, as we move toward the plateau of productivity in working with LLMs, is to hold on to the basic lessons about how our brains work and how to be deliberately humane toward one another.

Making All The Difference

The group of colleagues made all this possible. From David (mobile dev lead), Dino (iOS architect), and product owners Anamarija and Aleksanrda, to my very own team lead and mentor Dora, whose mentorship helped me grow more than I ever could have on my own.

Share on social media

More from the library

5 ključnih točaka za rješavanje pogrešaka za početnike

5 ključnih točaka za rješavanje pogrešaka za početnike

Svi projekti imaju greške. Jeste li se ikada susreli s greškom koja se u početku činila nemogućim? Evo pet točaka koje pokazuju kako sam se naučio nositi s njima.
Author
Eugen Borna Grgić
Pročitaj više
Najbolje prakse za tamni način rada i utjecaj na korisnike

Najbolje prakse za tamni način rada i utjecaj na korisnike

U Njuškalu je odluka o uvođenju dizajna s tamnim načinom rada bila prirodan izbor, posebno jer smo primijetili da sve više od 50% svih korisnika naše aplikacije preferira korištenje svojih pametnih telefona u tamnom načinu rada.
Author
Maša Gavran
Pročitaj više
Kobrin efekt i što možemo učiniti da ga ublažimo

Kobrin efekt i što možemo učiniti da ga ublažimo

U potrazi za boljim korisničkim iskustvima, web developeri često uvode nove značajke kako bi poboljšali proizvode. U ovom članku istražujemo načine na koje te značajke mogu proizvesti nepredviđene posljedice i načine na koje ih možemo ublažiti.
Author
Tomislav Buljević
Pročitaj više