https://github.com/willklein/design-system-success
A talk for WeyWeyWeb and React Day Berlin 2024
https://github.com/willklein/design-system-success
Last synced: 4 months ago
JSON representation
A talk for WeyWeyWeb and React Day Berlin 2024
- Host: GitHub
- URL: https://github.com/willklein/design-system-success
- Owner: willklein
- Created: 2024-11-04T19:17:18.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-12-12T23:55:03.000Z (over 1 year ago)
- Last Synced: 2025-04-19T02:13:49.599Z (about 1 year ago)
- Language: Vue
- Homepage: https://willklein.github.io/design-system-success/
- Size: 49.5 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Welcome to [Slidev](https://github.com/slidevjs/slidev)!
To start the slide show:
- `npm install`
- `npm run dev`
- visit
Edit the [slides.md](./slides.md) to see the changes.
Learn more about Slidev at the [documentation](https://sli.dev/).
## dev process
- draft out all slides - plain text
- introduce images/gifs that pair well with certain points
- introduce colors/fonts
- introduce layouts
- publish to website
- story: product dev that didn't use the design system
- talking points:
awareness -> advocacy: build a community, host office hours, demos, a Slack channel
adoption: measure adoption, show what's possible (compound components)
staying current: invest in upgrade guides & code mods - make it easy
## slides
- how i totally ignored the design system
- it's not the design
- it's not the code
- shocking (gif): it's sales, marketing, and support - maybe image of design/engineering being different departments, animate bringing them into the design/dev overlap area which is design system
- btw, this lesson applies beyond design systems: platform engineering, anytime your code/design is consumed by other developers/designers, even developer relations... which btw....
- how i infiltrated the design system - jump to june 2020, my second referall to the team had started, and i was burned out....
- i have no idea what i'm doing, so let's experiment
- everything i did was an experiment, but looking back, a strategy emerge
- office hours: sign ups / open hang out, topics
- tactical comms: timing, no notifications, brevity, details in thread
- joint design/developer comms: slack, release notes, demos
- upgrades - neo slide?
- maybe the biggest place you can lose, but the easiest to turn around
- the react upgrades
- slide design:
- try a visual theme with light, dark, and layouts
## layouts
- full slide image -> darken image and add text with striking font
- 1v2 or 2v1 ration slide color/image vs column of text
- 50/50 vertical split with color/image and graphic (2-3 pane)
- try a footer, add name watermark, introduce personal colors? or rebeccapurple and a lime green that matches via color tool