I’m a french frontend developer with a graphic designer background. I recently had a new goal, filling the gap between designers and developers and create interfaces as a team. With this article, I want to share the best way I found to create a design system.

An example of an interface with some guidelines

When I started writing this article I asked myself “Where to start?”. It could be obvious for some of you but this should be the first thing we need to think about when we engage in any new project. It’s healthy to ask ourselves the most basic questions.

By definition, a design system is…

Source : https://cets.georgetown.edu

First of all, I must explain the context. Last year I was in a modern training in France. Now we can learn how to manage web projects, and I was curious, me, a front-end developper. So I tried.

In this training I was in school every 4 weeks. The rest of the time I worked in a company as a Front-end web Integrator.

The purpose of the training

The different themes are :

  • Knowledge of the web world. Yes, it’s the main goal but contrary to our belief, all young people are not familiar with the web. Most of them are just good to post…

Why I asked me this question? I think it’s because sometimes I see my own code and I swear a lot. Or it’s because some people don’t care about their style and I swear too. But I love styling things and I decided to clean up my styles.

It’s my way to organize my properties to get cool, clean and readable stylesheets. I think I’m not the only one who cares about this and this is why I’m sharing it right now.

First I made a list of properties and I’ve sorted them by type and by importance. …

For many years now the world have the chance to see same content on different devices. And unfortunately for most of the people those devices became units of mesure.

Why my Ipad mini gets a better look than my laptop on this website? My laptop is larger, I don’t understand.

People think about the size of their devices and not their resolution. But the design of a website is not based on device but on resolution!

It’s our fault. Or at least the fault of these pictograms :

Yann Isabel

Passionate about Design Systems, Frontend Developer https://yannisabel.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store