Lukas Oppermann
banner
lukasoppermann.com
Lukas Oppermann
@lukasoppermann.com
530 followers 110 following 210 posts
Design @Github / opinions are my own #DesignSystems #DesignTokens #UX #accessibility 💭 writing http://medium.com/@lukasoppermann ☕️ coffee lover 🐥 dad (he/him)
Posts Media Videos Starter Packs
Good tip @donnie.damato.design: buff.ly/ysu28eJ

Don't use `onDark` in your tokens, this requires adding another set of tokens for everything on dark.

Better define a dark theme and use this in the section that needs a dark BG. This way no additional tokens are needed and it works out of the box.
Ondark virus
While it might seem intuitive at first, naming your tokens this way is bad for your health.
buff.ly
Just re-read @mattstromawn.bsky.social: buff.ly/xqE8kN9
- #DesignSystems are moving from static “dictionaries” to dynamic “functions”
- Dynamic logic enables adaptive, personalized, and accessible UIs
- Tools like CSS clamp() and Material’s dynamic color make this future possible
Functions and the future of design systems
A new paradigm powering the next generation of design systems
buff.ly
Worth a re-read: buff.ly/cHyYAbs

> A thriving DS requires genuine passion from its builders & users

What makes a #DesignSystem Loved?
- exceed expectations
- provide reliability
- allow customization to adapt to user needs
- buy-in through steering committee
- get insights from user Champions
Building Design Systems That People Love (Clarity 2023)
Over two days, the Clarity 2023 design systems conference brought together presentations on a variety of topics, including why we should…
buff.ly
Great post on how to define your target #audience without just basic demographics: buff.ly/s3xEVQ2 by @asmartbear.com

Much more important aspects are:
- common problems
- buying constraints

Which you can get from customer interviews. Another overlooked aspect is motivations
Your target market isn't demographic
How to define your actual target market, which probably isn't traditional demographics and firmographics.
buff.ly
Interesting insight into #slack's #designOps team buff.ly/ZvDiGpx

They drive impact by focusing ruthlessly on company goals and making sure their programs scale beyond individual teams. I assume they have a good connection to leadership to pull this off and can make some tough calls on what to do.
How to Make a Big Impact with a Small Team: Design Ops at Slack • Slack Design
Design Operations is all about helping designers do the best work of their lives. Our job is to clear the path so designers can focus on what they do best: design. At many tech companies, you’ll find…
buff.ly
Design to avoid serial task switching buff.ly/w1VTlHn

Serial task switching significantly reduces efficiency, quality & cognitive well-being.
When designing products, reduce unnecessary task switching & rather promote focus and sustained attention. This yields better outcomes for your users.
Designing for Serial Task Switching
Serial task switching, or rapidly shifting attention between tasks, is a natural user behavior that lowers productivity and increases stress and the chance of errors.
buff.ly
Great point buff.ly/Pkq8rcR by @martinfowler.com on why expert generalists are an important part of any team.

Are you one? Key skills of expert generalists are:
- Curiosity
- Collaborativeness
- Customer Focus
- Fundamentals-Driven
- Sympathy for Adjacent Domains
- Blend of Depth and Breadth
Expert Generalists
Being an Expert Generalist should be treated as a first-class skill, one that can be assessed and taught.
buff.ly
How can a #designSystem up-level your companies design quality? Find out in my latest article: buff.ly/KFlL5C9

I discuss how to define goals that lead to higher design quality and how to evaluate your design system against those goals.
How can design systems up-level design quality?
Exploring the role of design systems in achieving high quality designs.
buff.ly
In buff.ly/tMSgiG7 @alexanderkondov.bsky.social states that pushing vibe code (in contrast to AI assisted code) is problematic because:

- it ignores existing code & team conventions
- makes understanding the code harder (maintenance)
- you did not consider possible current or future side-effects
I Know When You're Vibe Coding
I shouldn’t have to care about this. I don’t want to care about how someone’s code gets into the IDE. Whether you wrote it by hand, copied it from a forum…
buff.ly
Interesting insights into @HP 's effort to unify their icon system: buff.ly/P55VhlF

If this is something you are currently working on, there are definitely a few pointers you can take from their experience:
- audit & designer interviews
- lessons from the audit
- Icon style: unified but flexible
How to make a cohesive icon library
Part 1: The Journey to Icon Unification
buff.ly
Deviation from the #designSystem is not failure, it is a signal by @bencallahan.com
buff.ly/kcgfTrr

