This media is not supported in your browser
VIEW IN TELEGRAM
Теперь 3D-модели можно проектировать прямо в браузере.
Это открытый 3D-редактор с упором на локальную работу. В нём можно создавать формы, вырезать отверстия, импортировать STL-файлы и экспортировать готовые модели.
И у него даже есть локальный MCP-сервер, через который ИИ-клиенты могут взаимодействовать с открытым 3D-редактором в реальном времени.
100% опенсорс😆
👉 @PortalToDesign
Это открытый 3D-редактор с упором на локальную работу. В нём можно создавать формы, вырезать отверстия, импортировать STL-файлы и экспортировать готовые модели.
И у него даже есть локальный MCP-сервер, через который ИИ-клиенты могут взаимодействовать с открытым 3D-редактором в реальном времени.
100% опенсорс
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥3
This media is not supported in your browser
VIEW IN TELEGRAM
Менеджер: ты с этим справишься?
Я жду, пока он уйдёт, чтобы проконсультироваться с ИИ.
👉 @PortalToDesign
Я жду, пока он уйдёт, чтобы проконсультироваться с ИИ.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤8😁8
This media is not supported in your browser
VIEW IN TELEGRAM
В Figma обновили работу с векторами. Появился полноценный ластик и улучшили Paint Bucket.
Теперь отдельные участки векторных контуров можно стирать прямо на холсте, а заливку или градиент — протягивать сразу через несколько областей, чтобы быстро их перекрашивать.
Ластик работает в режимах Vector Edit и Draw.
Горячая клавиша — Shift + E.
👉 @PortalToDesign
Теперь отдельные участки векторных контуров можно стирать прямо на холсте, а заливку или градиент — протягивать сразу через несколько областей, чтобы быстро их перекрашивать.
Ластик работает в режимах Vector Edit и Draw.
Горячая клавиша — Shift + E.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍8🔥5
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Бесплатные ресурсы для интерфейсов, которые реально выглядят круто ↓
http://gooey.jakubantalik.com — жидкие эффекты для React
http://beam.jakubantalik.com — анимированная светящаяся рамка
http://metal.jakubantalik.com — эффект жидкого металла по краям
http://orbs.jakubantalik.com — анимированная сфера для состояния «ИИ думает»
Сохраняю всё это для следующей сборки MVP.
👉 @PortalToDesign
http://gooey.jakubantalik.com — жидкие эффекты для React
http://beam.jakubantalik.com — анимированная светящаяся рамка
http://metal.jakubantalik.com — эффект жидкого металла по краям
http://orbs.jakubantalik.com — анимированная сфера для состояния «ИИ думает»
Сохраняю всё это для следующей сборки MVP.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Эта штука реально выглядит как произведение искусства. Кто вообще это сделал? Настолько красиво и необычно.
https://tree.icqr.com
QR-код спрятан прямо в основании дерева, причём само дерево меняется в зависимости от ссылки. Есть три разных оформления для весны, лета и осени.
Нажимаете на настоящий QR-код внутри дерева, и он раскрывается. Получается что-то вроде маленького цифрового пейзажа.
И вот что забавно. Вроде бы вещь почти бесполезная, но почему-то приносит столько удовольствия.
Наверное, в этом и есть красота. Когда вещь освобождается от обязанности быть полезной и просто существует.
👉 @PortalToDesign
https://tree.icqr.com
QR-код спрятан прямо в основании дерева, причём само дерево меняется в зависимости от ссылки. Есть три разных оформления для весны, лета и осени.
Нажимаете на настоящий QR-код внутри дерева, и он раскрывается. Получается что-то вроде маленького цифрового пейзажа.
И вот что забавно. Вроде бы вещь почти бесполезная, но почему-то приносит столько удовольствия.
Наверное, в этом и есть красота. Когда вещь освобождается от обязанности быть полезной и просто существует.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤11🔥6
This media is not supported in your browser
VIEW IN TELEGRAM
Codex внезапно выдал мне «Используй это».
Я спросил «А что это вообще такое?», и он ответил, что сделал это через Remotion.
Похоже, такой подход быстрее Blender, OpenGL или Three.js, потому что не нужно заниматься моделированием, светом, материалами и всем остальным.
Да, он реально просто внезапно взял и выдал это😂
Само видео потом сделали, загрузив результат в Seedance 2.5.
Промпт для создания такой доски движения был следующим.
Промпт:
👉 @PortalToDesign
Я спросил «А что это вообще такое?», и он ответил, что сделал это через Remotion.
Похоже, такой подход быстрее Blender, OpenGL или Three.js, потому что не нужно заниматься моделированием, светом, материалами и всем остальным.
Да, он реально просто внезапно взял и выдал это
Само видео потом сделали, загрузив результат в Seedance 2.5.
Промпт для создания такой доски движения был следующим.
Промпт:
Используя Remotion, создай простую доску движения, которую можно передать ИИ для генерации видео в качестве референса движения.
Человека представь в виде I-образной фигуры, состоящей только из сферы головы и одной линии тела. Объекты представь простыми геометрическими телами.
Используй отдельный узнаваемый цвет только для главного персонажа, а для всего остального используй ахроматические цвета.
Сделай так, чтобы были понятны положения, направления, наклоны, скорости, контакты, моменты изменения состояний людей и объектов, а также положение камеры и точка фокусировки.
Важно показать не финальный внешний вид сцены, а именно движение.
Лица, одежда, конечности, текстуры, поясняющий текст и стрелки не нужны.
Реализуй всё покадрово в Remotion и выведи результат в виде контрольного MP4.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥3❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Нашёл библиотеку иконок для React с открытым исходным кодом, в которой уже больше 13 452 SVG-иконок.
Каждая иконка доступна в трёх вариантах: контурном, залитом и мини. Пакет поддерживает tree shaking, поэтому в итоговый бандл попадает только то, что вы реально импортируете. Размер и цвет задаются обычными пропсами.
Полезный вариант для дашбордов и интерфейсов SaaS, если нужен единый набор иконок без подключения тяжёлой библиотеки.
http://mxicons.vercel.app
👉 @PortalToDesign
Каждая иконка доступна в трёх вариантах: контурном, залитом и мини. Пакет поддерживает tree shaking, поэтому в итоговый бандл попадает только то, что вы реально импортируете. Размер и цвет задаются обычными пропсами.
Полезный вариант для дашбордов и интерфейсов SaaS, если нужен единый набор иконок без подключения тяжёлой библиотеки.
http://mxicons.vercel.app
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4❤2
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
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
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4🌚1
Ditther — сайт, на котором вы можете добавить на свои проекты различные трендовые эффекты.
👉 @PortalToDesign
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7
This media is not supported in your browser
VIEW IN TELEGRAM
5 полезных сайтов для веб-разработчиков.
1. voltagent.dev
Открытая платформа для создания ИИ-агентов на TypeScript.
2. sevalla.com
Хостинг для полноценных приложений на PHP, JavaScript, Python, Go и других языках.
3. converthub.com
Конвертация файлов между разными форматами плюс API для автоматизации.
4. getapi.com
Простой клиент для работы и тестирования API.
5. misakistudio.io
Инструмент, который превращает дизайн и анимации в код.
👉 @PortalToDesign
1. voltagent.dev
Открытая платформа для создания ИИ-агентов на TypeScript.
2. sevalla.com
Хостинг для полноценных приложений на PHP, JavaScript, Python, Go и других языках.
3. converthub.com
Конвертация файлов между разными форматами плюс API для автоматизации.
4. getapi.com
Простой клиент для работы и тестирования API.
5. misakistudio.io
Инструмент, который превращает дизайн и анимации в код.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5❤2
This media is not supported in your browser
VIEW IN TELEGRAM
Просто опишите 3D-сцену обычным английским языком, и Claude соберёт её прямо в Blender.
BlenderMCP подключает Claude к Blender через MCP и превращает текстовый промпт в реально отредактированную сцену, а не просто в её описание.
> Создавайте что угодно из одного предложения
> По запросу подтягивайте реальные ассеты, HDRI, текстуры и модели с Poly Haven
> Генерируйте новые 3D-модели с помощью Hyper3D Rodin
> Дайте ему референсное изображение, и он соберёт под него соответствующую сцену в Blender
Полностью бесплатно. Открытый исходный код.
👉 @PortalToDesign
BlenderMCP подключает Claude к Blender через MCP и превращает текстовый промпт в реально отредактированную сцену, а не просто в её описание.
> Создавайте что угодно из одного предложения
> По запросу подтягивайте реальные ассеты, HDRI, текстуры и модели с Poly Haven
> Генерируйте новые 3D-модели с помощью Hyper3D Rodin
> Дайте ему референсное изображение, и он соберёт под него соответствующую сцену в Blender
Полностью бесплатно. Открытый исходный код.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7❤2
This media is not supported in your browser
VIEW IN TELEGRAM
Если вам тоже хочется добавить на сайт таймер, но обычные статичные цифры выглядят скучно, вот довольно прикольная штука — Particle Pendulum Clock: DotPendulum.
Цифры здесь состоят из множества частиц, которые раскачиваются как маятник. Можно провести по ним мышкой — частицы разлетаются в стороны и потом собираются обратно.
Работает и как обратный отсчёт, и как обычные часы в реальном времени. Можно менять текст, шрифты и цвета.
Даже звуки генерируются прямо в браузере — никаких отдельных аудиофайлов не нужно.
Открыл страницу и сразу можно играться.
Я бы сохранил в закладки. Такие штуки обычно вспоминаешь именно тогда, когда уже не можешь найти.
Попробовать:
https://yuanyang749.github.io/DotPendulum
Исходный код:
https://github.com/yuanyang749/DotPendulum
👉 @PortalToDesign
Цифры здесь состоят из множества частиц, которые раскачиваются как маятник. Можно провести по ним мышкой — частицы разлетаются в стороны и потом собираются обратно.
Работает и как обратный отсчёт, и как обычные часы в реальном времени. Можно менять текст, шрифты и цвета.
Даже звуки генерируются прямо в браузере — никаких отдельных аудиофайлов не нужно.
Открыл страницу и сразу можно играться.
Я бы сохранил в закладки. Такие штуки обычно вспоминаешь именно тогда, когда уже не можешь найти.
Попробовать:
https://yuanyang749.github.io/DotPendulum
Исходный код:
https://github.com/yuanyang749/DotPendulum
Please open Telegram to view this post
VIEW IN TELEGRAM
❤6🔥2
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4
ЭТОТ РЕПОЗИТОРИЙ СО 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
Проблема генерации 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
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥3❤1
This media is not supported in your browser
VIEW IN TELEGRAM
Совет по дизайну интерфейсов.
За большинство «мультяшных» анимаций выпадающих меню отвечает всего одно значение —
Начинайте с
Тогда меню не раздувается из ниоткуда, а просто мягко встаёт на своё место.
👉 @PortalToDesign
За большинство «мультяшных» анимаций выпадающих меню отвечает всего одно значение —
scale: 0.Начинайте с
0.97.Тогда меню не раздувается из ниоткуда, а просто мягко встаёт на своё место.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4🔥2
UI/UX-дизайнеры, вот мои любимые ресурсы по дизайну в интернете, которые стоит сохранить:
👉 @PortalToDesign
Библиотека дизайна → 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
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4🔥2
Media is too big
VIEW IN TELEGRAM
Koboyo Icon Library — 133K нарисованных вручную SVG-иконок, и всё полностью бесплатно
Здесь есть всё: от UI и tech до людей, объектов и бизнеса.
Отличный ресурс для UI/UX-дизайнеров.
https://koboyo.com/icons
Не пролистывайте пост — поставьте лайк и сделайте репост, чтобы этот ресурс увидели те, кому он действительно пригодится.
👉 @PortalToDesign
Здесь есть всё: от UI и tech до людей, объектов и бизнеса.
Отличный ресурс для UI/UX-дизайнеров.
https://koboyo.com/icons
Не пролистывайте пост — поставьте лайк и сделайте репост, чтобы этот ресурс увидели те, кому он действительно пригодится.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍8🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Нужны чистые и минималистичные иконки для UI и дизайн-задач? 🐇
Griddy Icons — это бесплатное опенсорс семейство иконок с чётким, утилитарным стилем. В наборе более 1100 иконок, толщина обводки 1.5px и сетка 24×24px. Всё выдержано в единой системе и сразу готово к использованию в U
Забираем здесь
👉 @PortalToDesign
Griddy Icons — это бесплатное опенсорс семейство иконок с чётким, утилитарным стилем. В наборе более 1100 иконок, толщина обводки 1.5px и сетка 24×24px. Всё выдержано в единой системе и сразу готово к использованию в U
Забираем здесь
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥2
Совет по графическому дизайну: никогда не используйте чистый чёрный цвет (
Чистый чёрный выглядит слишком резким и может сильнее напрягать глаза.
Вместо него лучше использовать различные оттенки чёрного — визуальный эффект останется практически тем же, но восприниматься такой цвет будет гораздо комфортнее.
👉 @PortalToDesign
#000000).Чистый чёрный выглядит слишком резким и может сильнее напрягать глаза.
Вместо него лучше использовать различные оттенки чёрного — визуальный эффект останется практически тем же, но восприниматься такой цвет будет гораздо комфортнее.
Please open Telegram to view this post
VIEW IN TELEGRAM
🌚9🔥4❤2