П!

1 арт-директор, 4 шрифтовых дизайнера, 2 менеджера по продажам, главный редактор и эсэмэмщица выбрали 3 лучшие буквы П в Буквальном Челлендже по версии Паратайпа! И вот их авторы (сами работы смотрите под постом): 1 место: Бюро Практика К вам поедет наша настолка «Поиграйте со шрифтами» 2 место — Май (очень понимаем про шавасану, сами бы в ней лежали) Для вас — фирменная футболка Паратайпа (в ней будет удобно в шавасане) 3 место — Кать, напиши Кате дарим каталог шрифтов студии на крутой бумаге Все подарки нежно соберёт и упакует Коля @Nikoljanych. Скоро он с вами свяжется! А вот ещё авторы, чьи работы мы считаем важным отметить: @sonya_risyet_tut @hidden_moscow @kruzhok71 @leri_lerimard @nowwhiskeydesign @Little_Yuppie_AI @design_layout_creative @ElizasDesign @alyonasssdesigner @patriotbelyaevo @vse_pustoe Вам — 🐶 (а если вам нужна скидка на шрифты… вы знаете, кому написать) Отдельное место в посте и в сердце эсэмэщицы заняла буква П от маша шашамама ша. Все буквы Маши — реальные собаки из приютов, которым нужна помощь и особенно нужна семья. Кажется, именно так и должен работать интернет. Если вам нужен хвостатый друг — загляните на страницу Маши!

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

# Spacing Audit Check a layout against a 4/8pt spacing scale, report every value that is off the grid, and snap it to the nearest correct step. The goal is consistent, predictable rhythm that is easy to hand off and maintain. ## The scale Base unit is 8. Use 4 only as a half-step for tight, component-internal spacing. Allowed values: 0, 4, 8, 12, 16, 24, 32, 40, 48, 56, 64, 80, 96. - 8, 16, 24, 32, 48, 64: structural spacing (section gaps, card padding, layout margins). - 4, 12, 20: fine spacing inside a component (icon-to-label, chip padding, tight stacks). - Anything not a multiple of 4 is off-grid and should be flagged. - A multiple of 4 that is not a multiple of 8 at the layout level (e.g. section gap of 20 or 28) should be flagged as "consider 8pt step" but is not a hard error. ## What to check Inspect auto-layout frames and spacing between elements: - Padding inside frames (top, right, bottom, left). - Item spacing / gap between children. - Gaps between sections and between grouped blocks. - Margins around content within a frame. ## How to audit 1. Walk the selected frame (or the whole page if nothing is selected) top-down. 2. For each spacing value, compare it against the allowed scale. 3. For each off-grid value, choose the nearest allowed step. When exactly between two steps, round to the one closer to the surrounding rhythm of that group. 4. Prefer consistency within a group over per-element correctness. If three cards use 14, 16, 16, align all three to 16. ## Rules - Do not change layout structure, sizing behavior (hug/fill), content, or styling. Only adjust spacing values. - Preserve intentional exceptions and do not flag them: 1px borders and hairlines, optical alignment offsets, values driven by hug/fill, and spacing set by a variable or token. - If spacing is already bound to a variable or token, leave it and note it instead of overwriting. - Round icon-to-label and other fine gaps to 4 or 8, not to larger steps. - When a whole group is uniformly off-grid on purpose (e.g. a deliberate 6pt system), flag it once and ask before mass-changing. ## Output 1. Return an audit summary first, before changing anything: - Total elements checked. - A before / after list of every off-grid value, grouped by frame, in the form `Card padding: 14 -> 16`. - Any values you left untouched, with the reason (token, hairline, optical). 2. Apply the fixes only after showing the summary. 3. End with a one-line rhythm note: the dominant step the layout now uses (e.g. "layout now on an 8pt rhythm, fine spacing on 4pt"). ## Do not - Do not resize elements or reflow content to hit a number. - Do not invent a new scale. Stick to the 4/8pt steps above. - Do not touch corner radius, stroke, or type unless the user explicitly asks.