Takeaways:
- Many deviations in the same direction point to a gap in your system
- Use this to engage with users, listen & find the what & why
- partner up to resolve the gaps
Design System Deviation is a Signal - bencallahan.com
In a recent episode of The Question, Adrianne Daley and I invited the design system community to dig into one of those quiet-but-critical topics:
buff.ly
While #AI can increase productivity, it may have negative long term effects on an individual level: buff.ly/hDxqj2w

This MIT study shows that relying on LLMs for essay writing weaken brain connectivity, cognitive engagement, and long-term learning outcomes.
→ Use LLMs with caution
Your Brain on ChatGPT: Accumulation of Cognitive Debt when Using an AI Assistant for Essay Writing Task – MIT Media Lab
This study explores the neural and behavioral consequences of LLM-assisted essay writing. Participants were divided into three groups: LLM, Search Engine…
buff.ly
What impact does #AI have on #design and #language?

While AI makes it easier, especially for folks new to a field and overall increases productivity, the quality often declines.

Design and content become more generic, suffering from sameness and uncreative solutions.

AI is flattening language — and redistributing power
For a long time, “good writing” has been more than skill; it’s been a form of gatekeeping. Not anymore.
buff.ly
Visual #DesignSystem usage #audit: buff.ly/LnRiaS4 @tonyward.dev

Screenshots show the page & context a component is used.
Highlighting components tells a strong story: All red components are from the design system.

It's easy to see adoption gaps, inconsistencies & overrides.
A New Way to Audit Design System Usage - Tony Ward
Plug in to your existing end-to-end tests to audit Design System usage.
ilo.im
#DesignSystem #Component conformance with #wcag, is it possible?
buff.ly/BwaamLl

Conformance ensures that every component instance upholds the design system’s standards for accessibility, quality, and consistency—at scale and over time.
Can components conform to WCAG?
Here's why they technically can't, and why that makes sense to me.
buff.ly
A fantastic @figma.com #plugin for #designSystems buff.ly/NaZrtDy

You can scan one or all pages in your DS library to find missing doc links, descriptions & even better, values without assigned variables (#designTokens). In just 5 min I fix a bunch of missing tokens. 🔥
#AI is raising the floor, not ceiling according to buff.ly/k01z1fc

AI does not automate mastery, but democratizes basic competence.
In the long-term, shortcuts don’t produce real mastery. It's great to get up to speed with something, but from there it is up to you.
AI is a Floor Raiser, not a Ceiling Raiser - Elroy
An AI memory and reminder assistant
buff.ly
A very valuable perspective on #vibeCoding with #AI: ilo.im/165uaf by @val.town

In Short:
Vibe coding is creating bad code that no one understands. It is fine for prototypes (legacy code is only code that is maintained), but it is a very bad idea for real production code.
Vibe code is legacy code
Updates and articles from the Val Town team
ilo.im
Grug believe in "make → test → cry → fix", the ultimate design cycle: buff.ly/EoyhLS4

A fun little read about basics of good design. Also, a funny bot to chat about your design ideas with.
grug.design
The Grug Brained Designer
buff.ly
How do #AI #agents create a #ROI for you? Find out:
buff.ly/46oRtqU

TL;DR
- Labor efficiency: Cost savings and automation.
- Net-new revenue: Generating value from untapped opportunities.
- Optimization: Continuous, holistic business transformation.
henrypray.com
Personal website and blog of Henry Pray.
buff.ly
Learn how to create an #accessible #svg buff.ly/uoTEISr by @a11y-collective.com

Common Pitfalls:
- Missing / vague descriptions for informative graphics
- No ARIA roles or incorrect attribute use
- Relying on color as the only means of communication
- Interactive elements not keyboard accessible
Implementing Accessible SVG Elements
Master SVG accessibility: Learn techniques for ARIA roles, testing, and creating inclusive graphics that work for everyone.
buff.ly
#AI thoughts buff.ly/rsGGwli

AI has shifted us from "design to build" to "prototype to productize". Designers are now slower than eng and come into a live product to improve ux. On the positive this means we can build better product through rapid iteration of the actual product, with real data.
LukeW | AI Has Flipped Software Development
For years, it's been faster to create mockups and prototypes of software than to ship it to production. As a result, software design teams could stay "ahead" of...
lukew.com
#Content for fun vs. purpose must be created differently.

- Fun: Surprising, delightful, novel or playful interactions
- Purpose: Expected, clear, fast & straightforward interactions

Both content types could be in the same product, depending on the user intend.

buff.ly/x5NQuyq by @automattic.com
Content for fun vs. content for purpose: designing for two distinct modes of consumption
From AI assistants to digital platforms, how can we design for rapid mode switching in real life? Reflections about utilitarian and experiential content and why understanding both matters.
buff.ly