overcreator
179 subscribers
18 photos
9 videos
10 links
overthinker => overcreator

Канал о цифровом дизайне и вайбкоде. Показываю процесс и размышления.

автор: AI и @veevtamm
Download Telegram
Ещё про личные панели в проектах — и как их собирать.

Вот какие у меня, например, уже были:
• Сетка — чтобы быстро сверять отступы и колонки поверх живого сайта.
• Панель состояний — чтобы не проходить весь флоу вручную, а сразу переключаться между состояниями сайта и отдельных элементов.
• Панель анимаций — easing, длительности, scale, replay. Крутишь параметры и сразу видишь, как это ощущается.

Как делать: сначала понять, что хочешь настраивать. Потом попросить собрать под это UI — из элементов сайта, из shadcn/ui и других библиотек или нарисовать самому в Figma. Можно приложить скрины или сайты с референсами.

С первого раза нейронка редко выдаёт идеальный результат. Это всегда итерации. Главное — чётко понимать, какой результат вы хотите получить.
❤3
This media is not supported in your browser
VIEW IN TELEGRAM
Сетки и направляющие нужны не только в Figma.

В Magazine Index я собираю макет на колонках и направляющих — и ту же логику переношу на сайт. Сетка становится общим языком: видно, откуда блок и на сколько колонок он тянется. На сайте это уже реальная раскладка, а не «примерно по центру».

С агентом лучше говорить так же, как с человеком, которому объясняешь макет: колонки, направляющие, отступы — а не «чуть вправо». Тогда у него есть точные ориентиры, и результат ближе к замыслу.

https://magazindex.com
❤4🙏3
This media is not supported in your browser
VIEW IN TELEGRAM
Увидел в инсте простую анимацию и захотел быстро сделать галерею на её основе. Собрал за несколько промптов. Figma использовал только чтобы поправить панель настроек. Доделать анимации, вставить текст — и сайт готов.

Сейчас простые страницы можно делать за пару вечеров.

https://experimental-steel.vercel.app/exp-glr-1
❤3
Forwarded from Gurov+ (Сергей)
Media is too big
VIEW IN TELEGRAM
Выложил новый стенд. Главное, что хочу сказать про него: движение само по себе алгоритмично. И это не потрогаешь на макете, когда работаешь исключительно с Figma.

О своем подходе к вайб кодингу я расскажу в следующем сообщении👉

Этот макет я собрал за четыре часа. Три с половиной из них ушли на адаптивность и анимацию. Полчаса — просто на то, чтобы перенести макет в браузер.

Хотя, вру: никакого макета здесь не было. Дизайн полностью построен в диалоговом окне Claude Code.

https://mdl-gr2.vercel.app
❤2
Сайт Acid Crunch попал на Awwwards. У кого есть возможность проголосовать — очень поможете:
https://www.awwwards.com/sites/acid-crunch
❤6❤‍🔥1👍1
Немного выпал из постинга из-за небольшого отдыха и восстановления для менталочки. Не забывайте трогать траву время от времени)
Плавно возвращаюсь в рабочий ритм:
❤3
Please open Telegram to view this post
VIEW IN TELEGRAM
❤1👍1
This media is not supported in your browser
VIEW IN TELEGRAM
И на сладкое: небольшой тизер учебного стенда по сеткам, где можно будет протестировать каждый вид и посмотреть как он работает в динамичном формате.
❤4
overcreator
GIF
Зачем открывать Афтер, когда можно завайбкодить
❤2👀1
overcreator
потрогать
реклама вариативной Pragmatica Next
✍1
Зашел посмотреть статистику в Cursor.

3.2 миллиарда токенов за последний месяц. Я думал там больше🫣

А так Grok 4.6 Medium для большинства задач отлично подходит. Fable чисто под большой анализ или когда мне лень что-то рисовать. Кими просто пробовал.
❤3
This media is not supported in your browser
VIEW IN TELEGRAM
А так сейчас сижу настраиваю анимации для сайта, который мы делаем с Алиной(@alinferno)

Заодно проверяю новую часть панели для анимаций.
❤5
Смотрю много новых людей подписалось. Всем спасибо! Может есть какие-то вопросы или предложения?
Чем я пользуюсь каждый день. Попросите агента поставить.

portless — когда открыто несколько проектов сразу. У каждого своё имя в браузере, они не мешают друг другу.
Skills Эмиля Ковальского — когда доводите мелкое движение: появление, уход, кнопка. Вместе с ними его словарь анимаций — как назвать жест, чтобы агент понял с первого раза, а не «сделай плавнее».
shadcn/ui — когда нужен быстрый интерфейс: формы, списки, служебные экраны. Если хотите быстро собрать свою панель* или какой-то служебный интерфейс. Даже нейронка с плохим вкусом с этой библиотекой рисует прилично.
Lenis — когда нужен плавный скролл. Даже колёсиком мыши сайт едет приятно.

* моя панель пока еще в процессе работы, но через какое-то время выложу.
❤9