Релиз 6.1.0 Доработка и исправление работы Инпутов.

Изменения:

— InputDate. Исправлена работа параметров minDate и maxDate. Сравнение при определении диапазона теперь происходит не по времени, а по дню.

— InputEmail и InputPhone. Добавлен новый булевый параметр forceError. При его включении, значение error принудительно отображается в месте ошибки.

— Input и InputEmail. Исправлен баг с перескакиванием курсора в конец текста в браузере Safari.

Роадмап

Всем привет, вы можете следить за движением задач Дизайн-системы на канбан-доске в нашем проекте в Gitlab.

To be released — в этой колонке скопились уже готовые задачи, ожидающие релиза;
In Progress — в этой колонке задачи, над которыми работает команда в данный моменты;
Next — это список первостепенных задач, из этой колонки мы берём новые задачи после выполнения предыдущих.
Soon — это задачи среднего приоритета, которые мы хотим реализовать сразу после задач в колонке Next.
Backlog — список оценённых и отсеянных задач, но пока без приоритета.
Open — это колонка куда падают все новые задачи от пользователей.

Гитлаб корпоративный и в целях информационной безопасности, нужна учётная запись для доступа.
Если у вас нет учетной записи - напишите письмо на rit.support@rt.ru с просьбой ее создать. В письме необходимо указать ФИО и рабочую почту. Когда УЗ создадут необходимо авторизоваться в git.digital.rt.ru

Текущие задачи и ближайшие

Релиз 6.1.1 Чинили баги, поднимали зависимости.

Изменения:

— Icons. В новых иконках был зашит цвет в svg, из-за чего не срабатывало изменение цветов.

— InputEmail и InputPhone. Исправлена работа forceError. При включенном параметре ошибка отображается до тех пор, пока не пройдет успешно валидация внутри компонента или пока значание error не станет пустым.

— InputDate. Исправлена некорретная работа маски внутри компонента при указании minDate. Последняя цифра года больше не пропадает.

— peerDependencies. Исправлена совместимость пакетов

Сайт дизайн-системы design.rt.ru получил третье место в конкурсе Золотой сайт в номинации лучший usability / UX

Лекторий

Всем привет. Хотим через пару недель провести ряд лекций для дизайнеров и фронтендеров.

Одна из тем — про работу фронтендеров и самые важные понятия, которые нужно знать современному UI-UX дизайнеру. Это позволит сократить разрыв коммуникации между дизайнерами и фронтендерами ❤️

Поэтому, если у вас есть темы или боли, которые можно осветить в лекции, или если хотите выступить — пишите нам)

Релиз 6.2.0 Переписаны импорты иконок, апрувлен МР, исправлены баги.

Изменения:

— Icons. Переписаны импорты иконок в компонентах: Select, Multiselect, TagItem, TagMore. Теперь при прямом импорте не тянутся все иконки в билд, что значительно уменьшит размер бандлов

— Checkbox. Лейбл теперь может наследовать параметр color от родителя, МР Михаила Синякова

— Input. Исправлен баг, из-за которого для размеров small и xsmall с включенным и выключенным параметром fixedLabel, цвет label остается неизменным

— Button. Добавлен параметр children. В 18 реакте ругался на недостающий параметр

Напоминалочка

Для минимизации бандлов используйте прямые импорты компонентов и иконок
это значительно уменьшит размер бандлов:

import Button from @design-system-rt/rtk-ui-kit/components/Button/Button/Button

или включите tree shaking в своем сборщике.

Сегодня Microsoft прекратила поддержку браузера Internet Explorer 11 :)

ARTi

Привет друзья! Анонсируем бетку нашего нового бесплатного проекта — онлайн-доску для командной работы ARTi.
Это аналог миро, фигджэм и дравио.

Что может Арти сейчас:
- бесконечный холст;
- сквозное шифрование;
- инструменты рисования: фигуры, текст, карандаш, стрелки;
- все операции на горячих клавишах;

Авторизации нет, для каждой новой доски создаётся уникальный url, по которому доска будет всегда доступна.
Проект мы сделали чуть меньше чем за неделю на основе опен-сорсных решений.
Мы в команде ввели практику подобных быстрых пилотов, пет-проекты, чтобы ненадолго переключиться от нашей любимой Дизайн-системы)
Это уже третий проект, первые два — аватар-мейкер и фигма-бэкап.

