Greatmatis: заметки с тегом Дизайн

AI-китч

Mon, 30 Mar 2026 14:54:09 +0700

Cтиль скинчиков и вёб-сайтов из нулевых/десятых уже дорос считаться чем-то милым и ностальгическим. Кто-то может даже скажет «классика».

Приобретёт ли графика ранних аишек такой же флёр лет через лесять? Будем ли мы умиляться от шести пальцев, галлюциногенного морфинга в движениях и мёртвых взглядов? Станет ли поглощающий спагетти Уилл Смит лицом этого стиля?

Может быть забудем как страшный сон. А может оно станет отдельно признаваемой эстетикой, как фрутижер или хромкор.

Самый важный момент в работе над задачей

Tue, 24 Mar 2026 19:05:24 +0700

Ну может и не самый. Мой любимый, короче. Когда всё сделано, согласовано, в разработку передано… И у тебя есть ещё свободный денёк на шлифануть.

Макетики аккуратно расставить. Дописать на полях необязательные, но заботливые комментарии. Добавить эмоджики в названия страниц. Вставить какую-нибудь глупочковую пасхалку, чтобы случайный посетитель макета кекнул. За этот 1% времени, наводится 99% кайфа от работы с макетом.

Реалити чек от AI

Fri, 20 Mar 2026 15:39:45 +0700

Коллеги-дизайнеры, в основном, спокойно относятся к AI. Ну типа нас не заменит, так как работа дизайнера не картинки рисовать, а решать проблемы пользователя/бизнеса, а это комплексная работа, пока недоступная мощностям нейронок. И так-то оно так… Да вот только распространение AI рассказывает нам не только о сложности работы, которую AI осваивает. Распространение AI показывает, с какой работой на самом деле готов мириться бизнес.

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

Но эти вещи живут внутри мастерской. Безусловно, они помогают бизнесу. Конечно же быстрый код лучше медленного, секурность превыше всего, а дизайн должен ощущаться консистентно по всей линейке продуктов. Да вот только не совсем.

Я бы не сказал, что бизнес вожделеет этих благ. Возможно «уважает». Возможно «ценит». Как минимум «считается»… Но как только AI достигнет результата, приемлемого с точки зрения затрат и выхлопа, иконки перестанут иметь значение. Это не мешало и даже развлекало, что отдел копирайтеров внедрял узнаваемый язык бренда, но вообще-то огрехи аишки уже не так заметны, а отдел таки дорогой.

Специалисты и бизнес расходятся как раз в оценке этого градиента — «проблемы уже не так заметны». Этому конфликту сто лет в обед, он существовал и до расцвета AI. Для дизайнеров разнобой в толщинах иконок по продукту — великое табу и очевидный колхоз. Для бизнеса — «Нуу, если вы считаете это важным, окей, видимо это необходимая условность работы с крутыми спецами, I guess». Да и Стив Джобс про что-то такое говорил, а Apple круто.

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

Раскупили

Fri, 01 Sep 2023 00:45:54 +0700

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

Самокат вон, например.

А я вот подумал и теперь считаю, что это так себе способ. Страдает информативность: цену всё ещё интересно знать, даже если прямо сейчас товар недоступен. Ценник-то и не виноват, просто количества ноль. Так что всё-таки отдельно подписал.

Поиск

Wed, 30 Aug 2023 22:32:51 +0700

Кстати, весь мировой UX поиска работает неправильно. Тыкаешь в поле, ищешь, как тут сменить адрес, а оно не ищется. Хейтеры скажут, что в поиск надо писать товары, а не настройку. Хейтеры так ничего и не поняли.

Наблюдение про зелёный

Thu, 20 Jul 2023 00:18:47 +0700

На первой фотке телефон установленный в туалете номера в отеле. На второй какой-то роутер. Телефонная трубка чувствовалась дорого: приятный софт-тач и уважаемая увесистость. Роутер же просто роутер.

Наблюдение в том, что зелёный с уклоном в голубой ощущается дорогим, присущим хорошей вещи. Второй зелёный, ближе к оливковому, создаёт ощущение дешевизны.

