Консистентность ≠ одинаковость

Для тех, кто не застал ту эпоху: раньше у нас были красивые, точные интерфейсы. Теперь их заменил дизайн-язык, выросший из Apple Watch — с иконками, которые существуют только ради того, чтобы помещаться в «сквирклы». Но дело даже не в этом. Суть в том, что раньше мы проектировали всю систему — технологии, концепции, интерфейсы. Когда дизайнеров волнует только поверхностная единообразность, платформы теряют свою уникальность. Apple когда-то проектировала именно системы. Скеоморфизм был не про кожаные текстуры — он был про обучение людей новым ментальным моделям. Мусорная корзина очищается, потому что ты понимаешь, как работает настоящая корзина. Глянцевые кнопки и панели Aqua имели глубину, потому что у ОС были слои, структуру которых ты мог увидеть и понять. Старая Apple строила стек целиком — от железа до пикселей и до концепций. Команды не просто «выпускали функции в общей коробке» — они создавали связные платформы, каждая со своим мнением о том, каким должно быть взаимодействие с компьютером в конкретной среде. «Жидкое стекло» отлично смотрится на телефоне. Но на macOS оно непрактично — нет точности, сплошной визуальный шум. Это то, что происходит, когда язык интерфейса, созданный для управления пальцем, перетекает в macOS. Мы ушли от интерфейсов, спроектированных для 27-дюймового дисплея и точного курсора, к интерфейсам, придуманных для экрана 1,5 дюйма, который ты тыкаешь одним пальцем. Mac — это инструмент для создания и точной работы. Ему нужна высокая плотность информации. Ему нужны элементы, за которые можно «ухватиться». Ему нужен UI, который не мешает, но дает мощь, когда она нужна. Вместо этого мы получили отступы, пустоты и размытые прозрачности, оптимизированные под большие сенсорные цели, которых здесь вообще никто не касается. Обязательный «сквиркл» для иконок — всего лишь симптом. Когда ты заставляешь каждую иконку принимать одну и ту же форму, ты говоришь: «важнее единый стиль бренда, чем то, чтобы иконка мгновенно передавала свою функцию». Мы обменяли ясность на однообразие. Обменяли точный дизайн на кроссплатформенную одинаковость. Консистентность — это когда система живет по своим внутренним связным правилам. Одинаковость — это когда всё выглядит одинаково вне зависимости от контекста. Команда, занимающаяся железом, всё ещё понимает суть — MacBook Pro и чипы серии M — просто блеск. Но дизайн софта ощущается так, будто он бежит за «толстыми пальцами», а не вспоминает, чем люди вообще занимаются на Mac. Пост дизайнера Ryo Lu из Cursor AI 🖼️ Хороший интерфейс

📺 Дизайн для телевизоров: практические принципы 10-футового интерфейса

Милан Балач во второй части статьи о TV-дизайне разбирает практические аспекты проектирования интерфейсов для телевизоров. Главный принцип: все платформы (Roku, WebOS, Android TV, Fire TV, tvOS) используют одинаковую схему управления через D-pad, OK и Back, что позволяет создавать универсальные решения. Ключевые ограничения включают необходимость отступов в 5% от краёв экрана (или 60 точек сверху/снизу и 80 по бокам), базовый размер текста от 24px вместо привычных 16-18px для веба, и обязательное визуальное выделение фокуса через масштабирование, инверсию цветов или рамки. Интересный приём: использование 13 колонок вместо 12 позволяет последнему элементу «полки» лучше выглядывать из-за края. Ввод текста через D-pad требует около 38 нажатий для фразы «hey there» против 9 на мобильном устройстве. Внутри: – Почему нечётное количество колонок решает проблему overscan; – Как использовать длительное нажатие для удвоения функций кнопок; – Зачем Prime Video переназначает кнопку Up для функции X-Ray; – Почему вертикальное движение меняет группы, а горизонтальное элементы внутри; – Как PNG с прозрачностью оживляет жёсткие интерфейсы; – Какие три пропорции постеров (2:3, 16:9, 1:1) используются для разного контента. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы
Изображение поста

Динамические бенто-сетки

Редактируемые карточки в стиле бенто можно сделать вручную, используя неразрушающие эффекты Иллюстратора. Вы сможете менять ширину отступов, количество ячеек и радиус скруглений в любой момент. 1. Рисуем поверх формы разделительные линии с обводкой. 2. Группируем линии и применяем Effect → Path → Outline Stroke и Pathfinder → Merge. 3. Группируем их с нижней формой и применяем Pathfinder → Subtract и Stylize → Round Corners. Если нужны отдельные объекты, то разбираем группу с эффектами через Object → Expand Appearance. И после ещё можно сделать плавные скругления бесплатным скриптом Round Corners Customization. — А автоматически генерировать разные сетки с настройкой количества ячеек, отступов и скруглений можно моим платным скриптом BentoGrid. #learn #illustrator #draw #paid

