Эта штука реально выглядит как произведение искусства. Кто вообще это сделал? Настолько красиво и необычно.

https://tree.icqr.com

QR-код спрятан прямо в основании дерева, причём само дерево меняется в зависимости от ссылки. Есть три разных оформления для весны, лета и осени.

Нажимаете на настоящий QR-код внутри дерева, и он раскрывается. Получается что-то вроде маленького цифрового пейзажа.

И вот что забавно. Вроде бы вещь почти бесполезная, но почему-то приносит столько удовольствия.

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

👉 @PortalToDesign

Codex внезапно выдал мне «Используй это».

Я спросил «А что это вообще такое?», и он ответил, что сделал это через Remotion.

Похоже, такой подход быстрее Blender, OpenGL или Three.js, потому что не нужно заниматься моделированием, светом, материалами и всем остальным.

Да, он реально просто внезапно взял и выдал это 😂

Само видео потом сделали, загрузив результат в Seedance 2.5.

Промпт для создания такой доски движения был следующим.

Промпт:

Используя Remotion, создай простую доску движения, которую можно передать ИИ для генерации видео в качестве референса движения.

Человека представь в виде I-образной фигуры, состоящей только из сферы головы и одной линии тела. Объекты представь простыми геометрическими телами.

Используй отдельный узнаваемый цвет только для главного персонажа, а для всего остального используй ахроматические цвета.

Сделай так, чтобы были понятны положения, направления, наклоны, скорости, контакты, моменты изменения состояний людей и объектов, а также положение камеры и точка фокусировки.

Важно показать не финальный внешний вид сцены, а именно движение.

Лица, одежда, конечности, текстуры, поясняющий текст и стрелки не нужны.

Реализуй всё покадрово в Remotion и выведи результат в виде контрольного MP4.

👉 @PortalToDesign

Нашёл библиотеку иконок для React с открытым исходным кодом, в которой уже больше 13 452 SVG-иконок.

Каждая иконка доступна в трёх вариантах: контурном, залитом и мини. Пакет поддерживает tree shaking, поэтому в итоговый бандл попадает только то, что вы реально импортируете. Размер и цвет задаются обычными пропсами.

Полезный вариант для дашбордов и интерфейсов SaaS, если нужен единый набор иконок без подключения тяжёлой библиотеки.

http://mxicons.vercel.app

👉 @PortalToDesign

10 навыков для Figma Agent, которые стоит сохранить

1. better-interface - http://figma.com/community/skill/61238/better-interface

2. superfuture-design-review - https://www.figma.com/community/skill/65434/superfuture-design-review

3. component-handoff - https://www.figma.com/community/skill/67998/component-handoff

4. desktop-to-mobile - https://www.figma.com/community/skill/72495/desktop-to-mobile

5. create-anatomy - https://www.figma.com/community/skill/71321/create-anatomy

6. find-animation-opportunities - https://www.figma.com/community/skill/68151/find-animation-opportunities

7. spacing-audit - https://www.figma.com/community/skill/70410/spacing-audit

8. balise-ux-writing https://www.figma.com/community/skill/64048/balise-ux-writing

9. analyze-components - https://www.figma.com/community/skill/61009/analyze-components

10. design-system-gen - https://www.figma.com/community/skill/65614/design-system-gen

👉 @PortalToDesign

myinstants – огромная бесплатная библиотека мемных звуков

👉 @PortalToDesign

Ditther — сайт, на котором вы можете добавить на свои проекты различные трендовые эффекты.

👉 @PortalToDesign

5 полезных сайтов для веб-разработчиков.

1. voltagent.dev

Открытая платформа для создания ИИ-агентов на TypeScript.

2. sevalla.com

Хостинг для полноценных приложений на PHP, JavaScript, Python, Go и других языках.

3. converthub.com

Конвертация файлов между разными форматами плюс API для автоматизации.

4. getapi.com

Простой клиент для работы и тестирования API.

