Lukas Oppermann
@lukasoppermann.com
Design @Github / opinions are my own
#DesignSystems #DesignTokens #UX #accessibility
💭 writing http://medium.com/@lukasoppermann
☕️ coffee lover
🐥 dad
(he/him)
#DesignSystems #DesignTokens #UX #accessibility
💭 writing http://medium.com/@lukasoppermann
☕️ coffee lover
🐥 dad
(he/him)
Interesting and rarely discussed: designing for #ADHS buff.ly/GFmwbDn
ADHD often includes forgetfulness, impulsivity, distractibility, hyperactivity, time-blindness, and sensitivity to sensory overload.
Empathetic, flexible design can mitigates ADHD-related challenges.
ADHD often includes forgetfulness, impulsivity, distractibility, hyperactivity, time-blindness, and sensitivity to sensory overload.
Empathetic, flexible design can mitigates ADHD-related challenges.
Software accessibility for users with Attention Deficit Disorder (ADHD)
Let’s focus on cognitive accessibility of digital products and how to make them better for users with ADHD.
buff.ly
November 12, 2025 at 5:26 PM
Interesting and rarely discussed: designing for #ADHS buff.ly/GFmwbDn
ADHD often includes forgetfulness, impulsivity, distractibility, hyperactivity, time-blindness, and sensitivity to sensory overload.
Empathetic, flexible design can mitigates ADHD-related challenges.
ADHD often includes forgetfulness, impulsivity, distractibility, hyperactivity, time-blindness, and sensitivity to sensory overload.
Empathetic, flexible design can mitigates ADHD-related challenges.
Some non-typical #designPrinciples buff.ly/1WuvsKl
- Ensure Easy Access: Clear, predictable home link & simple URLs
- Communicate Who You Are: prominent logo
- Reveal Content Through Examples: important offerings above the fold,
- Prompt Actions & Navigation: clear, descriptive, & prominent CTAs
- Ensure Easy Access: Clear, predictable home link & simple URLs
- Communicate Who You Are: prominent logo
- Reveal Content Through Examples: important offerings above the fold,
- Prompt Actions & Navigation: clear, descriptive, & prominent CTAs
Homepage Design: 5 Fundamental Principles
Effective homepages are simple and easy to access, communicate the organization’s and site’s purpose, show engaging content, and prompt users to take action.
buff.ly
November 10, 2025 at 5:33 PM
Some non-typical #designPrinciples buff.ly/1WuvsKl
- Ensure Easy Access: Clear, predictable home link & simple URLs
- Communicate Who You Are: prominent logo
- Reveal Content Through Examples: important offerings above the fold,
- Prompt Actions & Navigation: clear, descriptive, & prominent CTAs
- Ensure Easy Access: Clear, predictable home link & simple URLs
- Communicate Who You Are: prominent logo
- Reveal Content Through Examples: important offerings above the fold,
- Prompt Actions & Navigation: clear, descriptive, & prominent CTAs
I stumbled upon this buff.ly/Qm3bbgZ by @fabriciot.bsky.social again and it resonated a lot.
Principles for building better products:
- Less, but better
- Start small
- Use data
- Feature budget: Limit total # of features
- Say no: Decline non-essential features
- regularly reassess your product
Principles for building better products:
- Less, but better
- Start small
- Use data
- Feature budget: Limit total # of features
- Say no: Decline non-essential features
- regularly reassess your product
Great products do less, but better
When feature bloat can hurt more than help your business goals.
buff.ly
November 7, 2025 at 5:45 PM
I stumbled upon this buff.ly/Qm3bbgZ by @fabriciot.bsky.social again and it resonated a lot.
Principles for building better products:
- Less, but better
- Start small
- Use data
- Feature budget: Limit total # of features
- Say no: Decline non-essential features
- regularly reassess your product
Principles for building better products:
- Less, but better
- Start small
- Use data
- Feature budget: Limit total # of features
- Say no: Decline non-essential features
- regularly reassess your product
#AI & #vibeCoding is often not perfect. Shipping AI work to production is risky. But that is not the same for personal tools. In my article buff.ly/wr3Ppnn I describe how you can explore coding with AI by creating tools that make your live easier by doing mundane, repetitive tasks for you.
Medium
buff.ly
November 5, 2025 at 5:26 PM
#AI & #vibeCoding is often not perfect. Shipping AI work to production is risky. But that is not the same for personal tools. In my article buff.ly/wr3Ppnn I describe how you can explore coding with AI by creating tools that make your live easier by doing mundane, repetitive tasks for you.
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.
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
November 3, 2025 at 5:33 PM
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.
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.
I started working on an #AI project, so this comes just in time by @smashingmagazine.com buff.ly/qSqSzSL
AI must
- show ability to accurately perform tasks
- gain trust by operating transparently
- generate predictable output
You should communicate limitations of AI to users.
AI must
- show ability to accurately perform tasks
- gain trust by operating transparently
- generate predictable output
You should communicate limitations of AI to users.
The Psychology Of Trust In AI: A Guide To Measuring And Designing For User Confidence — Smashing Magazine
With digital products moving to incorporate generative and agentic AI at an increasingly frequent rate, trust has become the invisible user interface. When it works, interactions feel seamless. When…
buff.ly
October 31, 2025 at 4:45 PM
I started working on an #AI project, so this comes just in time by @smashingmagazine.com buff.ly/qSqSzSL
AI must
- show ability to accurately perform tasks
- gain trust by operating transparently
- generate predictable output
You should communicate limitations of AI to users.
AI must
- show ability to accurately perform tasks
- gain trust by operating transparently
- generate predictable output
You should communicate limitations of AI to users.
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
- #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
October 29, 2025 at 4:26 PM
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
- #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
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
> 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
October 27, 2025 at 4:33 PM
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
> 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
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
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
October 24, 2025 at 4:45 PM
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
Much more important aspects are:
- common problems
- buying constraints
Which you can get from customer interviews. Another overlooked aspect is motivations
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.
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
October 22, 2025 at 4:26 PM
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.
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.
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.
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
October 20, 2025 at 5:12 PM
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.
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.
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
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
October 17, 2025 at 4:45 PM
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
Are you one? Key skills of expert generalists are:
- Curiosity
- Collaborativeness
- Customer Focus
- Fundamentals-Driven
- Sympathy for Adjacent Domains
- Blend of Depth and Breadth
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.
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
October 15, 2025 at 4:26 PM
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.
I discuss how to define goals that lead to higher design quality and how to evaluate your design system against those goals.
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
- 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
October 13, 2025 at 4:47 PM
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
- it ignores existing code & team conventions
- makes understanding the code harder (maintenance)
- you did not consider possible current or future side-effects
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
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
October 10, 2025 at 4:45 PM
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
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
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
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
October 8, 2025 at 4:26 PM
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
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
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
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
October 6, 2025 at 4:33 PM
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
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
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.
→
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
October 3, 2025 at 4:45 PM
The #EAA makes #accessiblility a legal requirement for digital products and services.
Your #DesignSystem plays a major role in assuring your products can be accessible by June 2025.
Find out about the requirements and how to address them with you DS:
Your #DesignSystem plays a major role in assuring your products can be accessible by June 2025.
Find out about the requirements and how to address them with you DS:
What's the European Accessibility Act got to do with my design system?
Not sure how the European Accessibility Act (EAA) impacts your design system? This guide explains who’s affected, what compliance involves, and how to make your system more accessible, even if you’re…
buff.ly
October 1, 2025 at 4:26 PM
The #EAA makes #accessiblility a legal requirement for digital products and services.
Your #DesignSystem plays a major role in assuring your products can be accessible by June 2025.
Find out about the requirements and how to address them with you DS:
Your #DesignSystem plays a major role in assuring your products can be accessible by June 2025.
Find out about the requirements and how to address them with you DS:
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.
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
September 29, 2025 at 4:33 PM
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.
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.
#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.
→ 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
September 26, 2025 at 4:45 PM
#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.
→ 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.
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. 🔥
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. 🔥
September 24, 2025 at 4:26 PM
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. 🔥
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 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
September 22, 2025 at 4:33 PM
#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 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.
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.
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
September 19, 2025 at 4:45 PM
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.
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.
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.
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
September 17, 2025 at 4:26 PM
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.
A fun little read about basics of good design. Also, a funny bot to chat about your design ideas with.