There is an accompanying quick story to this article discussing how interactive web shifted the focus from humans to machines. I hope you'll enjoy it.
This twin article is highly technical about the same story: how we've got from monoliths to components, to the new paradigm of app / web / development / design which already dominate the edge of the industry.
Interactivity, scalability and designer-developer communication are the main reasons. Let's see them.
Web 2.0 introduced commenting and sharing which led to the rise of REST and MVC frameworks. New ways to interact with the server and new ways to interact with users.
Down to web components3, a bottom-up, minimalist, standardized approach which reacts easily to changes either coming from the user interaction or from inside, from business requirements.
Since inception nobody at the World Wide Web Consortium dealt with the problems of CSS at scale4. In this wilderness came some fine folks form around the world and gave us BEM, Atomic Design, CSS in JS. Or Interoperable CSS5 from where CSS Modules were born.
The funny should designers code? pseudo-debate — with 17,900,000 Google search results today — led surprisingly to a very pleasant outcome: Styleguides a.k.a. Design systems.
I've been using them since their inception6 and I can see the benefit: perfect designer ←→ developer communication.
Design systems7 are a set of visual, interactive components created by designers to be translated one-to-one to web components by developers. They are the first real bridge between design and development. They've replaced Photoshop comps as web apps replaced web sites.
Design systems break monolithic user interfaces delivered by designers as large image blocks into small reusable components which developers can easily adapt to mobile and web platforms. As the problem is divided into small parts the reasoning and communication about is more straightforward.
What works so well in front-end development now is part also of the design. Interactive user interfaces decomposed not just web technologies but design thinking and frameworks.
Today the dice rolls around components and modules. Everything is built bottom up with interactivity, accessibility, interoperability and scalability in mind.
A typical workflow follows:
We can say a new era has begun. Development is more abstracted and better integrated with design. Everything is decomposed into small parts to make change immediate. The difference between elegant native and clumsy web interactions are disappearing.
We can put the web problem behind and focus on new challenges brought to us by the new realities: virtual, augmented and machine.