Участвую в конкурсе тг каналов

Недавно увидел анонс конкурса для авторских каналов
в тг, где можно будет показать себя, понетворкать и заработать немного уважения улиц. Суть проста — скинуть подборку из 3-4 своих самых интересных постов сюда @tg_contest_main. Зрители решат у кого контент интересный, а у кого херня не очень. Ну а дальше лучших будет отсеивать жюри и присуждать награды, одаривать подписчиками и все подобное 💃. Одной из причин принять участие было также и то, что в организаторах много людей на который я сам подписан и читаю — думаю, будет интересно)
В общем, вы знаете за кого болеть 🤨

💬 Тултип

Компетенции дизайнера | Как прокачивать навыки, чтобы не забросить через неделю

В прошлый раз мы приоритезировали цели по развитию компетенций с помощью матрицы ценность/усилия, а теперь поговорим о том, как претворить наши планы в жизнь и не ебануться по пути 😡

Ставим цели, которые действительно работают
Они должны быть конкретными, достижимыми и не быть похожими на «изучить UX» или «стать ахуенным дизайнером».
Вот как выглядит цель, которая реально работает:
Навык: Работа с метриками продукта
Где я сейчас: Знаю, что такое конверсия, но если дать мне дашборд в аналитике, буду тыкать наугад
Куда хочу прийти: Могу посмотреть на воронку, найти проблемные места и предложить конкретные решения
Критерий успеха: Запущу A/B тест своего решения и получу статистически значимый результат
Что буду делать:
1-3 июня: Прохожу курс «Аналитика для дизайнеров» (15 часов)
4-10 июня: Разбираюсь в Google Analytics, Яндекс Метрике нашего проекта, или просто пытаюсь понять, что там происходит (5 часов)
11-17 июня: Ищу 3 места, где можно улучшить конверсию (3 часа)
18-24 июня: Делаю A/B тест для одной из идей (8 часов)
Конкретные даты, конкретные действия, конкретный результат.

Как не потерять мотивацию на полпути
Канбан-доска — ваш лучший друг. Для того, чтобы эффективно двигаться нам потребуются три колонки в Notion или Trello:
1 колонка — Хочу изучить
Основы пользовательского тестирования
Принципы атомарного дизайна
Метрики HEART (что это вообще такое?)
2 колонка — Сейчас делаю
Читаю «На заставляйте меня думать» — на странице 67 из 200
Провожу интервью с пользователями — сделал 3 из 5
3 колонка — Уже умею
HTML/CSS на базовом уровне — теперь понимаю, что говорят разработчики
Создал свою первую дизайн-систему — пока простенькую, но работает
Прошел курс по UX-копирайтингу — наконец-то перестал писать «Нажмите здесь»

Воскресный ритуал честности
Каждое воскресенье садитесь с бокалом пива чашкой кофе и честно отвечайте себе на три вопроса:
Что на этой неделе получилось круто? Даже если это мелочь — хвалите себя
Где я налажал и почему? Важно знать свои ошибки, чтобы работать над ними
Что буду делать на следующей неделе? Максимум 2-3 конкретные задачи

Как не сгореть от амбиций
Чтобы не получить выгорание от нереализованных амбиций лучше взять один серьезный навык на 3–4 месяца:
Январь-март: Пользовательские исследования — от интервью до анализа результатов
Апрель-июнь: Системное мышление — как видеть продукт целиком, а не отдельными экранами
Июль-сентябрь: Аналитика — метрики, A/B тесты, данные
Октябрь-декабрь: Софт скиллы — презентации, менторинг, работа с командой

Правило 20 минут
Для всего остального есть микро-обучение. 20 минут в день — это почти ничего, но за год накапливается 80+ часов:
Читайте статьи в метро по дороге на работу
Смотрите туториалы во время обеда
Листаете кейсы других дизайнеров перед сном
Главное — регулярность, а не героические подвиги на выходных.

С чего начать прямо сейчас
Не откладывайте на понедельник. Выберите один навык, который можно потыркать уже на выходных. Сделайте что-то простое, но конкретное. Почувствуете прогресс — захочется двигаться дальше.
Развитие навыков — это не спринт, а марафон. Это про то, чтобы каждый день становиться чуть-чуть лучше вчерашнего себя. А через год оглянуться и ахуеть от того, кем ты стал 😎

