Минутка соцблока:

Вертикали и горизонтали в дизайне. Музыка и визуальный ритм. Государственный польский звукозаписывающий лейбл «Muza» («Муза»).

Минутка истории:

Дизайнеры Ханс Мишель и Гюнтер Кизер. Реклама для Федеральной почты Германии

#цитата_дня

Клиент не покупает у вас время. Он покупает работу. И деньги нужно брать за ценность этой работы

Есть формулы, которые якобы помогают вам определить цену исходя из того, сколько вам нужно заработать. Они предлагают вам сложить свои расходы, арендную плату, материалы, коммунальные услуги и прочее, а затем добавить сумму прибыли, которую вы хотите получить. Проблема большинства этих формул в том, что они не позволяют высчитывать расценки – они рассчитывают, как едва прикрыть свою задницу. Конечно, нужно знать, какова минимальная ставка, чтобы вам не отключили электричество за неуплату. Но с клиентов нужно брать плату исходя из того, насколько ценна ваша работа для них, а не из того, сколько времени у вас уходит на ее исполнение

«Дизайн — это работа», Майк Монтейро

Эффект парящиъ эллипсов в Figma

Автор

Дмитрий Якушин написал о дизайн-токенах.

— Набор дизайн-токенов позволяет сделать визуально согласованный и при этом гибкий дизайн (легко поменять один оттенок на другой);
— Дизайн-токен — псевдоним определённого значения той или иной переменной: цвета, шрифта, размера элемента, тени, отступа, скругления;
— Цвет #677178 можно назвать color-grey-600 и использовать в макетах так, а можно создать токены color-text-secondary и color-component-badge-bg-neutral, которые будут ссылаться на color-grey-600;
— В тёмной теме color-text-secondary может ссылаться на другой цвет, что упрощает создание макетов для других тем;
— Говорящие названия упрощают их использование, особенно новыми участниками команды;
— Есть черновая версия стандарта дизайн-токенов от W3C;
— В составном токене (миксине) может быть больше одной переменной. Например, в токене типографики: название шрифта, кегль, высота строки, межбуквенный интервал;
— color-green-600 — глобальная переменная (примитив, палитра, референсный токен) с абстрактным названием без контекста. Число обычно отражает количество света в цвете;
— color-text-success — дизайн-токен, который ссылается на переменную color-green-600 и имеет контекст использования: для текстовых сообщений об успехе;
— Есть компонентные токены, которые относятся к конкретным компонентам, например, color-component-badge-bg-info для фона информационного бейджика;
— Распространены стили названия: color_text_primary для веба, сolorToken.textPrimary для мобильных платформ;
— Полная структура названия: префикс, группа (color), тип (text, component), элемент (badge), модификатор (background), вариант (info), состояние (hover);
— Некоторых частей может не быть: если токен не относится к компоненту, если к проекту не подключено нескольких библиотек с токенами (прификс их идентифицирует);
— В именах токенов размеров лучше не использовать цифры, чтобы не было путаницы с фактическими значениями: xx-small, x-small, small, medium, large, x-large, xx-large;
— Категории: colors, font family, font size, line height, border color, grid, border radius, spacing, box shadow, duration/transition, shadows, z-index, size.

Канал Дмитрия. #figma #design_system