Nathan A Curtis
@nathanacurtis
Followers
14,337
Following
514
Media
1,420
Statuses
14,382
@eightshapes working design systems. Wrote @components , blogs. Sports: @arsenal ⚽️ , Cleveland 🏈⚾️🏀. Education: @virginia_tech , @uchicago math and statistics.
Fairfax, VA
Joined September 2007
Don't wanna be here?
Send us removal request.
Explore trending content on Musk Viewer
Ricardo
• 347463 Tweets
Mariana
• 294429 Tweets
Arath
• 249492 Tweets
連休明け
• 57353 Tweets
休み明け
• 55623 Tweets
大社高校
• 51014 Tweets
神村学園
• 31566 Tweets
小林鷹之氏
• 30913 Tweets
Happy New Week
• 19368 Tweets
京都国際
• 18181 Tweets
カミガタ
• 16834 Tweets
PRABOWOkerja UNTUKrakyat
• 16676 Tweets
Mildom
• 16250 Tweets
KOMPAKbersama BANGUNbangsa
• 15860 Tweets
セブン&アイ
• 14863 Tweets
大社の応援
• 12831 Tweets
コバホーク
• 12446 Tweets
買収提案
• 12278 Tweets
デビュー日
• 11334 Tweets
Pinned Tweet
Excited about incorporating
@figma
variables detection and display in EightShapes Specs anatomy, props and layout and spacing.
4
36
295
Getting close to
@figma
component spec plugin MVP feature complete, and ready for deeper testing and getting feedback from the community.
61
125
1K
Adventures in and reflections about refactoring Figma components based on
#config2022
updates. TL/DR: Better, but not yet near what I really need.
8
59
671
It’s released!
Getting close to
@figma
component spec plugin MVP feature complete, and ready for deeper testing and getting feedback from the community.
61
125
1K
28
78
601
I am a adorer of airport wayfinding when done designed well.
This, I just can’t. No. Just no.
49
21
586
Having implemented this component specs format across about 5 clients in 2 years, it's really time for a blog post. What I really want? Build a
@figma
widget/plugin for it. Sigh, just don't have the time.
10
31
505
Since the "Measuring design system success" cheatsheet I made is making the rounds, I'll add my basic narration included to introduce collaborators to it...
(1/12)
3
53
388
A style guide is an artifact of design process. A design system is a living, funded product with a roadmap & backlog, serving an ecosystem.
3
221
369
Daniel Craig stars in “No Time to Worry About Accessible Color Contrast”
8
45
363
How do you manage your Figma styles, components and other assets across 1+ libraries?
29
31
363
All my clients are struggling collectively, describing it as "Designers don't know how to use Figma Autolayout."
That's NOT the problem. The problem is that "Designers don't understand the box model and hierarchically nested layout techniques."
The problem is UI design craft.
33
26
290
Don't get me wrong. I 🧡
@figma
and value the experimentation they're doing to add more and more.
But I can sense it. It's happening. Their UI is "Adobe Creative Suite"ing. And that carries a usability cost.
16
5
282
The EightShapes Specs Figma Plugin:
How it works, and how to make it work for you
My latest on
@medium
.
10
35
258
So, I don't get it.
@figma
Dev Mode is adding a ton of changes, including enabling a designer to annotate a design. It's all very rich, live, and fancy. It would seem a direct substitute of my EightShapes Specs plugin.
But...it's not. At all.
Coming next week: New features in Dev Mode to bring design + dev closer.
Annotations (!!), improvements to diffing, plugins, and the VS Code extension.
What's shipping January 31 as Dev Mode moves out of free beta →
78
561
3K
20
15
252
So, it seems that Yahoo’s Design Pattern Library has been taken down. Moment of silence for that tremendously influential contribution.
7
75
248
Goodbye,
@eightshapes
.
We're closing, although I'll keep doing what I do under a different banner.
Read more...
46
8
243
Why do so many designers crafting UI have such a skill deficiency (inadequacy?) in layout mechanics like CSS box model and Figma Autolayout?
62
23
240
Good article with practical tips around creating a color language, by Brian Cleveland
2
31
231
I get asked enough "How do you use Jira for Design Systems?" that I've screenshotted a tutorial of it all. Is there interest in a Medium post about it?
32
14
224
“A design system is…”, still a bit complex yet slightly revised since last time…
7
63
204
Why bar charts are better than donut/pie charts:
1. What proportion is green or orange?
2. What are the top three bars?
3. Is red > purple?
4. Is red+green+purple > blue?
10
72
207
Getting close to done with my Naming Tokens in Design Systems post. The model to teach the concepts is just about final...
6
15
205
I sense a Medium article coming on. Something like...
Design Systems Should Enable, Not Govern
Don't be a Standards Team. Be a Tools Team that Applies and Amplifies Standards.
10
27
195
What do you call this UI component, where you'd increment / decrement a value within a configurable range?
193
6
190
Continuing to revamp my "Shared Libraries" content to describe responsibilities and models for community contribution to Figma libraries.
4
9
177
Been working to automate specs of Figma components for things like anatomy, props and spacing to start.
11
0
168
OMG,
@skougs
admits Atlassian's design system hasn't shipped a new component in 18 months. What the what? They've been focusing on other problems: doc, people, etc. That's BOLD! Design systems ≠ component library.
5
14
165
Continuing to test the
@EightShapes
Specs
@Figma
plugin against notable libraries in the community. Here,
@atlassiandesign
's Page Layout.
6
18
166
Finishing Friday with some visual refinements of the automated Anatomy and Props views of the Figma Specs plugin I've been working on. Feeling excited!
16
5
162
Available starting today, you can upgrade your use of the EightShapes Specs plugin to display Tokens Studio tokens within Anatomy, Props and Layout sections. Enjoy!
7
32
161
Looks like
@eightshapes
Visual Difference
@figma
plugin that
@kevinmpowell
and I made was approved!
You can use it to create snapshots of Figma objects to visually compare later as those objects change.
14
10
158
I had a very positive experience recalibrating my "ESDS" (EightShapes Design System) color system I use for public workshops using
@githubprimer
's Prism tool.
5
7
153
How teams I work with treat spec as an artifact informing ALL outputs across disciplines and tools. Output work often begins before Specs are done, but all use Spec as an artifact indicating sourc of truth.
3
13
145
As I prep conference talks, I'm revisiting my materials from last year, recalling the effort. Yet now it's a 1 second command to run the plugin and get something more detailed and accurate.
I still get excited every time I run it.
2
18
145
Hey design system pros: while I agree that Google Material, Atlassian, Spectrum, and Shopify Polaris are great examples, can you work harder when "auditing public DSs" for ideas?
Too many pros audit the same four or five, call it a day, and miss out on great stuff out there.
21
5
141
Although I've done 100s, there are some design system interview questions that I ask that still yield the best responses that I'm eager to hear. What are yours?
12
13
134
When building libraries for many platforms, handoffs across teams remain but developers lack tight relationships with designer(s) to understand requirements. Specs fill that void.
2
21
130
Just published a
@figma
Specs plugin version 2 enhancing some basics and fixing a few errors.
#nervous
Didn't realize the plugin is loaded into current file memory such that users must refresh the file to use the new plugin version.
#unexpected
5
17
131
Hey all you
@figma
autolayout nerds out there, wrapping is no joke. There's much to think about. Varying heights and widths, overflowing content, visual attributes outside boundaries...
6
7
130
Visual Breaking Change in Design Systems:
We Respect Code APIs. But What About Color, Type and Space?
My latest on
@medium
.
1
18
126
You know, for a field – Design Systems – dedicated to practices of shared vocabulary and naming things, we are laughably inconsistent and incapable to norm on basic terminology.
8
8
124
As Figma strengthens, design systems are sharing an API across design and dev.
To realize this, cross-disciplinary teams must identify what to include, when to fit API into a workflow, where to author together, and how to change together.
0
19
124
I'm all for collaboration and inclusiveness in design activities, and work hard to get everyone's voice heard. Yet, across all my roles: designer, architect, manager, leader, business owner, consultant, one reality remains true:
Design is not a democracy.
7
11
118
Oh my goodness let the requests fly! Fix YOUR defect. Add a feature I want. Help me. Train us. Review that we used the system correctly. Link our library. On and on and on.
It's time to invest in a support process that's not handwavingly trivial.
0
16
119
I think I could make a full day workshop on architecting UI component API (names, anatomy, props, layout composition, …).
And if I called it API it’d scare designers even though it’s a valuable skillset to have.
14
0
113
Ok, it's out there: EightShapes Specs plugin with a (for now, basic) UI to configure what sections are produced and to manage what's already there.
Hope this is another step forward preparing for more fun stuff, and that you find it valuable.🎉
5
13
115
Without a strong token foundation, objectives like dark mode, consistent API and multi-brand theming remain out of reach. Then
@figma
variables hit. A moment to reimagine your token taxonomy may be coming.
0
28
113
Component Specifications: What to include, where it goes, and why it matters more now
My latest on
@medium
to complement the community file we released and plugin that's described in a separate post.
1
14
113
Testing isn’t just create an instance, change a label, swap some properties, resize an edge, “Done!” Seriously, ten seconds and you release it?
This article digs into using visual test cases to validate a Figma component.
1
18
111
This cheatsheet of approaches to measure design system success has proven helpful to foster conversation and compare tradeoffs...
What metrics are you most proud of getting implemented in a design system? 🧐
Out amazing panel
@nathanacurtis
,
@himaya
&
@gabbyhon
are talking EVERYTHING
#DesignSystem
: Measurement in our
#zhwebinar
!
0
0
4
0
18
110
All that work to embed basic metadata and a pithy, Use When-ish introduction, yet now
@figma
truncates and puts that material in a Show More panel.🙁
8
6
110
Space in Design Systems, far and away the most popular thing I've written (140K views, 37K reads) is 3.5 yrs old, now wrong in places, and lacks 50%+ of what I coach on the topic. Time for a 2nd edition?
Like if interested, comment with requests.
8
3
105
Occassionally but increasingly I wonder "Is my
@figma
usage actually the product, such that over time my behaviors will be recorded and automated so as to eventually AI myself out of a job?"
This Figjam AI launch is just another small step...
9
12
106
[Must/Should/Could] a Product Adopt a System? Here's a handy guide...
0
24
101
Design Systems Architecture Diagrams:
A Visual Vocabulary to Relate Systems, Products & Brands
My latest on
@medium
:
2
18
104
Anyone else watching
@figma
's demo of typography variables and keep seeing
@brad_frost
when they show brand-font?
10
0
99
Did you know... the biggest value you get out of a design system's tokens isn't the tooling or actual variables, but the establishment of a recognized space in which style decisions are modeled and maintained?
1
21
97
Watching a
@shaunbent
talk
@intodsconf
, design system nerds take away details.
Me? "Oh, pretitle as an element / zone name where you could put an eyebrow OR badge is an interestingly flexible take!"
5
7
98
What UI component libraries published on the Figma community do you think are built with the highest level of quality?
I'm using many as test cases for my plugin, and I'm seeing... varying quality in labeling, construction, layout, etc. 👀
17
8
100
Getting excited yet anxious as the moment approaches (as soon as this weekend?) that launches the first paid feature of the Specs plugin: displaying applied Token Studio tokens.
6
16
98
How do you prefer to name your font size generic tokens?
41
5
97
The EightShapes Specs plugin now supports dark mode to invert your specs at the page, spec, and artwork levels.
0
7
96
This glimpse into the Atlassian Design System through an interview with
@jenniesyip
includes a treasure trove of ways to think about scaling and leading your system towards a brighter future.
1
7
96
"Adopting Design Systems: A Playbook for Working with Product Teams & Managers", my latest on
@medium
1
27
93
Design systems don't arise because there's a vacuum into which you inject UI components.
Design systems arise because many people making UI components together aren't making them sustainably at robust quality, and making the right components at the right sizes.
0
12
93
Wash, rinse, repeat: the toughest thing about design systems isn't "making it" (as in, component code, sketch files, etc). It's integrating into the design process and code stacks across those that adopt it. THAT's the system that's a challenge.
6
25
92
Subcomponents: Relinquish control, offer parts, and let implementers compose
My latest on
@medium
...
7
5
87
Starting to think about the ideal format – and, uggghhh, all the logic needed – to automate, suggest, and organize Accessibility specs using a plugin.
Hat tip to the
@w3c_wai
ARIA Authoring Practices Guide content, which I'd love to integrate.
3
7
90
Naming Tokens in Design Systems. Terms, Types, and Taxonomy to Describe… | by Nathan Curtis | EightShapes | Medium
1
10
88
I see you, oh naming taxonomy, founded upon a color system originating from
@MiroHQ
sticky note colors... 🤣 (left is Naming Tokens, right is Naming Components)
0
9
88
Having done the "Upgrade your (poorly architected) tokens to a robust, durable design token taxonomy" project three times in a year, I'm getting close to writing up my (now Airtable+Figjam infused) process of getting from as-is to to-be taxonomy.
4
4
85
My favorite industry book which set the course of my career. Thanks
@morville
and
@louisrosenfeld
!
#Clarity2021
4
6
87
It's been awhile...
Design Systems Support:
Operating a Workflow to Resolve Designer and Developer Needs
1
11
86
I'll admit my (very strongly opinionated) bias: I see design systems as the best bridge of design and front end engineering in the business. So I cringe when I see strong separation of design here, code there in doc. The narratives are threaded, not separate!
3
15
85
While I ❤️ dev mode, component playground shouldn't be buried there.
@figma
, all my current clients are building many-library ecosystems and discoverability / visibility is the MAIN problem to solve.
Here's all your existing bits that'd – if combined – would go a long way.
7
3
84
As I work on enhancing my plugin for wrapping autolayout, I'm a bit 😕 why
@figma
didn't incorporate the browser's longstanding box model color system.
I can easily understand a range of reasons why. I just like persisting the familiar meaning of orange, yellow, green and blue.
8
4
83
In helping design teams upgrade Figma files and libraries for variables over styles, I'm finding the problem isn't "What's detached where?" but instead "What attributes are overridden where?"
That's a different model that Figma doesn't track and is actually a bigger problem.
9
4
84
Really energized by research that's hopefully going to lead to writing and workshops on Architecting Components. Lots of thinking about choices we make to decide a component's composition and configuration.
2
12
85
Figma Shared Libraries:
Extend a design system with assets maintained by contributors
0
10
79
I've been working on the Specs plugin to add comparison features while (completely refactoring) the comparison engine overall.
I'm excited to be seeing 3x performance gains (15s -> 5s) on my longest running beast: Github Primer's Comment box.
Can't wait to get this out there!
2
8
82
Teams shouldn’t focus on building perfect design systems.
Teams should build design systems capable of change, always arcing towards perfect.
1
15
83
Talking a burgeoning design system doc site had me taking this snapshot to talk sections, labels, and ideas.
5
9
84
Just launched an EightShapes Specs plugin option for displaying anatomy specs in tabular format. It's available free during the beta period.
This hopefully unlocks other potential features in the future, too (props table, component metadata, ...).
1
12
84
I am 💛
@figma
's autolayout improvements, and know that more's to come I'm sure.
I also remain surprised at how long such specificity has been available in CSS (10 years? more?) and unavailable in design tools.
5
0
83
Listening to a
@dscc_tor
commenter refer to "options" and "decisions" tokens. I fear I am responsible for those terms even though I've long moved on to different terms like generic, semantic, and component-level tokens.
6
11
74
I pondered with
@danmall
earlier this week: if/when our tools (Figma, Storybook, etc) continue to improve, how much to separate design system documentation websites recede in importance?
Are we approaching a point where we manage content flowed into tools instead?
21
7
81
I am delighted, awkwardly, when I'm in a client call, another consultant presents the "Team Models" diagrams, and they haven't connected who I am to what that is.
I wonder if
@brad_frost
is ever in calls when people don't know who he is and start teaching Atomic Design.
6
0
80
Working on component specs templates for the Figma community file that will compliment the Specs Figma plugin.
Inspirations come from work with teammates and the
@WalterStephanie
blog. More to come!
3
5
81
Yesterday, a client was stuck on explicit levels of
@brad_frost
's excellent Atomic model. I encouraged them to go from explicitly:
"Is this a molecule or not?"
to:
"(Bigger) Components are made of elements. Many are nested (smaller) components, making a dependency tree."
2
11
79
Audi's done well using Storybook as a broader design system doc site (acknowledging they also have other brand/system sites too).
Do you know of other publicly visible design systems that broaden Storybook to be a doc site like this?
8
8
81
Finally, after nearly a year, I'm writing again, this time on Testing Figma Components. Component usability, in particular, is in the eye of the beholder. Feels good to get back to writing again.
3
2
81
Yesterday, I published Design Systems Support, finally!
2
9
80
Fact: Making a system is hard.
Fact: Sustaining a system is harder.
Fact: Shepherding an ecosystem through a generational (breaking) upgrade has proven the hardest and at times soul sucking experience.
@clarity_conf
5
9
79
Having been a component grouping skeptic for my whole design system life (I'm a "flat lister"), I found it interesting to compare component groups of
@adobe
's Spectrum and
@ShopifyUX
's Polaris.
5
11
79
Lesson learned the hard way: space ≠ size.
In CSS, space includes padding, margin, left, right, top and bottom; size is height, width, and their variants. Space leads to size and vice versa, but they aren't the same thing.
I am trying to create a space token for our design system, but I need help deciding which pattern to follow. Raw, Semantic, Component.
@disco_lu
@molly_hellmuth
@nathanacurtis
11
2
26
1
7
77
How is it 2023 and I'm making this slide distinguishing specifications (made for people MAKING a library) from docs / guidelines (made for people USING a library)?
1
8
76