5. misakistudio.io

Инструмент, который превращает дизайн и анимации в код.

👉 @PortalToDesign

Просто опишите 3D-сцену обычным английским языком, и Claude соберёт её прямо в Blender.

BlenderMCP подключает Claude к Blender через MCP и превращает текстовый промпт в реально отредактированную сцену, а не просто в её описание.

> Создавайте что угодно из одного предложения
> По запросу подтягивайте реальные ассеты, HDRI, текстуры и модели с Poly Haven
> Генерируйте новые 3D-модели с помощью Hyper3D Rodin
> Дайте ему референсное изображение, и он соберёт под него соответствующую сцену в Blender

Полностью бесплатно. Открытый исходный код.

👉 @PortalToDesign

Если вам тоже хочется добавить на сайт таймер, но обычные статичные цифры выглядят скучно, вот довольно прикольная штука — Particle Pendulum Clock: DotPendulum.

Цифры здесь состоят из множества частиц, которые раскачиваются как маятник. Можно провести по ним мышкой — частицы разлетаются в стороны и потом собираются обратно.

Работает и как обратный отсчёт, и как обычные часы в реальном времени. Можно менять текст, шрифты и цвета.

Даже звуки генерируются прямо в браузере — никаких отдельных аудиофайлов не нужно.

Открыл страницу и сразу можно играться.

Я бы сохранил в закладки. Такие штуки обычно вспоминаешь именно тогда, когда уже не можешь найти.

Попробовать:
https://yuanyang749.github.io/DotPendulum

Исходный код:
https://github.com/yuanyang749/DotPendulum

👉 @PortalToDesign

Немного про новое обновление для типографики в Figma.

👉 @PortalToDesign

ЭТОТ РЕПОЗИТОРИЙ СО 121K ЗВЁЗД ДАЁТ ВАШЕМУ CODE-АГЕНТУ ПРОФЕССИОНАЛЬНОЕ ПОНИМАНИЕ ДИЗАЙНА ЗА СЕКУНДЫ

Проблема генерации UI с помощью AI не в коде. Проблема в том, что агент не знает, какой стиль выбрать, какие цвета подходят вашей индустрии и какая типографика будет уместна. Он просто угадывает — и результат это выдаёт.

UI UX Pro Max даёт агенту полноценный движок для принятия дизайн-решений:

→ 192 правила для разных индустрий: spa, fintech, SaaS, healthcare, gaming и других
→ Генерирует полноценную дизайн-систему ещё до написания первой строки кода
→ 79 доступных для поиска UI-стилей: glassmorphism, bento grid, brutalism, neumorphism и другие
→ 74 комбинации шрифтов и 192 цветовые палитры, подобранные под разные сферы
→ Включает anti-patterns: что НЕ стоит делать в вашей индустрии
→ Совместим с Claude Code, Cursor, Windsurf, Codex, Gemini и ещё 15+ агентами

Одна команда — и ваш агент перестаёт гадать, каким должен быть дизайн.

https://github.com/nextlevelbuilder/ui-ux-pro-max-skill

👉 @PortalToDesign

Совет по дизайну интерфейсов.

За большинство «мультяшных» анимаций выпадающих меню отвечает всего одно значение — scale: 0.

Начинайте с 0.97.

Тогда меню не раздувается из ниоткуда, а просто мягко встаёт на своё место.

👉 @PortalToDesign

UI/UX-дизайнеры, вот мои любимые ресурсы по дизайну в интернете, которые стоит сохранить:

Библиотека дизайна → http://curations.supply
Landing pages → http://landing.love
SaaS-сайты → http://saaspo.com
Создание мобильных приложений с AI → http://sleek.design
Типографика → http://uncut.wtf
Анимации → http://60fps.design
Мобильные приложения → http://mobbin.com
Бренды → http://rebrand.gallery
Иконки → http://hugeicons.com
Дизайн-системы → http://component.gallery

