Инструменты для дизайнеров
Небольшие утилиты, которыми я пользуюсь каждую неделю. Собрал их с AI, так же как собираю продукты. Файлы никуда не загружаются, всё работает прямо в браузере.
$ run text.fmt
Чистка текста
$ run contrast.chk
Проверка контраста
Аа. Съешь ещё этих булок
Основной текст 16 px: чтобы его было удобно читать, контраст с фоном должен быть не меньше 4.5:1.
17.21:1
$ run type.scale
Типографическая шкала
$ run ascii.img
Картинка в ASCII
$ run ratio.calc
Пропорции
- соотношение
- 16:9
- дробью
- 1.7778
- css
- aspect-ratio: 16 / 9;
Чем я на самом деле работаю и зачем.
01
Figma Weave app.weavy.ai
Нодовый холст для генеративной графики, который Figma получила вместе с Weavy в октябре 2025 года. Здесь несколько AI-моделей, вроде Sora, Flux и Ideogram, работают рядом с профессиональными инструментами: масками, инпейнтингом, цветокоррекцией. Из нод собираются повторяемые пайплайны для картинок, видео, анимации и VFX. Пока это отдельный сервис на weave.figma.com, позже его обещают встроить в саму Figma.
Открыть ↗
02
Uncut uncut.wtf
Бесплатный каталог современных шрифтов, собранный вручную. Удобно искать open-source гарнитуры и шрифты для коммерческих проектов: гротески, антиквы, моноширинные, акцидентные. Ценю его за то, что листать его спокойно и приятно.
Открыть ↗
03
CTA Gallery www.cta.gallery
Подборка призывов к действию с сайтов и из приложений: кнопки, формы, блоки с тарифами, поп-апы. Пригождается, когда нужно сделать CTA, который лучше конвертирует. Это референсы, а не конструктор.
Открыть ↗
04
Minimal Mockups www.minimalmockups.com
Бесплатные мокапы для презентации дизайна: смартфоны, постеры, ноутбуки, коробки, журналы, визитки. Каждый скачивается отдельно, пользоваться можно и в личных, и в коммерческих проектах.
Открыть ↗
05
Shots.so shots.so
Превращает скриншоты и макеты в аккуратные мокапы устройств, картинки для соцсетей и анимированные превью. Всё делается за пару минут прямо в браузере.
Открыть ↗
06
Noun Project thenounproject.com
Огромная библиотека иконок и стоковых фото: миллионы файлов в SVG и PNG. Иду туда за удобным поиском, единым стилем и простой лицензией для любых проектов.
Открыть ↗
07
Unicrorn Studio www.unicorn.studio
WebGL-эффекты без кода: анимированные интерактивные сцены для сайтов и приложений. Подходит дизайнерам, которые хотят встроить сложную анимацию и не писать шейдеры с нуля.
Открыть ↗
08
MockRocket www.unicorn.studio
Фотореалистичные 3D-мокапы устройств и промо-ролики из скриншотов или макетов приложения, прямо в браузере. Ссылка ведёт в кабинет для платных пользователей, на основном сайте есть бесплатная версия с водяными знаками.
Открыть ↗
09
Variant www.unicorn.studio
AI-инструмент, который по запросу выдаёт бесконечную ленту интерфейсов для приложений и сайтов: пишете, что нужно, и просто листаете. Ссылка ведёт в раздел сообщества, где можно смотреть, оценивать, сохранять и переделывать чужие варианты.
Открыть ↗
10
Stitch stitch.withgoogle.com
Экспериментальный AI-сервис Google Labs для дизайна интерфейсов. Собирает подробные экраны мобильных и веб-приложений из текста, картинки, наброска или вайрфрейма. Бесконечный холст, голосовые команды и интерактивные превью заметно сокращают путь от идеи до прототипа.
Открыть ↗
11
Are.na www.are.na
Минималистичное место для творческого ресёрча. Складываете фрагменты сайтов, картинки, видео, тексты и заметки в «каналы» и так раскладываете идеи по полочкам. Его делали для художников, дизайнеров и исследователей как спокойную альтернативу Pinterest и Tumblr без рекламы.
Открыть ↗
12
Fontshare www.fontshare.com
Бесплатная библиотека Indian Type Foundry: больше 100 профессиональных гарнитур. Лицензия разрешает использовать их где угодно, в том числе в коммерческих проектах, а у многих шрифтов есть вариативные версии.
Открыть ↗
13
Framer www.framer.com
Конструктор сайтов без кода: дизайн, прототипы и публикация в одном месте, с AI-инструментами, CMS и анимациями. Редактор как в Figma плюс хостинг, так что собранный сайт запускается без переезда в другую программу.
Открыть ↗