Виталий, круто. Спасибо за этот воркшоп!

the king! just wear good headphones and the sound is fine.

my two favourite front-end persons 🙂

This video came out in 2020 (not 2023).. how have things changed since then Brad?? what would do differently now?

Hi Vitaly, I’ve been reading your newsletter for years, it’s one of the few newsletters I read EVERY time. And today I discovered your channel, equally excellent. Thank you for your generosity and insightful content.

Great lesson🎉

josh my css messaiah

Who is image on your shirt? Reminds me of Nenad Bach musician?

Love the "potions" detail on the tips/practices. That's a fun spin on the light/dark pattern topic. Bravo 👏👏👏

Дякую Віталію, чудовий матеріал, отримав декілька інсайтів для своїх проектів.

Great topic! Regarding the point about the randomization at the 4:33 mark, its purpose isn't to stop brute force attacks. Instead, it's designed to stop people from memorizing the pattern you enter. However, I agree with the point that making the process too difficult for users can lead them to find workarounds to simplify usage, such as shortening their passwords or disabling the access code altogether.

Fantastic as usual.

Is it somehow possible to get access to this google document even though I was not at the actual workshop?

Thank you, Vitaliy!

Wonderful

Thank you, Vitaly for this interesting topic. Is really useful and opens so many questions... But one is still running on my head... Why Ikea removed the mapping prices to the paginations? (1:02:36) ...

Great presentation, a lot of useful patterns and food for thought!

Very interesting. I am a UX designer passionate about sustainable designs and this is very insightful. Thank you for doing this!

IA writer is a brilliant app. Now listening to Oliver, his background in philosophy, experiences and perspectives makes sense, why IA is the way it is. Thanks 🙏

Love it! But I just can't get the demo to work properly. I use the components in the figma file and the Doc linked in it - it will update pictures and show/hide things like the 'Open to Work' badge, but it won't change the texts (Names, Subtitle...)?

i hope you create more interesting and educational videos ❤ 😊

Great video :)

nice sound

finally JOSH

Can't hear the audio.

Can't hear the audio on this one.

Love this! Eye opening and give me a lot of ways to think how to make more responsive and automated designs without extensive coding.

why is the sound soo bad on these videos?

why is the sound soo bad??

Learned so much so quickly, not only in one video, but in a way that I understand all of it. Thanks!

I loved this talk by Maggie Appleton! She explained what LMs are in a clear and simple way, and her exploration of the tension between squish and structure was brilliant.

Omg useful tips and convinced researching 🎉🎉🎉

What a wonderful conversation. And it sparks 20 more!

0:00 A design system is like wellness in a post-covid world 2:48 What is a design system? 3:35 Flexibility aspect of a design system shown using Code Nast brand interface inventory 5:48 What is a button, really? The skeleton of a button. 7:12 Demo: themeable buttons 7:52 Demo: themeable kicker with real content 8:48 Themeable design system can support... 10:01 How to do this?; What we're used to, and the problem with what we're used to. 11:35 Design tokens intro; Design tokens in the context of multiple platforms, products, etc. 13:30 Design tokens properties ## A THREE-TIERED TOKEN SYSTEM 19:23 Summary of the token system ### TIER 1 14:40 Tier 1 Tokens: Definitions (raw ingredients) 15:38 Tier 1 Tokens from typography standpoint ### TIER 2 16:14 Tier 2 Tokens: Semantic Usage (middle/semantic/usage/theme layer) 17:25 Tier 2 Tokens: Semantic Typography ### TIER 3 18:04 Tier 3 Tokens: Design System component variables --- 20:00 Component library stays stable - overview 20:45 Component library stays stable - examples ## TOOLS 21:25 In Figma: Theemo; Themer 23:14 In code: Salesforce's Theo; Amazon's Style Dictionary 23:33 What do these tools do? ## DEMO TIME 28:00 Demo time (Storybook) 28:28 Code editor view 30:45 Summary 31:09 Code editor tour 31:45 Badge component example 32:26 Where does the magic happen?; Tier 1 tokens colors.json overview 33:30 Tool to inspect the token definitions 34:37 Naming conventions for Tier 1 typography presets 35:15 Tier 2 with e.g. supporting marketing subsites needs 36:49 Tier 2 Tools in a toolshed analogy 38:12 Tier 1 typography presets, Tier 2 typography presets peek; 39:47 Tier 2 color tokens --- 41:15 Wrapping up 42:35 Design tokens resource 42:53 The promise of design systems 43:37 When you're finished changing, you're finished. ## QUESTIONS 45:47 Question 1: is there a right or wrong time for a DS to be introduced? 48:27 Question 2: is it a technical or a human problem to let brands feel like they can express themslves?

really great speech! 👏

Wow, i totally forgot about the Css Zen garden

Yey thanks for uploading this session.

Christine is a mad genius. Adobe should be paying her just for existing.

This is awesome!!!

This is awesome!!!

Just wow!

Great conversation. I really wish I had Chris' articulation skills when discussing these topics, and trying to justify my usage of vanilla JS as a progressive enhancement. I end up tying myself in knots!

How did you get the circle mouse interface at 14:58. I would like to make a demo of a application and would really really like to know how you did that?

👏👏👏

I thought I could have this as background noise, but this is a goldmine from the get-go. Didn't think I'd be taking notes. I have stuff to do, but this is so condensed that I find myself at minute 15 without noticing. What a goldmine, truly. Great work molly!!

this is sinceriously so helpful for conviction when designing. you're a great example! thank you !

In a world with so many distractions - Slack, email, texts, phone calls, etc - Vitaly's delivery of his lessons really helps me stay focused and enjoy learning while tuning out all the other noise.

This was so good. Thank you.

Thank you, Vitaly! I found this video very useful and learned some new things. What would be your suggestion for a web shop that considers purchasing power parity?