Why and how to design with code instead of Figma

Here's the why: to develop the product, rather than its image.

When we draw layouts (even when the smartest designers draw the most thorough layouts) we only control their appearance. The problem is

digital product design is primarily a design of user experience,

and when the design process relies on drawing pictures, the most important things end up being in the blind spot.

So what

But the main job is not done! Everything seems clear on the layout, but the interaction is half-baked: once imagined, presented with a skin-deep description, and totally forgotten❿ at some points.

Is this a big problem?

Not always. For example, the danger may be waiting for you in project planning: it seems that the user interface was “designed and there is only a bit of layout building”, but in reality it is drawn and its convenience is only a hypothesis.

It also becomes apparent that the design turns out to be overdecorated because of the layouts-focused process. For example, when a client or a team don’t like minimalism, they want authenticity and some sort of getting high from the design, and this “high” is just added to it — instead of manifesting itself in interaction.

But the main problem is the missed opportunities. Working directly with the product you can make it much more interesting!

So what are we going to do

Go and craft the product.

Of course, not everything is a piece of cake. There are complex interfaces, namely online banking or map services. With these, the importance of user experience and the unimportance of layouts for all participants are more or less obvious, but "crafting" such products is a rocket science. You need cross-functional teams that are able to work rubbing shoulders: start with specifications and backend, engage the frontend as soon as possible, draw layouts but not in too much detail, change the design directly in product code, and do everything together at the same time. That's not what my course is about.❿

And there are plain pages with text and pictures. In this case — surprise! — interaction design is also necessary. Because even the simplest page is not just observed by the readers inactively: they scroll up and down, see the fragments of the site through the browser window, poke at the navigation, and interact with elements. It does not matter whether it has web forms, filters and all sorts of web components: in any case, the main thing is how the page behaves, what it feels to the touch. And such a page is relatively simple to craft: open the code editor and write the code. But you need to know some basics.

That's what my course all about:

• it tells you the most important things about HTML;
• doesn’t waste time on banal stuff that can be googled instantly;
• is suitable for people with zero experience, but not too annoying for people with experience above zero.