Это был завершающий пост на тему развития дизайнерских компетенций. Спасибо тем, кто дошел до конца. Надеюсь, что каждый смог найти для себя что-то полезное ❤️

💬 Тултип

6 часов вайбкодинга
| Результат

В прошлый раз я написал о том, шо такое вайбкодинг и с чего начать изучение одного из его инструментов — Cursor. Сегодня хочу поделиться тем, что получилось сделать за 6 часов работы в Курсоре без определенного плана действий, просто с целью познакомиться с прилой. Я решил сделать наброски сервиса по сдаче недвижимости в аренду

Карточки объектов
На главной есть карточки объектов, информация для которых тянется с таблицы в Airtable, которую я подключил по API. Фотографии в галерее переключаются при наведении курсора. При клике карточка открывается в модальном окне с формой заявки — после отправки появляется тост с подтверждением успешной операции.

Избранное
Объект можно добавить в Избранное и можно затем просматривать этот список. У иконки Избранного есть каунтер, который показывает кол-во добавленных объектов. Избранное раскрывается в шторке, где карточки уже имеют горизонтальную верстку

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

Поиск
Сделал инпут text_autocomplete на главной странице, который при вводе значения показывает доступные из списка

Адаптация под мобилку
Полностью адаптировал под мобильную версию: хедер сворачивается в бургер-меню, модалки превращаются в bottom_sheet, тосты появляются сверху (на видео нет, но просто поверьте)

P.S. Я не заходил 2 недели в проект и когда зашел сегодня, то увидел, что карточки перестали выводиться, а когда исправил ошибку, то они начали выводиться на весь экран и наклыдываться друг на друг, в общем, цирк какой-то. Пришлось около часа ругаться с курсором и получилось восстановить прошлый прогресс, но в модалке не получилось пока победить верхний контейнер с фото и он все равно имеет внутренний пэддинг, но сейчас нет времени исправлять, поэтому залил как есть)

Гайд по эффективной работе с Cursor

Основное
Всегда советуйтесь с ИИ-агентом — что делать дальше и как лучше реализовать. Просите подробных объяснений непонятных моментов.
Используйте дизайн-систему с самого начала — это обеспечит консистентность интерфейса.
Избегайте Chat GPT — очень тупой. Используйте Gemini или Claude (доступен на платной версии).
Разделяйте архитектуру — делите большие проекты на Frontend и Backend части.

Обязательные файлы для проекта
В начале разработки создайте три ключевых файла:
scratchpad — для тестирования кусков кода без добавления в основной проект
memorybank — актуальная база знаний по проекту
Для создания: напишите "Инициализируй memory bank"
Для обновления: "Актуализируй memory bank" в конце чата
Для загрузки: "Изучи memory bank" чтобы ИИ был в курсе всего проекта
lessons_learned — для фиксации ошибок и предотвращения их повторения

Настройка правил проекта
Задайте Rules — правила работы ИИ с вашим проектом:
"Всегда используй TypeScript вместо JavaScript"
"Пиши краткие и понятные комментарии к функциям"
"Не используй сторонние библиотеки без моего разрешения"

Организация работы
Создавайте новый чат для каждой фичи — это предотвратит путаницу модели (не забывайте указывать контекст из предыдущих чатов).
Интегрируйте Context7 — это mcp сервер, который предоставляет актуальную документацию кода для лучшего понимания проекта
Репозиторий: github.com/upstash/context7
Можно кинуть ссылку и написать "use context7"

Дополнительные возможности
Изучите плагины Cursor — они значительно расширяют функциональность.
Подгружайте документацию — добавляйте ссылки на нужную документацию API и других инструментов.
Используйте .env файлы — для безопасного хранения API-ключей и других чувствительных данных.
Прикрепляйте документы — добавляйте ссылки на документы для последующих обращений.
MCP интеграция — используйте подключение MCP, это поможет воссоздать макеты прямо из Figma. (точность не 100%)

Был ли у кого-то опыт вайбкоддинга и какие остались впечатления? 👀

💬 Тултип

Нужна ваша поддержка

Всем привет!
Недавно я решил участвовать в конкурсе тг каналов и сейчас начался период голосования. Если вы считаете, что контент на канале заслуживает внимания, то можете выразить свою поддержку голосом)

Для того, чтобы голос засчитался, нужно подписаться на канал конкурса и выбрать свой любимый канал (@tooltipp) в этой форме 👀