#обучение

Пока готовим курс обучения Дизайн-системе, наш разработчик Дима Шевченко написал небольшую заметку о проблемах взаимодействия дизайнера и разраба:

«Основная проблема взаимодействия дизайнеров и разрабов, это его отсутствие 🙂
Чаще всего на проектах, каждый просто выполняет работу на своем месте, не выходя за рамки. Но на самом деле, не взаимодействуя друг с другом, невозможно даже просто хорошо выполнять свою работу.
Частая роблема с точки зрения разработки — слишком сложный дизайн, который трудно(=долго, дорого, никомуненужно) реализовать в коде.
Или если речь о дизайн-системе, то кастомизация дизайн-системы, без предварительного выяснения возможности реализации в коде такого решения.
Всё это можно решить/избежать, если будет нормальный мостик между разрабом и дизайнером. Разраб всегда будет готов рассказать как проще и быстрее сделать то или иное дизайнерское решение. Такой вариант не всегда будет идеальным, но от него можно будет хотя бы оттолкнуться для нахождения компромисса.»

Вопрос к дизайнерам и разработчикам РТК ИТ.

Дизайн-библиотека предлагает компонент ввода СМС-кода, но он не реализован в коде. Хотим понять ваши ожидания, давайте решим его судьбу вместе.

Ден Плешаков сейчас перерабатывает библиотеки в Фигме на вариантсы.
Посмотрите как удобно теперь настраиваются компоненты)

Скоро релиз)

Новый гайд по созданию иконок

Роман Белозёров и Петр Советов подготовили подробное руководство для дизайнеров.

Гайд по проектированию рассказывает про стилистические особенности и визуальные нюансы иконок Дизайн-системы.

Правила публикации помогут довести техническое качество иконки до стандарта, принятого в библиотеке.

Тёмная тема

Наша Дизайн-система с самого начала поддерживает тёмную тему. За это время мы в целом собрали приличный опыт в темизации дизайн-систем вообще.
Сейчас можно вспомнить доклад Дена Плешакова на лектории год назад, актуально до сих пор.
Ставьте 👏 если эта ниша вам интересна, мы продолжим выпуск обучающих материалов.
https://youtu.be/QOJlzv7199Q?t=1659

Друзья, сегодня большое изменение для дизайнеров: новые библиотеки в Figma.

Компоненты в коде развиваются, добавляются новые возможности. Figma выпустила несколько важных обновлений, которые не поддерживаются в текущей библиотеке. Поэтому мы провели большой рефакторинг, обновили все компоненты, причесали, добавили описания, инструкции, ссылки на гайды. И постарались учесть все ваши замечания и проблемы в работе с дизайн-системой.

Чтобы ничего не сломалось в ваших макетах, библиотеки опубликованы новыми файлами. Вы можете продолжать использовать старые версии библиотек в стартовавших проектах. Скоро устаревшие библиотеки будут отключены как обязательные при создании нового файла, в названии библиотек появится пометка «Устарело». Новые проекты начинайте с новыми библиотеками. Они намного удобнее!

Начните с инструкции для быстрого старта. Не подключайте обе версии одновременно, чтобы не запутаться в версиях.

Основные изменения:

— Изменена структура библиотек.

— Компоненты пересобраны на новом Autolayout и Variants.

— Всё настраивается в панели свойств компонента, не нужно лезть в слои за скрытыми элементами.

— Компоненты максимально синхронизированы с компонентами в коде.

— Добавлены новые настройки и возможности

Дизайн-система постепенно обретает новый коммерческий облик, у нас появилось название: «Атома́ро». Оно образовано от слова «Атом» и означает атомарный подход к проектированию дизайн-систем. Что дальше? Айдентика, новый сайт, и коммерческие тарифы дизайн-системы.
Катя Мельникова и её девочки из граф-дизайна сделают нам новую айдентику. А Маша Орлова и её дизайнеры сделают нам новый дизайн сайта.

Смотрите полный список изменений на сайте. Приятной работы с новыми библиотеками! 💚