🛠️ DevTools для дизайнера: как проверять вёрстку без страха перед кодом

Дима из Voximplant написал руководство по использованию инструментов разработчика для дизайнеров. Главная мысль: открыть DevTools это как поднять капот у автомобиля. Не нужно разбирать двигатель, достаточно понимать, где что находится. Самая полезная функция для дизайнера это инспектор элементов. При наведении на элемент DevTools подсвечивает отступы цветом: зелёный показывает padding (внутренние отступы), оранжевый показывает margin (внешние). Вкладка Computed показывает финальные значения после всех вычислений браузера, а Styles показывает исходные CSS-правила и откуда они пришли. В Responsive Design Mode можно проверить адаптив, выбрав конкретное устройство или задав размеры вручную. Справа есть ручка для плавного изменения ширины, чтобы заметить момент, когда начинаются проблемы с вёрсткой. Внутри: – Как быстро достать SVG-логотип через Copy element; – Зачем нужна вкладка Network для скачивания защищённых изображений; – Как тестировать идеи прямо в браузере без Figma; – Почему изменения видны только вам до обновления страницы; – Какие пять основных зон есть в интерфейсе DevTools; – Как конкретные значения отступов упрощают фидбек разработчикам. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы
Изображение поста
Gridder. Простой браузерный генератор модульных сеток. Можно настраивать количество колонок и строк, поля, отступы и размер холста. Результат экспортируется в виде вектора в PDF.
Изображение поста
Как мыслить масштабно, когда тебя загнали в угол?
Когда стоишь у Сан-Карло алле Куатро Фонтане в Риме, понимаешь: церковь как будто придавили двумя перекрестками. Участок маленький. А Борромини в 1638 году должен был здесь построить храм.  Фасад живет сам по себе: ни одной прямой, линии то волнуются, то отступают, колонны, скульптуры, зигзаг карниза, а в завершение — медальон картуша, как легкий взмах кисти. Но внутри — настоящее заклинание. План то ли овал с тайными углами, то ли ромб, спрятавший в себе овал. Белоснежные стены поднимаются ярусами, уходят вверх к овальному куполу, свет льется будто из пустоты. Микроплощадь, макроэффект. Борромини словно говорит: не жди идеальных условий. Создавай пространство там, где его нет. Даже если весь твой мир сейчас — это крошечный угол. Именно так часто начинается прорыв. Это была серия виде «Об архитектуре за 60 секунд». Всегда в понедельник. #архитектура #архитектор #барокко #рим
Плагин LilGrid — наводит порядок в макетах. Берет все неупорядоченные элементы в системе и организует их в виде сетки, параметры которой задаете сами. Полезно, когда нужно организовать большое количество кнопок или иконок в дизайн-системе.
Плагин ничего не ломает, а только меняет расположение элементов и отменяется действие одним шагом при необходимости. #выравнивание #направление #отступы #порядок #сетка #слои
Коммуникационный дизайнер в WIM.Agency
WIM.Agency — digital-агентство омниканальной коммуникации. Задачи: — большая часть работы, до 90%, будет состоять из дизайна email-рассылок, но опыт в этом не обязателен, мы научим — также периодически необходимо будет создавать landing pages, баннеры, геймификации Ожидания: — наличие портфолио с коммерческими работами: лендинги, баннеры, будут плюсом рассылки — опыт работы в Figma, After Effect, базовые навыки в нейросетях: Midjorney, Sora и в UX/UI — внимание к деталям, а именно: к системе отступов, распределению акцентов, грамотному использованием пространства Условия: — полная удаленка — график работы: 5/2 с 10 до 19 по Мск — оплата почасовая — адаптация: у тебя будет наставник — даем доступ к корпоративной Figma, а также к Shutterstock, Unslpash, Sora, Midjourney → #79284c383de74732852a629c362ec144">Почитать подробнее Контакт для отклика: @Career_WIM_Agency_bot #дизайн
Изображение поста
💡 Как внедрить дизайн-систему, когда ты единственный дизайнер
Саша рассказала о своём пути от графического дизайнера до продуктового, работая над ERP-платформой. Будучи единственным дизайнером на проекте без опыта работы с большими продуктами, она столкнулась с хаосом из сотен экранов без консистентности и структуры. Главной проблемой стало отсутствие базовых инструментов: переменных, системы отступов, методологии. Она самостоятельно освоила современные возможности Figma через YouTube-ролики и эксперименты, создав Systematic Color Workflow с 400+ токенами. Правда, позже поняла, что можно было ограничиться только реально используемыми стилями и не усложнять работу фронтенда. Внутри: – Как создать Color Mixer для формирования консистентной палитры; – Почему текстовый компонент может перегружать макеты при сотнях экранов; – Зачем сразу определять правила отступов и брейкпоинты; – Как Variants, Boolean и Auto Layout ускоряют работу; – Почему пришлось аргументировать переход на платную версию Figma; – Какие ошибки можно было избежать с опытным ментором. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы
Изображение поста
Графический дизайнер в WIM.Agency
WIM.Agency — digital-агентство омниканальной коммуникации. Задачи: — создание дизайна полного спектра графических материалов, таких как полиграфия, наружная реклама, POS-материалы, web баннеры Ожидания: — опыт в графическом дизайне не менее 2 лет — внимание к деталям, а именно: к системе отступов, распределению акцентов в соответствии с их важностью, грамотному использованием пространства, а также проработки типографики — стек: Illustrator, Photoshop, InDesign, Figma Условия: — удаленка, занятость 2-4 часа в день, важно быть на связи с 10 до 19 по мск пн-пт — почасовая оплата + официальный контракт — даем доступ к корпоративной Figma, а также к Shutterstock, Sora, Midjourney Контакт для отклика: @Career_WIM_Agency_bot #дизайн
Изображение поста
Я из тех, кто видит каждую мелочь 👀
Пока сильнее всего это проявляется в дизайне Реально, даже не задумываясь, если я замечаю тонкие колебания цвета, то сразу делаю кадр ярче и нахожу то, что обычно «практически» незаметно 🧐 С текстом та же история: если мне интересно, я читаю даже самый мелкий шрифт и пытаюсь понять, что там спрятано, обращая внимание даже малейшие отклонения в отступах — Ну и если вернуться к мелкому шрифту, и отбросить вопросы про CTR и маркетинг, то он просто выглядит стильно и минималистично! Мелкий набор текста часто создает аккуратную эстетику, в связке с крупным текстом Да о чем говорить: на ноуте 15" у меня стоит уменьшенное системное масштабирование (примерно 75%), а курсор минимального размера. Просто так комфортнее 😆 Поэтому мелкий текст для меня не способ спрятать проблемы с компоновкой, это осознанный выбор и часть визуала Если клиент попросит, я сделаю крупнее. Но себе оставлю версию с мелким текстом! Такие мысли. А как вы относитесь к мелким деталям или тексту? 👇🏻
Изображение поста
Обновление: FitArtboardsToArtwork v0.3
Добавил в скрипт, который подгоняет размер артбордов под их незаблокированное содержимое, больше контроля над процессом. Гибкий выбор артбордов Теперь нет ограничения диапазоном «от и до». Можно перечислить нужные артборды через запятую (1, 3, 5) или задать группу через дефис (2-8). Контроль над сторонами артборда Раньше скрипт менял размер артборда со всех сторон. Теперь можно выбрать, какие именно стороны подогнать под контент. Например, можно изменить только высоту артборда, оставив ширину неизменной. Отступы в процентах Кроме фиксированных значений в единицах документа, можно задавать отступы в процентах от размера содержимого. Например, если установить Left и Right по 50% — слева и справа будет пространство, равное половине ширины контента на артборде. Скачать скрипт #illustrator #artboard
🙂 Обработка «напильником»: лекция Виталия Кузьмина
Где бы взять волшебную палочку, чтобы проекты не только доделывались, но и начинали работать? Возможно, именно об этом тайно мечтают все проджекты, арт-директоры и бренд-дизайнеры, когда проект уже почти собран, но всё ещё «не летает». Подмигните нам, если это правда ⚡️ Вместо палочки наш шрифтовой дизайнер Виталий Кузьмин предлагает использовать… напильник! Как именно его использовать в дизайне и провести финальную шлифовку проекта Виталик расскажет 18 октября на удалёнке от Мультибрендинга. Приходите послушать! Виталий — шрифтовой и графический дизайнер, леттерер и график, автор PT Root, PT Root UI, Sober Sans, соавтор Golos UI и Golos Text. Работал над шрифтами для Dodo Pizza, ВТБ и Сбера (проекты получили Red Dot, ED Awards, GRANSHAN). Лирическое отступление: когда делаешь шрифты, привыкаешь к режиму марафона. Нельзя с наскока или за спринт собрать шрифт с человеческим кернингом, который будет адекватно отображаться на экране и работать, например, в условиях плохой видимости. Поэтому шрифтовые дизайнеры очень хорошо знают, что такое долгие и сложные проекты 🐶
Изображение поста
Минутка веб:
В дизайне персональной страницы несколько уже устойчивых трендов. Крупная типографика. Преломление через рифленое вертикально стекло, оптические эффекты преломления с пошаговым отступом. Смотрится хорошо, естественно и в общем стиле, но уже хорошо знакомо глазу и не создает сильного образа индивидуальности. Дизайнер: Stella Petkova
Наглядная разница между геометрическим и оптическим отступом
Учитываете или обычно используете геометрические? 🖼️ Хороший интерфейс
— Увидел в реках, и ты заслуживаешь больше просмотров
— Оч круто переработал — Интереснее чем крупных дизайнеров смотреть 👆 Приятно читать вашу обратку на вчерашний разбор Кто ещё не видел: 🎞 Смотреть ← 🔥 Накидайте реакций на пост, если нравится такая рубрика. Могу на след неделе ещё один разбор дропнуть, но уже чисто по дизайну 🎨 Буду придираться к сетке, типографике, отступам, длине строки и тд — такого ещё не было на канале
Изображение поста
Как побороть перфекционизм и успевать делать больше? Личный лайфхак 😉
Еще подростком, когда ходил в художку, мог нарисовать хороший пейзаж за 2 дня и еще 7 дней доводить его до идеала.. В работе также — не мог делать задачи быстро и хорошо на 7/10. Задрачивал дизайн по пикселям, 20 минут выбирал фотку из трёх одинаковых или несколько часов убирал эти ебучие висящие предлоги на сайтах 😳 Чересчур обращал внимание на детали. Одновременно гордился этим и корил себя, что много времени сливал на неэффективные действия 📉 ————————— Но нашел этому простое решение. Я начал задавать себе вопрос: «Важно ли кому-то видеть выполнение данной задачи на 10/10?» В 80% СЛУЧАЕВ ОТВЕТ «НЕТ»: 1️⃣ Ну доведу я до идеала макет по отступам, висящим предлогам, теням и пикселям. Клиент не увидит разницы. Лучше уделить больше внимания структуре сайта и текстам — чтобы конверсия была выше 2️⃣ Как оказалось, на моей аватарке канала никто не заметил зеленый стремный «фонарь» под глазом, который я тщетно пытался убрать целый час 3️⃣ Стоит ли 3 часа перебирать шрифты для проекта? Когда можно сразу взять универсальные Inter и Montserrat. Лучше время потратить например на поиск нового клиента и заработать 50 тыс рублей ————————— Я научился отделять второстепенное и больше фокусироваться на том, что действительно двигает меня вперед и делать это на 10/10: поиск клиентов, продажи и изучение маркетинга сайтов 👨‍💻
Изображение поста
Про повторение
Пока все проходят «написябрь» от моих друганов Юли и Антона, у меня моя фаза «неписября», потому что чутка я подзамахалась, ну, сами понимаете. Хочется спокойствия, умиротворения и слияния с бесконечным вечным, как говорится. И в своем «неписябре» я добралась, наконец, до чтения. Целый месяц ничего не читала и уже чувствую, как мозг усох. Сейчас читаю «Невыносимая легкость бытия» Милана Кундеры — ненавязчивая психология с нотками романтики (ну я девочка, люблю иногда такое, каюсь). И в самом начале книги было лирическое отступление об идее вечного возвращения — это если бы мы проживали свою жизнь снова и снова, без изменений, повторяя одни и те же действия. И, знаете, это так отрезвило. Просто задумайтесь: если бы любой ваш поступок, любое ваше слово или действие повторялось бы из раза в раз до бесконечности, стали бы вы совершать этот поступок, действие или говорить эти слова? (А тревожникам и представлять не надо, хихик). «В мире вечного возвращения на всяком поступке лежит тяжесть невыносимой ответственности» Представляете, насколько бы мир стал лучше, если бы каждый хоть на несколько минут задумался о том, что его поступок не пройдет бесследно, не забудется и не будет прощен, а будет вечно возвращаться. Насколько бы всем людям показались бы глупы и нелепы интриги и клевета, которые они разносят против других; насколько бы ценна была бы человеческая доброта и теплота. Каждый поступок мы бы взвешивали и не разбрасывали бы словами и обещаниями направо и налево. Такие вот задумчивые дела, мои чюваки! А вы бы прожили свою жизнь без изменений заново? Ни о чем бы не жалели?
Изображение поста