Всем заранее спасибо 😘

💬 Тултип

Чувак, дай шесть!

Когда прошел курс «ИИ с 0 до PRO» и решил применить знания на практике 👌

💬 Тултип

Шаблон договора на создание дизайна

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

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

Так что — рекомендую сохранить и сэкономить свое время на поиске или составлении этого крайне важного документа, который сэкономит ваши нервы и деньги в долгосрочной перспективе 🤝

Скачиваем тут ➡️

💬 Тултип

Редизайн интерфейса | Подборка статей

Сегодня предлагаю на лайте почитать подборку статей про проектирование интерфейсов, а точнее про его редизайн. Посмотрим 🍿, как разные дизайнеры и команды подходят к переосмыслению отдельных сценариев или целых интерфейсов

Редизайн интерфейса системы мониторинга пациентов в реанимации

Редизайн хэдэра в сложном продукте (цифровизация строительства)

Как обновляли интерфейс касс самообслуживания, которыми будут пользоваться покупатели в 150 тысячах магазинах | 2 часть

Кейс с редизайном деталей стратегии в Т-инвестициях (Как мы похоронили метрики и вновь оживили :)

💬 Тултип

Тестовое задание в Кинопоиск📱

Делюсь неплохо выполненным тестовым заданием для Кинопоиска от дизайнера Алины Устьянцевой. Кейс разбит на смысловые блоки — исследование, user flow, персоны и сами макеты. Особенно меня порадовали нарисованные макеты ручкой в тетради, выглядит интересно и может выделить вас среди других кандидатов (или нет)

📱Смотреть фигму
📝Читать кейс на VC

Другие тестовые на канале 👨‍💻
Альфа банк
Алиса
Вкусвилл
База (50+) тестовых заданий

💬 Тултип

Лучшее, что есть на VC

1. Заходим в приложение VC
2. Бесконечно нажимаем на иконку уведомлений
3. Узнаем историю колокольчика

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

💬 Тултип

5 книг для дизайнера не про дизайн (а про бизнес)

Продуктовый дизайнер — это не только оператоp фигмы, но и стратегический партнер, который понимает, как его работа влияет на прибыль компании. А если вы планируете расти в тимлида или арт-директора, то без понимания бизнес-процессов вообще никуда. Хочу поделиться небольшой подборкой книг, которые помогут развить системной мышление и способность видеть общую картину

1. «От хорошего к великому» — Джим Коллинз
Автор проанализировал более 1000 компаний, что вывести для нас основной тезис — великие компании строят скромные трудоголики, которые сначала собирают команду мечты, а потом уже решают, что делать. Секретная формула проста: сначала «кто» (правильные люди в автобусе), потом «что» (куда ехать)

2. «TOYOTA. Путь к совершенству» — Цунёси Нодзи
История о том, как японская компания, которая начинала с ткацких станков, стала производить самые надежные машины в мире. Автор раскрывает 14 принципов Toyota, которые лежат в основе ее концепции бережливого производства. Как родилась методология Канбан и культура постоянных улучшений кайдзен (это очень близко с дизайном продукта)

3. «Клиенты на всю жизнь» — Карл Сьюэлл
Сьюэлл владеет автосалонами в Техасе и понял простую истину: машины у всех одинаковые, зато сервис может быть разным. Он начал мыть машины клиентам бесплатно, возить их на работу, пока идет ремонт, и устраивать шумные вечеринки для своих клиентов. Думаю, это близко к концепции 10-звездочного опыта Airbnb

4. «Эффективный руководитель» — Питер Друкер
Дедушка менеджмента учит, как не сойти с ума от дедлайнов. Книга от Питера Друкера — человека, который изобрел половину терминов менеджмента. В ней он рассказывает про эффективных руководителей, которые:
-Управляют временем — знают, куда уходят часы, и контролируют то немногое, что можно контролировать
-Фокусируются на результате — важны достижения вне стен офиса, а не просто «работа ради работы»
-Развивают сильные стороны — свои и команды, вместо бесконечной борьбы со слабостями
-Расставляют приоритеты — концентрируются на 2-3 ключевых задачах, которые дают максимум результата
-Принимают стратегические решения — думают о долгосрочной перспективе, а не тушат текущие пожары