Технический эскиз из картины, фотографии ткани или готового изделия? Сегодня это можно сделать буквально одним промптом в ChatGPT 👀

Подойдёт, если вам нужно: ✨ перевести идею в понятный технический вид ✨ создать основу для разработки коллекции ✨ быстро визуализировать концепцию ✨ подготовить материал для обсуждения с командой или клиентом Промпт: Create a professional flat technical fashion sketch based on the uploaded clothing image. Generate front view and back view of the garment. Requirements: • Clean black-and-white vector line drawing • Adobe Illustrator style • Front view on the left, back view on the right • Accurate garment proportions • Symmetrical construction • Clearly visible seams, darts, panels, pockets, closures, collar, cuffs, hemline and stitching • No body, no face, no model, no pose • No shadows, no colors, no fabric texture • White background • Fashion technical drawing for production • Precise apparel design sketch • Minimal clean layout • High detail ‼️ Важно понимать: такие эскизы не являются готовой технической документацией. Нейросеть может допускать ошибки в конструкции, деталях, пропорциях и технологии изготовления изделия. Поэтому все результаты требуют внимательной проверки и корректировки со стороны конструктора или технолога. 💡 Если хотите быть в курсе самых полезных инструментов и применять их раньше конкурентов⬇ присоединяйтесь к клубу.

NavBoo!

