В этом году многие отечественные компании показали свои наработки по дизайн-системам. Особенно активизировались к осени ? каждый месяц кто-то да анонсировал свою дизайнерско-технологическую платформу. Мы с Юрием Ветровым давно работаем над дизайн-системами и решили придать импульс их развитию в России — запустили сайт-коллекцию Design Systems Club.

image

На сайте собрана информация о компаниях, про активность которых мы знали наверняка: библиотеки компонентов, статьи, презентации и т.п. Сейчас представлены организации с открытыми живыми гайдлайнами: Альфа-Банк, Дизайн Государственных Систем, Mail.Ru Group, Rambler & Co, Яндекс, а также те, кто описывал их в статьях: Acronis, МегаФон и Тинькофф. Мы слышали про наработки в ещё нескольких компаниях (2ГИС, Авито, EastBanc Technologies, Контур, Райффайзен, Сбербанк, Qiwi), но не имели конкретных ссылок, на которые могли бы сослаться. Главный критерий упоминания на сайте — компания понимает под «дизайн-системой» технологический фреймворк, а не банальный UI Kit в Sketch (или классический гайдлайн на скриншотах). Если мы про вас незаслуженно забыли или переврали в описаниях ? пишите мне или Юрию Ветрову.

Мы хотим подхлестнуть обмен опытом между компаниями и показать, что всё не так сложно и вполне посильно. Например, в конце сентября на микро-конференции UX-Среда прошёл круглый стол, целиком посвящённый этой теме, и общий интерес со стороны российской аудитории доказал её актуальность. Чем больше на слуху удачных примеров и людей, с которыми можно пообщаться по актуальным проблемам внедрения, тем быстрее будет развиваться отечественный рынок.



Конечно, мы не забываем про лучший и главный сайт-коллекцию дизайн-систем. Но большинство компаний в нашей подборке работает на русскоязычном рынке, и переводить библиотеки компонентов только для попадания туда не особо оправдано. Для первой версии сайта мы в первую очередь собрали все ссылки вместе. В дальнейшем займёмся развитием идеи ? станет понятнее и нагляднее, появится возможность сравнивать прогресс компаний.

Подпишитесь на рассылку, чтобы получать всё свежее раз в месяц. И не бойтесь начать — первый шаг вполне по силам даже небольшим компаниям.

Комментарии (6)


  1. MrBuha
    26.12.2017 15:35

    Яндекс лего — это, я так понимаю, аналогия БЭМ?


    1. ASundiev Автор
      26.12.2017 15:36

      Не совсем аналогия.
      БЭМ — более широкая история.
      Библиотека компонентов внутри компании носила название «Лего».


      1. MrBuha
        26.12.2017 15:59

        Да, неправильно выразился. Это скорее конструктор состоящий из элементов. А в парадигме тогда какой принцип используется, в отличии от БЭМ? В бэм понятно, что всё строится по принципу элементов, блоков и мод-ов. В чем кардинальное отличие парадигмы от бэма?


        1. ASundiev Автор
          26.12.2017 17:10

          БЭМ — понятие широкое. Вы можете использовать open-source библиотеку компонентов, а можете просто использовать методологию в части именования классов — как-угодно.
          Paradigm — тоже широкое понятие, оно включает в себя все фреймворки, на которых создаются наши проекты, плюс философия, правила и т.д.
          Не очень правомерно сравнивать, в этом смысле, БЭМ и Paradigm.


        1. jvetrau
          26.12.2017 18:48

          Если говорить про общий подход, то плюс-минус все дизайн системы строятся на модульной основе. У нас — переменные (визуальный стиль) > базовые элементы (то, что есть в любом интерфейсе — кнопки, поля форм и т.п.) > компоненты (то, что используют несколько продуктов — просмотрщик фото, форма регистрации и т.п.). В идеологии atomic design атомы > молекулы > организмы > шаблоны > страницы. В БЭМ — чуть по-другому, но идея похожая.

          Этот подход как раз и делает современные дизайн-системы на технологическом уровне возможными, так что сложно говорить о каком-то авторстве.


  1. nizsheanez
    28.12.2017 05:29

    Крутые у вас дизайнеры. Я глядя на картинку подумал что IDEA выпустила новую штуку и обрадовался!