5. «Корпорация гениев» — Эд Кэтмелл
Кэтмелл рассказывает, как удалось создать одну из самых известных мультипликационных студий, балансируя на грани банкротства. Важная книга для понимания, того как создать среду, где критика не убивает креатив, а наоборот — его развивает. Плюс научитесь принимать фидбек без желания удалиться из чата

Каких книг не хватает в этом списке? Делитесь в комментах👁

💬 Тултип

Как спроекировать лендинг для Tech продукта?

Дизайнер из Evil Martians проанализировал 100+ лендингов топовых инструментов (Linear, Vercel, Supabase) и выяснил, что реально работает в 2025. В качестве бонуса — готовый open source шаблон для быстрого запуска

Внутри:
Главный блок — 6 способов показать продукт (от анимированного UI до живых демо)

Нам доверяют — B2B логотипы vs цифры для соло-девелоперов, почему отзывы лучше встраивать прямо в фичи, а не в отдельный блок

Фичи — 5 способов рассказать историю продукта

Вспомогательные секции — когда нужен FAQ, стоит ли показывать цены на главной, и как интеграции добавляют веса продукту

Финальный CTA — последний шанс конвертнуть посетителя

Читать тут ➡️(VPN)

💬 Тултип

11 анимаций интерфейса в фигме

Когда по части логики и структуры в проекте все готово можно насыпать парочку бриллиантов , которые заставят сердце заказчика 💗 биться чаще при оценке вашей работы. Множество приемов можно реализовать не вылезая из фигмы. В файле собраны 11 приемов, которые можно разобрать на атомы и применять у себя в проектах

Забрать бриллианты 💎

💬 Тултип

База знаний дизайнера

Недавно я подготовил статью о том, как определить свои точки профессионального роста, как и куда двигаться дальше. Сегодня хочу дополнить её доской в Miro на которой я собираю полезные ссылки для роста дизайнера.
Я разбил доску компетенций на 5 крупных блоков — UI, UX, Исследование, Коммуникация и Продуктовое мышление. Сейчас заполнен блок UI, в нем уже 150+ ссылок и он регулярно пополняется. Здесь собраны статьи, полезные материалы и сервисы, которые помогут бустануть эффективность рабочего процесса 👨‍💻
Материалы разбиты по категориям — анимации, дизайн системы, илююстрации, шрифты и много чего еще. Сам регулярно залезаю на доску, когда нужно быстро найти пак иконок либо подсмотреть какую-нибудь дизайн систему

Сохраняйте себе, пользуйтесь и делитесь с корешами.
Знаете что-то огненное? Кидайте в комментарии — дополним коллекцию вместе 🔥

Смотреть доску ➡️

💬 Тултип

100+ часов вайбкодинга. Курсор начал лучше меня понимать

💬 Тултип

Библиотека UI элементов

Чекайте библиотеку всяких UI приколюх. Тут кнопки, инпуты, формы с прикольными анимациями. Все элементы можно забрать как компоненты на React, Tailwind или Html/CSS, а можно просто себе в фигму и там уже довести его до ума.
Мне кажется, неплохо, чтобы быстро найти вариант, как сделать свой концепт поживее и поинтереснее или вдохновиться на анимацию.
Этот ресурс уже на доске

Чекнуть ресурс ▶️

💬 Тултип

Анимации в интерфейсе

До анимаций в интерфейсе обычно доходят в последнюю очередь — когда кажется, что всё остальное уже доведено до идеала (никогда). Про анимации часто говорят, но действительно полезной информации о том, как их правильно использовать, не так уж много.
На русском языке внятных гайдлайнов я не нашёл, поэтому собрал подборку англоязычных источников. Эти материалы помогут разобраться:
· когда анимация действительно нужна;
· какой она должна быть, чтобы не мешать, а улучшать опыт пользователя;
· как корректно подготовить и передать анимацию разработчикам для продакшна

Как передают анимацию в разработку в Wise

Криптокошелек Family и про консистентность анимации в нем

Как устроены 2D,3D анимации и motion в Cash App

Material Design 3: Motion physics system

Animation/Motion дизайн токены от дизайнера LinkedIn

Дизайнер из IBM рассказывает про основные параметры анимаций

Если есть примеры русскоязычных статей про анимации в интерфейсах — жду ваши ссылки в комментах👁

💬 Тултип

Как делают вкусные сайты?