Плагин, который упрощает создание навигационных панелей. Включает готовые шаблоны с Auto Layout для быстрого и удобного дизайна Install
Вы часто интересуетесь дизайн-системой и принципами ее построения.
Поэтому сегодня в Вышке проведем лекцию на тему «Правила создания компонентов» Поговорим о том, как строятся компоненты в дизайне – как логичная, масштабируемая система, которая экономит время и упорядочивает структуру. Разберем, как проектировать компоненты так, чтобы ими было удобно пользоваться, поддерживать и развивать вместе с продуктом. 📌 На лекции обсудим: • пример компонента и массовое редактирование; • атомарность: из чего складывается система; • Auto Layout и его роль в гибкости интерфейса; • варианты компонентов и зачем они нужны; • скрытие элементов внутри компонентов; • как вложенность влияет на производительность и оперативную память. Лекцию проведет Ксения Литвак (продуктовый дизайнер, дизайнер дизайн-систем в Voximplant) ➡️ Подключайтесь сегодня в 19:00 (мск) на Boosty
🤖 Почему ИИ-помощник каждый раз заново ломает ваш UI Kit
С AI в разработке почти у всех один и тот же цикл. В первой сессии он быстро собирает красивый экран, во второй начинает придумывать новые токены, в третьей путает отступы, а к десятой у вас уже ощущение, что продукт собирали три разные команды. Проблема не в том, что модель «плохая», а в том, что она не читает дизайн-систему так, как читает ее человек. В статье предлагают довольно практичный подход: сделать дизайн-систему понятной для LLM через спецификации, закрытый слой токенов, обязательный аудит и инструкции для каждой новой AI-сессии. То есть не надеяться, что модель сама догадается, какой у вас синий, какой радиус у кнопки и как должен собираться layout, а дать ей это в явном виде. На примере с Atlassian после такого подхода убрали 418 хардкодных значений из 28 файлов и свели их к системе токенов и спецификаций. Внутри: – Почему LLM не мыслят дизайн-системами и постоянно начинают с нуля; – Как из-за этого в прототипах копятся сотни мелких визуальных расхождений; – Зачем проекту нужны spec-файлы, которые модель читает в каждой сессии; – Почему закрытый слой токенов лучше, чем «разумные» догадки модели; – Как аудит ловит хардкодные цвета, отступы и другие нарушения до коммита; – Зачем связывать AI-инструкции, токены и CI в одну систему; – Как устроена структура спецификаций: foundations, tokens, components, patterns; – Почему такой подход особенно важен для больших прототипов и длинных AI-итераций. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы
🆕 37 новых Pro-блоков
Коллекция Pro-блоков пополнилась 37 новыми блоками. Все они сделаны в Zero Block с использованием автолейаутов. Вы можете выбрать, в каком режиме работать с Pro-блоками: 🟠Free Layout — если хотите свободно редактировать блок, 🟠Auto Layout — если важно сохранить композицию. Новые блоки представлены в категориях: Команда, Плитка и ссылка, Партнеры, Этапы и Расписание. Где найти: Выберите нужный раздел 👉 нажмите «Показать блоки из коллекции Pro» #tildaupdates
🧩 В Фигме появился способ сделать компоненты гибче и не плодить сотни вариантов
Дизайн-система обычно начинает ломаться не тогда, когда она маленькая, а когда команда начинает обходить ее сама. Где-то отцепили инстанс, где-то сделали еще 12 вариантов карточки, где-то собрали отдельный модал только потому, что в базовом компоненте не хватило свободы. В Фигме для этого запустили слоты. По сути это способ оставить структуру компонента стабильной, но менять содержимое внутри без detatch. Зои Адельман и Сара Келли показывают, что лучше всего это работает на меню, модалках, карточках, панелях и даже крупных layout-компонентах. Для дизайн-систем это меньше вариантов и поддержки, для дизайнеров больше свободы внутри системы. Внутри: – С каких компонентов лучше начинать внедрение слотов, чтобы эффект был заметен сразу; – Когда слот должен быть пустым, а когда лучше сразу давать дефолтный контент; – Как preferred instances помогают не превратить свободу в хаос; – Почему слоты полезны не только для мелких элементов, но и для целых layout-блоков; – Как слоты сокращают количество вариантов и уменьшают поддержку библиотеки; – Почему связка со структурой кода делает handoff понятнее; – Как слоты помогают не detatch-компоненты там, где раньше без этого не обходилось; – Почему для автоматизации и AI это тоже важный шаг, потому что структура становится явной. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы
Ищем дизайнера презентаций в Figma в команду Вани Замесина @zamesin
Ваня Замесин — технологический предприниматель, автор методологий AURA и Advanced Jobs To Be Done. Эксперт #1 среди продакт-менеджеров в России. Вместе с командой мы активно развиваем экосистему продуктов: курс «Как делать продукт», AURA Framework — AI-платформа и сообщество для создателей продуктов, BOOST — интенсив по нейросетям. Что будешь делать • Развивать дизайн-систему: сетки, типографика, компоненты, стили контента • Верстать слайды для воркшопов • Визуализировать процессы так, чтобы сложное становилось понятным • Верстать онлайн-книгу • Адаптировать контент для Telegram Что важно • Уверенный Figma — auto-layout, компоненты, стили • Сильная типографика и вёрстка • Навыки визуализации данных • Системное мышление и скорость без потери качества • Используешь вайбкодинг в работе Условия • Удалёнка, GMT+3, 10:00–19:00 • Part-time с перспективой перехода на full-time • Результат важнее количества часов • Фикс обсуждаем индивидуально — платим по рынку • Доступ к методам и подходам из курсов Вани Замесина 👉Изучи вакансию подробнее и откликайся
Affinity by Canva!
Affinity gives you pro-grade photo editing, vector design, illustration, and layout — all in one app, for free. Полностью бесплатное приложение на MacOS/Windows для векторного дизайна, редактирования и ретуширования, верстки сетки! 🔗 affinity.studio #ЩLAB by r.
Figma представила интеграцию Claude Code.
Теперь AI может: – превращать код → в редактируемый дизайн в Figma – понимать структуру файла (компоненты, токены, layout) – работать в двух направлениях: дизайн ↔ код
Wrapped Layout — плагин позволяет организовать рабочее пространство и оборачивать в layout, наподобие flexbox. Когда текущий фрейм заполняется полностью, узлы автоматически переносятся на следующую строку
Изображение поста
Allto››layout
Этот плагин обновляет все свойства авто-лейаута на текущей странице Install 🖼 Figma Дизайн
Изображение поста
А как у вас дела с английским?
Для развития, важно не просто смотреть вокруг, но и заглядывать за горизонт: изучать работы зарубежных дизайнеров и быть частью международного комьюнити. Если вы можете поддерживать диалог на английском — это ооооогромный плюс для вас, как специалиста. Ребята из онлайн-школы разговорного английского @authenticpigeon (подружилась с ними недавно) поделились фреймворком сообщения, которое поможет органично завязать профессиональный диалог с понравившимся человеком: I saw *****. I liked *****. I’m curious about how/why *****? Пример: Hey Marco, I saw your SaaS dashboard design on Dribbble. I really liked the typography hierarchy and how calm the layout feels. I’m curious how you decided on those spacing and type scale choices — was it part of a larger design system? Лучшее место для таких сообщений — комментарии в социальных сетях и на профессиональных площадках, типа 🅱️Behance, Dribbble и подобных. Не бойтесь практиковаться и поддерживать уровень языка в проф. среде. Подписывайтесь на телеграм-канал ребят, где они рассказывают о разговорном языке, который пригодится, когда будете общаться с зарубежными коллегами по цеху и клиентами → @authenticpigeon Особенно, если цель выучить английский кочует в ваших списках из года в год. Может быть, это знак, чтобы заняться им всерьёз? ⚡️ GIF
Когда первый раз используешь Auto Layout в Figma.
Auto Layout — плагин преобразует текстовые поля, кнопки, списки и другие элементы в Auto Layout.
figma.com/blog/announcing-auto-layout
Плaгин Logo Layout — автоматически масштабирует и распределяет логотипы в сетке, учитывая их пропорции.
Теперь все логотипы будут выглядеть гармонично, независимо от их изначального размера и формы. #логотипы #масштабирование #сетка
💡 Как внедрить дизайн-систему, когда ты единственный дизайнер
Саша рассказала о своём пути от графического дизайнера до продуктового, работая над ERP-платформой. Будучи единственным дизайнером на проекте без опыта работы с большими продуктами, она столкнулась с хаосом из сотен экранов без консистентности и структуры. Главной проблемой стало отсутствие базовых инструментов: переменных, системы отступов, методологии. Она самостоятельно освоила современные возможности Figma через YouTube-ролики и эксперименты, создав Systematic Color Workflow с 400+ токенами. Правда, позже поняла, что можно было ограничиться только реально используемыми стилями и не усложнять работу фронтенда. Внутри: – Как создать Color Mixer для формирования консистентной палитры; – Почему текстовый компонент может перегружать макеты при сотнях экранов; – Зачем сразу определять правила отступов и брейкпоинты; – Как Variants, Boolean и Auto Layout ускоряют работу; – Почему пришлось аргументировать переход на платную версию Figma; – Какие ошибки можно было избежать с опытным ментором. ➡️ Читать статью ——— 💻 Курс по поиску работы 😍 Про дизайн 🔥 Вакансии дизайнерам 🎨 Референсы
Изображение поста
Auto Layout Buttons/Kit – Набор из 288 компонентов кнопок с автоматическим расположением
Изображение поста
Продуктовый дизайнер в кредитное подразделение ВТБ
Задача: — проектировать сложные интерфейсы банковских продуктов — продумывать бизнес-логику — предлагать оптимальные решения, в том числе нужен нестандартный подход Ожидания: — Figma: Auto layout, Variants — Pixel Perfect — Atomic Design — логическое мышление — опыт в исследованиях будет плюсом Условия: — график работы 5/2, с 9 до 18 — формат гибридный: ПН, ПТ удаленно, ВТ, СР, ЧТ офис — ЗП: 200-250к — премия по итогам года Контакт для отклика: @AlexanderMazurov #дизайн
Изображение поста