kamleshchandnani

Is it too early to build a Design System?

The Start

This is an interesting question and a very common question that all of us have. That's also because we are part of the industry or better way to put it is culture where things move at fast pace and everyone is just hustling and build products at a rocket speed. It's fine there's nothing against it. But there are certain principles that remains constant regardless of the speed we are building products. One such thing is Design System

Let's go one step backward from where we started and break them in sequence of events

• We start with the idea of building an amazing and beautiful product
• We start putting down our thoughts about our product by defining the flows a.k.a defining the User experience of our product.
• Until now things were just black and white so to add some charm to our product what we do next is we start by defining some colors for our product which also help us think about brand colors so people can relate to our product instantly.

kamleshchandnani

// File log.js
(function (global, factory) {
  if (typeof define === "function" && define.amd) {
    define(["exports"], factory);
  } else if (typeof exports !== "undefined") {
    factory(exports);
  } else {
    var mod = {
      exports: {}
    };

kamleshchandnani

Bundling Design Systems/Component Libraries

First of all you need to decide who will be your target consumers based on the following:

1. They have the same environment(webpack config, babel config) setup as you where you built your design system(this is mostly possible if you use monorepos/same configs where all the teams share the same environment).

2. They don't have the same environment which is the case when you work in bigger teams and you want to distribute your design system as any other npm package which is already built and can be used directly.

If your use case falls under case no. 1 then you can just compile the source babel src -d build and leave the bundling to the consumer projects tools(webpack/rollup)

kamleshchandnani

UPDATE: A better way! (August 2015)

As pointed out by @johntyree in the comments, using git reflog is easier and more reliable. Thanks for the suggestion!

 $ git reflog
1ed7510 HEAD@{1}: checkout: moving from develop to 1ed7510
3970d09 HEAD@{2}: checkout: moving from b-fix-build to develop
1ed7510 HEAD@{3}: commit: got everything working the way I want
70b3696 HEAD@{4}: commit: upgrade rails, do some refactoring