Доклад про FigmaExport

Mon, 12 Sep 2022 16:42:32 +0700

Как мы в red_mad_robot автоматизировали экспорт ресурсов из Figma и у разработчиков стало больше времени на свою настоящую работу.

Кокошник

Mon, 22 Aug 2022 00:54:39 +0700

Цифровой кокошник: показывает картинки или настроение владелицы.

Авангард

Fri, 12 Aug 2022 00:02:05 +0700

Если вспомнить, что на свете есть авангардистские картины, то вопрос «чего бы затридешить» отпадает.

Фигма — это 16К20

Thu, 22 Jul 2021 18:24:13 +0700

У меня простое правило: ютуб советует — я смотрю. Вдруг там знания, а я не узнаю. Какое-то время ютуб считал, что в моей жизни не хватает именно токарного ремесла. А я и не спорил.

16K20 — распространённый в СССР токарный станок. В тех видосах меня заинтересовало, как мастера подстраивают станок под конкретную работу. А если сейчас инструмент не способен выполнить задачу, ребята на этом же станке вытачивают для него новую деталь.

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

Мой станок — это Фигма и мне интересно совершенствовать этот инструмент под свои задачи.

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

Дано: полноразмерная клавиатура. У неё не заняты F5, F6 и всё с F13 по F19. Девять кнопок ждут того, чтобы их соединили с какими-то частями станка.

Часто надо создавать новые компоненты. Дефолтное сочетание клавиш — opt+cmd+K — не нравится. В целом не фанат комбинаций шифта, контрола, опшна и команда. Есть сочетания, которые уже в ногти вросли, но приучаться к новым бесяво.

Да и создание компонента более востребованное действие, чтобы прятаться за аж двумя модификаторами. Короче, отныне новый компонент создаётся по F5. Здесь и далее, для перенаправления клавиш использую Keyboard Maestro (см. предупреждение про задротометр). Знаю, что на операции, выведенные в нативное меню приложения, можно и системными настройками клавиши навешивать. Но Keyboard Maestro просто приятнее и пригодится далее для автоматизаций посложнее.

Например, для множественного создания компонентов. Эта штука в меню не выведена и горячей клавиши для неё нет. Вот и работка для F6. В Keyboard Maestro забиваю такой скрипт:

При F6 вызывается строка Quick actions, в неё загоняется фраза «Create multiple components» и нажимается Enter.

Прошу обратить внимание на флекс: всё делается со свёрнутым интерфейсом Фигмы.

Иногда надо быстро выставить объект по центру холста. Допустим, это можно и дефолтными клавишами — opt+H+V. Но ведь мне надо, чтобы заодно выставлялись центральные констрейты. Кстати, в этом посте я позволю себе не уточнять «зачем». Это отдельный рассказ :)

Есть затык: у констрейтов не то что горячих клавиш нет, это действие даже в Quick actions не выведено. Надо как-то обнажить ендпоинты. Есть хороший плагин — Automater. Он выводит много полезного в нативное меню Фигмы, а значит у нас появляется апи для связи с Keyboard Maestro. Например, в Automater есть такое:

Это мне и надо. На клавишу F13 вешаю такой скрипт:

Ловкость, грация, изящество:

Таким же образом повесил на F14 центральное выравнивание и установку scale-констрейтов. Полезно, когда иконки рисуешь.

Поговорим о равенстве. Если выбран один объект, Фигма равняет его относительно фрейма. Это классно: хочешь быстро отправить объект в левый верхний угол — opt+A+W. Если же выбрано несколько объектов, то они равняются относительно друг друга. Чаще всего это ожидаемое поведение, но иногда надо выбрать несколько объектов и выровнять их все по левой границе фрейма. Тут Фигма ничего не поделает: упорно будет равнять по левой границе самого левого объекта. Группировку не предлагать, ведь она вмешивается в иерархию слоёв. Кстати, если бы группы не вычленяли слои из своих родителей, в них ещё был бы какой-то смысл супротив фреймам. Fix please.