Недавно поймал себя на мысли: а как вообще делают все эти крутые 3D-анимации на сайтах, где можно покрутить модельку мышкой или подвигать что-то скроллом? Типа вот этого или вот этого

Расскажу, как сам это понял. В основе лежит WebGL — штука, которая напрямую общается с видеокартой и позволяет рисовать 3D прямо в браузере. Но в самом WebGL хер разберешься, поэтому обычно никто не пишет напрямую на нём. Вместо этого используют Three.js — такую библиотеку-надстройку. С ней уже всё проще: создал сцену, поставил камеру, закинул свет, подгрузил модель — и у тебя на экране готовая тридэшка.

Дальше встаёт вопрос: а как оживить эту сцену? Чтобы не просто стояло, а красиво двигалось, реагировало на скролл, меняло угол обзора при движении мышкой. Тут подключается GSAP — библиотека для анимаций. Она отвечает за плавность, тайминги и синхронизацию: камеры двигаются вместе со скроллом, объекты появляются и исчезают как по нотам, всё крутится и переливается.

И вот именно связка Three.js + GSAP даёт тот самый эффект, когда сайт не просто смотришь, а прям хочется «пощупать» и залипнуть. В общем, тот самый эмоциональный дизайн.

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

Покидайте в комменты сайты, которые вам настолько нравятся, шо прям не оторваться. Интересно будет глянуть 👁

💬 Тултип

Матрица DACI от Avito

В Avito заметили, что не все всегда понимают, кто и какую роль играет в задаче — это порождает хаос и замедляет принятие решений.
Чтобы навести порядок, ребята внедрили таблицу по модели DACI, где:

Driver — организатор, ведёт процесс и отвечает за результат.

Approver — заказчик, принимает и оценивает итоги.

Contributor — исполнитель, делает руками или консультирует.

Informed — информированный, просто в курсе.

Полезный инструмент, который поможет повысить прозрачность процессов и поможет организовать процессы в команде. Они еще и симпатичный лендос на эту тему подготовили

Смотреть таблицу 🔣

💬 Тултип

200 часов вайбкодинга | Первые результаты

Начну сначала. Мой друг в последнее время достаточно часто переезжал. В это период жизни он наиболее остро ощутил потребность в живом общении и как сложно, при нынешнем темпе жизни и с текущей тенденцией на уменьшение социальной активности, адаптироваться к новым местам, найти друзей, банально социализироваться и развивать нетворкинг. Одна из вещей которая помогла ему везде найти единомышленников это его велосипед)

У велосипедистов сейчас в целом достаточно развитое и сплоченное комьюнити. Причем все не ограничивается только поездками. Это и предварительная беседа за чашкой кофе, поездка, также отдых после поездки и ее обсуждение. В общем целый процесс. Бегуны тоже не отстают в это плане и имеют сильное комьюнити и несомненное преимущество в более низком пороге входа. И то и другое это отличные варианты провести время с кайфом, завести новые знакомства и принести пользу своему организму. Не всегда понятно с чего начать, где искать заезды, забеги и другие мероприятия. Так родилась идея сделать место, где можно будет найти единомышленников с которыми можно провести время за любимым хобби.

После этого все было по классике — анализ рынка, бенчмаркинг, концепт и затем проработка основных флоу. Помимо этого мы накидали роадмап, где думали о том, за счет чего мы сможем выделиться среди остальных cервисов, которые занимаются мероприятиями. Когда мы закончили с дизайном встал вопрос о том, а как вообще теперь все это реализовать и первой мыслью, естественно, было нанять разработчика, который нам это все запилит. Но бюджет на такие вещи сложно поддается анализу и прогнозу, поэтому мы конкретно застопорились, так как у нас нет понимания того, насколько будет востребован это продукт на рынке и сколько в него нужно вложить, чтобы создать mvp от которого уже можно отталкиваться. Ну и нанимая разработчика на такое дело любая доработка, проверка той или иной гипотезы будет выражаться для тебя в определенной сумме деняк

После долгих размышлений было принято решение попробовать навайбкодить mvp сервиса. Целью было попробовать возможности вайбкодинга ну и, в идеале, создать работающий прототип, который позволит собрать обратную связь и понять че мы вообще хотим дальше.
Что сейчас можно сделать:
1. Зарегаться через гугл и заполнить свой профиль
2. Просматривать ивенты, добавлять их в избранное и делиться
3. Создать свой ивент и загрузить туда GPX маршрута, который отобразится в виде интерактивной карты

