#DesignSystems #DesignTokens #UX #accessibility
💭 writing http://medium.com/@lukasoppermann
☕️ coffee lover
🐥 dad
(he/him)
#AI reshapes tools & mental models involved in coding, nudging the industry toward valuing clarity of requirements, high-quality tests, and careful review over manual code authorship.
True or do we shoot us in our own foot?
#AI reshapes tools & mental models involved in coding, nudging the industry toward valuing clarity of requirements, high-quality tests, and careful review over manual code authorship.
True or do we shoot us in our own foot?
Involving all disciplines into #DesignSystem #docs avoids misalignment and creates buy-in for docs.
Involving all disciplines into #DesignSystem #docs avoids misalignment and creates buy-in for docs.
Build for YOUR needs and size.
Build for YOUR needs and size.
Some important thoughts:
- risk: irrelevance > tech debt
- good enough ≠ sloppy
- tech debt = trade-off for faster learning
- Never ship code that is insecure, could lose user data, is broken
- Shipping fast → options: pivot on real feedback
- Refactor once you hit market-fit
Some important thoughts:
- risk: irrelevance > tech debt
- good enough ≠ sloppy
- tech debt = trade-off for faster learning
- Never ship code that is insecure, could lose user data, is broken
- Shipping fast → options: pivot on real feedback
- Refactor once you hit market-fit
@phirephoenix.com argues for it in her post: buff.ly/ImPkFu9
The final argument: friction, between people and ideas, is what sustains democracy, creativity & empathy.
@phirephoenix.com argues for it in her post: buff.ly/ImPkFu9
The final argument: friction, between people and ideas, is what sustains democracy, creativity & empathy.
With #AI agents engineers get working features out a lot faster. Often before we can define the #UX. But instead of complaining, embraced this. We can play with a working feature to explore how to optimize the UX for it.
With #AI agents engineers get working features out a lot faster. Often before we can define the #UX. But instead of complaining, embraced this. We can play with a working feature to explore how to optimize the UX for it.
I have noticed some of those and other issues on mac as well.
I am very surprised by the decline in quality at #apple. They used to be the #UX pinnacle and now they seem to overfocus on style. Any idea why?
I have noticed some of those and other issues on mac as well.
I am very surprised by the decline in quality at #apple. They used to be the #UX pinnacle and now they seem to overfocus on style. Any idea why?
Karan Sharma now approaches this idea in combination with #AI buff.ly/t8Mg9K3 which opens it up to a larger audience without prior coding knowledge. It's a great way to get into AI too.
Karan Sharma now approaches this idea in combination with #AI buff.ly/t8Mg9K3 which opens it up to a larger audience without prior coding knowledge. It's a great way to get into AI too.
Haven't tried it. But it sounds interesting, especially that it is built with w3c tokens as the one and only input. I guess it all is up to how easy it is to build plugins and if you can easily get to all parts in the built process. WDYT?
Haven't tried it. But it sounds interesting, especially that it is built with w3c tokens as the one and only input. I guess it all is up to how easy it is to build plugins and if you can easily get to all parts in the built process. WDYT?
This is a very important step for the community as it means tools can now work against a standard. I expect a lot of the existing tools to be updated soon.
This is a very important step for the community as it means tools can now work against a standard. I expect a lot of the existing tools to be updated soon.
The performance impact is neglectable in most cases, and the result is fantastic. Using css variables reduces file size and makes it easier to reuse your spring animations
The performance impact is neglectable in most cases, and the result is fantastic. Using css variables reduces file size and makes it easier to reuse your spring animations
buff.ly/6wdXnPN
Last year I did a whole day #designToken workshop @hatch and multi-brand was a big part and such a pain. Happy to see it solved (hopefully).
Going to explore it now.
buff.ly/6wdXnPN
Last year I did a whole day #designToken workshop @hatch and multi-brand was a big part and such a pain. Happy to see it solved (hopefully).
Going to explore it now.
Especially product icons, which need to without a label, e.g. in the dock.
They must be recognizable, feel like being part of a set but still different enough so users understand which specific product it is.
Especially product icons, which need to without a label, e.g. in the dock.
They must be recognizable, feel like being part of a set but still different enough so users understand which specific product it is.
Great filters empower users, reduce frustration, and boost the usability. Bad filters lead to frustration & churn
Great filters:
- prevent errors
- allow sharing a filtered states
- are easy to find and use
Great filters empower users, reduce frustration, and boost the usability. Bad filters lead to frustration & churn
Great filters:
- prevent errors
- allow sharing a filtered states
- are easy to find and use
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.
- 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
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
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.
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.
- #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
> 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
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
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.
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.