👉 @PortalToDesign

Koboyo Icon Library — 133K нарисованных вручную SVG-иконок, и всё полностью бесплатно

Здесь есть всё: от UI и tech до людей, объектов и бизнеса.
Отличный ресурс для UI/UX-дизайнеров.

https://koboyo.com/icons

Не пролистывайте пост — поставьте лайк и сделайте репост, чтобы этот ресурс увидели те, кому он действительно пригодится.

👉 @PortalToDesign

Нужны чистые и минималистичные иконки для UI и дизайн-задач? 🐇

Griddy Icons — это бесплатное опенсорс семейство иконок с чётким, утилитарным стилем. В наборе более 1100 иконок, толщина обводки 1.5px и сетка 24×24px. Всё выдержано в единой системе и сразу готово к использованию в U

Забираем здесь

👉 @PortalToDesign

Совет по графическому дизайну: никогда не используйте чистый чёрный цвет (#000000).

Чистый чёрный выглядит слишком резким и может сильнее напрягать глаза.

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

👉 @PortalToDesign

Появился инструмент для создания Android-интерфейсов по новой дизайн-системе Google Material 3 Expressive:

https://lnkiai.github.io/m3e-canvas/

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

Если делаете Android-приложения через вайбкодинг, стоит попробовать. 🥳

👉 @PortalToDesign

UI/UX-дизайнеры, вот мои любимые ресурсы в интернете для поиска вдохновения.

Сохраняйте, чтобы не потерять:

Веб-сайты → http://godly.website
Портфолио → http://prettyfolio.com
Bento Grid → http://bentogrids.com
Галерея изображений → http://ogimage.gallery
Мобильные и веб-приложения → http://mobbin.com

👉 @PortalToDesign

UI/UX-дизайнеры, возможно, это именно та библиотека анимаций иконок, которую вы искали.

Morphicons позволяет плавно превращать одну SVG-иконку в другую с помощью бесшовных анимаций.

Работает с популярными библиотеками иконок, включая Lucide, Tabler и Heroicons, не имеет зависимостей и весит всего 6,5 КБ.

https://www.morphicons.com/

Сохраняйте, чтобы не потерять

👉 @PortalToDesign

9 сайтов, которые помогут сгенерировать для вас DESIGN.md

1. styles.refero.design — библиотека готовых дизайн-систем реальных сайтов для AI-агентов.
2. designmd.me — вставьте URL и получите DESIGN.md с цветами, типографикой и компонентами.
3. open-design.ai — open-source workspace с готовыми DESIGN.md-системами и поддержкой локальных AI-агентов.
4. designmd.supply — превращает публичный сайт в готовый DESIGN.md для AI-агента.
5. getdesign.md — большая коллекция готовых DESIGN.md + создание анализа по своему URL.
6. aura.build — импортирует сайт по URL, извлекает его визуальную ДНК и позволяет использовать её в AI-дизайне.
7. neuform.ai — создаёт AI-интерфейсы и переиспользуемые DESIGN.md-дизайн-системы.
8. design-md.hyperbrowser.ai — извлекает DESIGN.md из любого сайта через Hyperbrowser.
9. typeui.sh — генерирует и предлагает готовые DESIGN.md для AI-кодинга.

Теперь у ИИ будет на одну причину меньше сделать вам очередной фиолетовый градиент 🤭

👉 @PortalToDesign

Библиотека UI-компонентов с набором готовых анимированных элементов для интерфейсов

Компоненты можно открывать непосредственно в AI-инструментах для разработки, включая Claude и ChatGPT, чтобы агент самостоятельно установил и подключил их к проекту.

Для ручной интеграции доступны полный исходный код и инструкции по настройке.

Подойдёт разработчикам, дизайнерам и тем, кто использует AI-инструменты для быстрой сборки интерфейсов

https://github.com/Harshjdhv/componentry

👉 @PortalToDesign