У Automater есть функция Align Left и она безжалостно равняет объекты по левой границе фрейма, сколько бы их не было выбрано. То что нужно. Делаю так:

Здесь я все же изменил своей нелюбви к комбинациям модификаторов. Я привык, что обычное выравнивание слева — это opt+A. Выходит, что новое супер-выравнивание это модификация обычного, что укладывается в сдабривание этой комбы шифтом. Аналогично сделал для низа, права и верха. Вот так теперь могу:

Или совсем разнос — хоба:

Скептичной настроенный афро-американец из лайфхачных тиктоков спросит: и что, много времени экономит? Наверняка нет: речь о секундах. Не думаю, что дело именно во времени. Есть операции, которые не занимают время. Они просто неловкие. Жаль не время. Жаль, что между тобой и реализацией задуманного всё ещё стоят движения руками. Я хочу, чтобы объект всегда был строго по центру. А сначала выравнять по вертикали, потом по горизонтали, затем вертикальный констрейт, горизонтальный констрейт — не хочу.

Недоиспользованные кнопки

Sun, 06 Jun 2021 16:25:06 +0700

Фигма (и прочие профессиональные инструменты) плотно набита функционалом.

Сложно предугадать опции в контекстном меню по правому клику на объекте. Например, иногда надо растрировать форму. Жму правую кнопку, в надежде найти Rasterize selection, а оно не там. Полагаю, для этой функции уже жаль места в меню — и так много всего.

Встречаются горячие клавиши с полным пакетом модификаторов: cmd+shift+option+кнопка — это ж 4 пальца одной руки, а то и вовсе этюд для двух рук.

Опций много, но такая глубина не всегда нужна и желание сохранить простоту фасада понятно. Панельки Афтер Эффектса или Блендера отталкивают новичка, а Фигма чистенькая и нестрашная.

Хотелось бы, чтобы Фигма сохранила внешнюю простоту, но полнее использовала возможности ввода. Можно подсмотреть у вышеупомянутых инструментов.

Например, двойной клик по кнопке. Если в Афтер Эффектсе дважды кликнуть по кнопке создания прямоугольника, он заполнит собой всю композицию.

Хочу такое же в Фигме: двойной клик по кнопке создания формы, фрейма или текста, создаёт соответствующий слой, полностью заполняющий выделенный фрейм.

Кстати, я сделал плагин, который мгновенно заполняет фрейм тонировкой со scale-констрейтами. Удобно, чтобы делать модалки.

Оператор Фигмы, конечно, не кликает на кнопку, чтобы нарисовать прямоугольник. Он жмёт R. Блендер подсказывает: двойное нажатие на кнопку клавиатуры тоже существует. Если нажать просто G, Блендер, как обычно, свободно перемещает выбранные точки. Но если дважды клацнуть G, точки двигаются вдоль граней.

Такое бы в Фигму. Как и двойной клик по кнопке, двойное R заполняет фрейм прямоугольником.

Или ещё из Блендера: пока скашиваешь грань, можно крутить колёсико и наращивать полигоны для более плавного скоса.

Вот бы и в Фигме: жмёшь R, растягиваешь новый прямоугольник и заодно колёсиком меняешь скругление углов.

Наполнение функциями заставляет Блендер и прочие сложные инструменты глубже использовать средства ввода. Вдохновляться и вдохновляться.

Внезапный пример из Корела. Тут без видео, по памяти. Если зажать мышь и перетаскивать объект, можно кликнуть ещё и правой кнопкой. Тогда в текущем месте создаётся копия. Просто тащишь объект и быстро напуливаешь копии — всего-то надо правой кнопкой в нужных местах тыкать. Эту штуку хочу в Фигму как есть.

Вот такие примеры, как богаче использовать клавиатуру и мышь. Предлагайте свои.

Колесо

Mon, 04 Jan 2021 15:25:14 +0700

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

Codex Seraphinianus

Thu, 31 Dec 2020 15:45:03 +0700