Такие дела. Потыкайте интерфейс и скажите как вам)
А я в следующий раз расскажу подробнее про процесс, поделюсь основными инсайтами после 3 месяцев проведенных с Курсором, а также про дальнейшие планы

Посмотреть че там ➡️

💬 Тултип

Правила вайбкодинга
За последние 3 месяца я провел 200 часов в Cursor и хочу поделиться мыслями, которые сэкономят вам нервы и время, если вы решились повайбкодить. Я буду рассматривать Cursor, но эти правила подойдут и для других аналогов

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

Вы должны знать, что вы хотите
Нельзя просто написать прост «сделай страницу как у Apple по братски, чтоб красиво было». Ну точнее можно, но результат вас неприятно удивит. Чем конкретнее промт — тем меньше итераций до нормального результата. Это как с дизайнером: скажете «сделай что-нибудь красивое» — получите что-нибудь

Начинаем с дизайн системы
Не буду рассказывать про преимущества использования дизайн системы. Это просто нужно сделать, иначе каждая кнопка будет вырисовываться каждый раз заново и ваш проект будет готов тогда, когда ИИ наши рабочие места. Я использовал Ant Design, потому что в ней есть все (или почти все), что вам нужно. Можно также подключить Shadcn — более современный вариант. Или Framework7, если делаете что-то мобильное.
Главное — выберите одну систему и скажите Cursor использовать только её. Пропишите это в rules или просто напоминайте в каждом промте: «Используй компоненты из Ant Design». Иначе он начнет импровизировать, и вы получите адскую мешанину из самописных компонентов, библиотечных и вообще непонятно откуда взявшихся

Сначала план, потом действия
Допустим, стоит задача спроектировать целый сервис, и вы даже не знаете, с какой стороны начать. Прямо так и напишите в промте: «Мне нужно спроектировать сервис, но сначала я хочу, чтобы ты составил детальный план — как это эффективнее и лучше всего сделать, какие нюансы нужно учесть и так далее». Когда получите наброски плана, пробегитесь по оставшимся вопросам, а затем декомпозируйте задачу на части и начинайте. В плане написания промтов нет чего-то универсального, что подойдет к каждому случаю, но вы можете ознакомиться с официальной библиотекой промтов от команды OpenAI и что-то оттуда для себя подчерпнуть

Постановка задач среднего размера и брейншторминг
После того как у вас наметился план, беритесь за дело и задавайте задачи среднего уровня. Например: «Спроектируй главную страницу. На ней должен быть хедер, фильтры, карточки — как в макете». Если на странице будут использованы новые компоненты, обязательно напишите, чтобы Cursor брал их из дизайн-системы (которую вы уже, надеюсь, подключили). Но самое важное — дайте ему поразмышлять. Дополните промт фразами типа: «Пока не пиши код, поразмышляй о том, что я не учел. Какие у тебя еще есть вопросы? Как мое решение сделать более проработанным?». Это работает хорошо. Cursor начинает задавать вопросы, на которые вы сами не подумали: «А как должны вести себя фильтры на мобилке?», «А нужна ли пагинация для карточек?», «А что показывать, если карточек нет?». В общем, продумавыет разные корнерсы
Доработка и постановка маленьких задач. Максимум конкретики
Когда будет готова страница, то вам нужно будет пройтись по каждому блоку и контейнеру, рассказать, что в нем не так и попросить исправить. Нужно будет прям заходить в инспектор кода, скринить оттуда проблемное место и описывать то, что вы хотите сделать, а еще лучше давать скрин макета с правильной версткой. Во время исправлений можно попробовать обматерить ИИ, тогда эффективность вырастает на 4-6%. Не могу заверить, что это так, но по ощущениям работает 😅

Это была первая часть моих мыслей от опыта вайбкдинга. С какими проблемами вы сталкивались в вайбкодинге и что вас бесит больше всего?

💬 Тултип

Мокап за пару мин

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

Много бесплатных возможностей, жаль только, что экспорт в 2x разрешении убрали из бесплатных плюшек, но всё равно сервис остается одним из самых быстрых решений для презентации работ.

Если нужно быстро собрать визуал для портфолио или показать клиенту концепт в красивой обертке — рекомендую попробовать 👊

Заценить че там ▶️

💬 Тултип