The UI Engineering Playbook: Modern CSS, Design Systems, Motion & AI-Assisted Workflows

UI Engineering has completely changed in 2026, and this Workshop is designed to teach everything required for creating the best interfaces. We dive deep into CSS fundamentals, Design Systems, Component Structuring, Accessibility, Motion and AI Assisted Workflows required to build the Complete Frontend of your Production.

Key Takeaways

1] Browser Layout & CSS Mental Model 2] How to decide Flex or Grid? 3] What are Design Systems & why do you need one? 4] Easy Approach to make “Pixel Perfect” Designs ( with live Demo ) 5] Animations as State Transitions 6] Debunking SVGs 7] How to Structure your Components: Decoupling UI & Data layer with Liskov substitution principle 8] Accessibility 101: A Simplified approach 9] Guidelines which enable devs to have better design sense 10] AI Assisted Workflows to let AI write consistent, pixel perfect maintainable UI Code

A 30 minute draft version of this talk was presented on React Bangalore Meetup in January 2026. The final workshop will be refined based on the feedback of 30+ developers present there.

https://streamyard.com/9x5zt4ec8id367s7?t=56