Какое-то неведомо что из книги под названием Codex Seraphinianus. Пусть лежит здесь, как пример нескучной письменности.

Нескучная письменность

Mon, 21 Dec 2020 23:50:51 +0700

Ну вы знаете, покрасизмы-лампанизмы. Когда пишут не в линеечку или столбик, а, например, как раса номаи из игры Outer Wilds:

Участник беседы ответвляет свою фразу от исходного сообщения. Если кто-то хочет ответить на эту фразу, он делает ответвление уже от неё. Как если бы в Слаке можно было делать треды неограниченной глубины вложенности.

Или вот ещё круто, из твиттера Лингвопанк:

Оказывается, вязь может быть геометричной. Ещё похоже на человекопонятные куар-коды.

И ещё из закромов — схемы вальсов:

Если встретите ещё что-нибудь типа «как те штуки в Прибытии», скиньте, пожалуйста, мне.

Йодалайк

Sat, 31 Oct 2020 13:29:09 +0700

В твиторе потешная анимашка для лайка под постами с тегом Мандалорца. Вот она в слоумо:

Заинтересовало меня то, как красный покебол Бэйби Йоды превращается в сердечко. А именно никак: просто смена формы за один кадр.

Я бы оверзапарился и таки уделил бы кадра 3-4 на морфинг между формами. На деле же анимашка мелкая, проигрывается за треть секунды и можно делать проще.

Картинка

Mon, 19 Oct 2020 09:12:14 +0700

Это рендер какого-то из новых айфонов. Индикатор в углу показывает, в какую сторону заваливается свет. Клипует белый — уйдёт вправо. Клипует чёрный — влево.

Но рассказать хотел не это. Просто картинка красивая :)

Edit: Рома Ромашов подсказал, что это экспонометр. Он подскажет, если в объективе недостаточно света (завалится влево) или наоборот — всё засвечено.

Avif

Wed, 14 Oct 2020 23:02:39 +0700

Мне удивительно, что в мире форматов картинок что-то происходит. То есть я не против, конечно. Просто правая бровь поднимается.

Не успели мы не перейти на webp, как пора не переходить на avif. У него ещё, представляете, можно выбрать, сколько надо бит на канал: можно 8, можно 10, а можно и 12.

А ещё в параллельной вкладке Фигмы можно одной кнопкой эскпортнуть пнг-шку. И всегда показывается.

Солидно

Sun, 27 Sep 2020 22:33:37 +0700

Абсурдный с точки зрения русского языка, но удобный профессионализм: «солидная» заливка.

Бывает заливка градиентом. А когда заливка одним цветом, это в редакторах называется «solid». Вот фон этого бложека сейчас солидный чёрный.

Кстати, если не знали, советую бюрошную «опасность». Это opacity. Очень сподручно: «Понизь опасность, пожалуйста».

Це ніжка

Sun, 27 Sep 2020 22:31:01 +0700

Тут Рома Ромашов заметил, что в шрифте заголовка была несуразная «ц». Действительно, ножка буквы много о себе думала и больно далеко толкала следующую букву.

Заголовки написаны шрифтом Inter. Он сделан одним из дизайнеров Figma и используется в самом редакторе. А ещё он вариативный.

Когда Рома указал на «ц», я вспомнил, что именно в Inter недавно меняли эту букву. Скачал версию шрифта с гитхаба автора и действительно — «ц» исправлена. Бложек же тянул шрифт с Google Fonts. Подтвердилась моя давняя фобия: нельзя быть уверенным, что используешь новейшую версию шрифта, если импортируешь её из сервиса.

Проверил отличия кроме «ц». Взял панграмму со всеми буквами алфавита. Сверху гугловая версия, снизу новейшая.

До точки буквы идут одинаково. Новая версия знает, что под крышу «т» можно залезть. Ну и новая «ц» экономит место.

Наложил одну версию на другую. Гугловая — красная. Видно, насколько смещается точка.

Чтобы добить тему, сверил русский алфавит и цифры. Кроме «ц» всё то же, разве что лапку «К» подрихтовали.