Fluent 2: Designing Teams apps that seamlessly integrate experiences across

on YouTube ↗24m

" summary

Fluent 2 delivers concrete tooling: design tokens for color, spacing, type, elevation and radius with global and alias layers, a 16-slot brand ramp that updates interactive states across light/dark themes, and UI libraries (WinUI, iOS, web, React) where Fluent UI React v9 renders up to 6x faster and cold-stage load drops ~1.5s. Typography snaps to a 4px grid, components ship accessible by default, and a single token override changes border radius and fonts app-wide.

AI-written summary · about

" chapters (7)

1. 0:00Introduction to Fluent 2
2. 2:57Why use Fluent 2
3. 6:54Teams case study
4. 9:33What is new in Fluent 2
5. 11:20Design tokens and updates
6. 14:38Fluent 2 demo
7. 21:43Future updates and resources

" related talks

• 45mFluent Design: Designing for the FutureVictor Boquet, Benjamin Launay · DevFest Nantes 2017
• 18mFlutter DesignWill Larche, Guido Rosso · Flutter Live 2018
• 27mAccelerating Development using UI frameworksPatrick Mooney · UXDX Community Amsterdam 2019
• 30mCommunicating design systemsViktoriia Nikitina · Config Europe 2020
• 35mHabits for building a scalable UIYuval Bar Levi · code.talks 2022
• 55mFrom Design to Swift: Best Practices in App Development - ROUNDTABLEShai Mishali, Zamzam Farzamipooya, Hidde van der Ploeg, Firas Safa, Valeria Farina, Stefano Mondino · Swift Heroes 2023
• 27mAdvanced Design System ConsiderationsAlex Sexton · JSConf Hawaiʻi 2020
• 38mMastering the art of crafting code-aligned UI kitsJan Toman · Schema 2021