Front-end web developers have a vast, amazing and constantly changing set of tools, approaches and frameworks available to them. Many therefore feel pressured to keep up with the latest and greatest. Are we all condemned to participate in this never-ending rat race though?

The world of web design and development often makes me think of time-lapse scenes from TV documentaries: Plants sprouting from the ground, growing up, flowering, wilting and crumbling back to the ground. Swarms of insects scurrying across the forest floor. Hundreds of people rushing across Tokyo’s Shibuya crossing when the lights turn green.

Everything is moving. Things…

Sometimes things seem complex in a design but turn out to be easy to implement in code. Other times, elements of a design that appear simple at first glance turn out to be very tricky to implement.

This is the story of one of the latter cases…

The challenge

A couple of years ago I was tasked with implementing a web page featuring an arrangement of images like this:

Much ink has been spilled about different approaches to styling UI elements on web pages and apps. The prevailing wisdom is for designers and developers to approach UI design and development in a modular way. While I wholeheartedly agree with this mindset (and have been advocating it for a long time), I fear that it is sometimes mistakenly used as an argument for avoiding one of CSS’s most powerful features: The cascade.

Modular UI code

In terms of ease of development and maintainability it makes a lot of sense to group the code that a UI component is comprised of. Typically that is…

To support the creation of our recently redesigned Buildit @ Wipro Digital website, we have also created a nascent design system and its name is Gravity.

This is the story of how Gravity came to be and where it is headed next.

The motivation

Buildit has had a website and a small number of internal web applications for some time. All of them had been designed and built independently and consequently looked and behaved quite differently from each other. …

If my full-fat post about Design System Architecture is too long for your taste (Medium estimates it’s a 12 minute read), then you might prefer this summarised version…

At Buildit we’ve done a fair amount of work on design systems. We’ve noticed certain types of tools and integrations between them recur and figured it would be useful to call them out.

This is the overall architecture for a design system’s infrastructure that we’ve observed and used. Not every design system will contain all of these parts. However, the ones they do have will likely be connected in the same way.

UI Library

…

This ended up being a lengthy post. If you’re in a hurry you can check out the TL;DR version to get the gist of it and come back to this one later.

I recently attended WEBdeLDN’s “The Evolution of Design Systems” meet-up (great event, btw!), where I was fascinated by Alla Kholmatova’s talk. Having worked on and researched numerous design systems, she’s identified three dimensions, against which design systems can be analysed and compared: Strictness, modularity and centralisation.

I won’t delve into that particular topic today (but, if you’re curious, she’s working on a book about design systems, so keep…

Now that my clickbaity headline got your attention, I should qualify my inflammatory statement a little: “WYSIWYG (What You See Is What You Get) in the context of producing interactive user interfaces Must Die”.

Pixel Perfect Dreams

The idea that you could visually design your app or website in a tool and then, at the click of a button, have it export a fully functional, interactive user interface (UI) is a seductive one. Why wouldn’t you want that? Non-technical people could create simple apps by themselves without ever needing to write a line of code. …

I recently got a Samsung Gear 360 on loan courtesy of The Insiders. It’s a camera that can record 360º photos (up to 30 megapixels) and 360º videos (up to 4k 30fps). When viewed via appropriate software or online services, you can interactively pan around the photos or videos in all directions to observe the scene as though you were where the camera was. This is especially impressive and immersive, when you view them via a VR headset like Google Cardboard.

The camera’s official price is currently £349 in the UK. However, if you shop around you can find it…