Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
What I've learned building automated docs for A...
Search
Ciro Nunes
January 14, 2019
Technology
0
68
What I've learned building automated docs for Ansarada's design system
Ciro Nunes
January 14, 2019
Tweet
Share
More Decks by Ciro Nunes
See All by Ciro Nunes
Rust Front-end with Yew
cironunes
0
50
Type safe CSS with Reason
cironunes
0
110
Beyond ng new
cironunes
2
200
Animate your Angular apps
cironunes
0
420
Sweet Angular, good forms never felt so good
cironunes
0
66
Sweet Angular, good forms never felt so good
cironunes
0
290
Progressive Angular apps
cironunes
3
900
Angular: Um framework. Mobile & desktop.
cironunes
1
590
Firebase & Angular
cironunes
0
290
Other Decks in Technology
See All in Technology
人工衛星のファームウェアをRustで書く理由
koba789
15
8.2k
大「個人開発サービス」時代に僕たちはどう生きるか
sotarok
20
10k
新アイテムをどう使っていくか?みんなであーだこーだ言ってみよう / 20250911-rpi-jam-tokyo
akkiesoft
0
310
Webアプリケーションにオブザーバビリティを実装するRust入門ガイド
nwiizo
7
860
スマートファクトリーの第一歩 〜AWSマネージドサービスで 実現する予知保全と生成AI活用まで
ganota
2
270
JTCにおける内製×スクラム開発への挑戦〜内製化率95%達成の舞台裏/JTC's challenge of in-house development with Scrum
aeonpeople
0
250
【NoMapsTECH 2025】AI Edge Computing Workshop
akit37
0
220
機械学習を扱うプラットフォーム開発と運用事例
lycorptech_jp
PRO
0
550
Firestore → Spanner 移行 を成功させた段階的移行プロセス
athug
1
490
EncryptedSharedPreferences が deprecated になっちゃった!どうしよう! / Oh no! EncryptedSharedPreferences has been deprecated! What should I do?
yanzm
0
470
【実演版】カンファレンス登壇者・スタッフにこそ知ってほしいマイクの使い方 / 大吉祥寺.pm 2025
arthur1
1
890
テストを軸にした生き残り術
kworkdev
PRO
0
210
Featured
See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Six Lessons from altMBA
skipperchong
28
4k
Visualization
eitanlees
148
16k
The World Runs on Bad Software
bkeepers
PRO
70
11k
Navigating Team Friction
lara
189
15k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
580
Product Roadmaps are Hard
iamctodd
PRO
54
11k
How to train your dragon (web standard)
notwaldorf
96
6.2k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
KATA
mclloyd
32
14k
Embracing the Ebb and Flow
colly
87
4.8k
Gamification - CAS2011
davidbonilla
81
5.4k
Transcript
What I’ve learned building automated docs for ACE Ciro Nunes
DesignOps wizard
@cironunesdev
Alex Leon The people involved Anthony Muscat Chantelle Staples
None
Agenda 1. A bit of history 2. The journey towards
automated docs 3. What we built so far 4. Takeaways and next steps
Ansarada Common Elements a.k.a ACE
39 Components and best practices
130 Design tokens
None
None
None
None
The process of creating and documenting components was completely manual,
time consuming and error prone
None
None
Challenges
Challenges • Keep it up-to-date • Save time • Avoid
errors • Make it fun
Challenges • Keep it up-to-date • Save time • Avoid
errors • Make it fun Remedies
Challenges • Keep it up-to-date • Save time • Avoid
errors • Make it fun Remedies • Automation ✓ Generate docs from code • Code snippets
We decided to rebuild our docs from scratch thinking in
automation from day one
The journey towards an automatically documented design system
The Orbit project (automated docs)
The Orbit project (automated docs) 1 Survey & Research
The Orbit project (automated docs) 1 Survey & Research 2
Workshop
The Orbit project (automated docs) 1 Survey & Research 2
Workshop 3 Planning
The Orbit project (automated docs) 1 Survey & Research 2
Workshop 3 Planning 4 Execution (design & code)
The Orbit project (automated docs) 1 Survey & Research 2
Workshop 3 Planning 4 Execution (design & code) 5 Release MVP, gather feedback & Iterate
1 . Survey & Research
None
None
None
None
None
None
None
None
None
None
2 . Workshop
None
3 . Planning
MVP
MVP 1. Generate docs from code
MVP 1. Generate docs from code 2. Use existing documentation
MVP 1. Generate docs from code 2. Use existing documentation
3. Improve the look and feel
None
4. Design & code
None
None
None
None
5. Release & feedback
None
None
What we built so far
Demo time!
What I’ve learned
Design systems are more than just reusable components
Code comments are documentation
Types are documentation too !
Markdown is perfect to write documentation "
Takeaways & next steps
Takeaways
Takeaways 1. Reuse existing tools
Takeaways 1. Reuse existing tools 2. Design systems are more
than just components
Ciro Nunes Writing docs is boring and keep them up-to-
date is hard, time consuming and error prone. Don’t write it, generate it!
Next steps
Next steps 1. Include design tokens (Sass docs)
Next steps 1. Include design tokens (Sass docs) 2. Polish
and implement new features
Next steps 1. Include design tokens (Sass docs) 2. Polish
and implement new features 3. Make it a framework
Next steps 1. Include design tokens (Sass docs) 2. Polish
and implement new features 3. Make it a framework 4. Open source it
None
None
None
None
@cironunesdev
What if I use Vue?
None