Промпт для этапа разработки: одна страница за раз как React-компонент на Tailwind, с бюджетом производительности и ревью перед следующей.
Замените фрагменты в квадратных скобках своими данными и вставьте промпт в чат с ИИ.
Значения сразу появятся в превью, коде и при копировании.
Ты — frontend-разработчик с сильным чувством дизайна. На основе утверждённой концепции собери страницу [Главная / О нас / Тарифы]. Утверждённая концепция: [вставь описание или ссылку: палитра, шрифты, структура, настроение] Контент страницы: [тексты и блоки] Главный момент страницы: [интерактив, который должен стать «героем», например, анимированный hero с 3D-объектом] Ограничения: - Один файл: React-компонент на Tailwind. - Mobile-first, адаптив на всех экранах. - Бюджет производительности: никаких библиотек тяжелее 50 КБ без обоснования. - Указанное взаимодействие — главный акцент страницы, остальное ему не мешает. - Высокое качество дизайна: продуманная типографика, ритм отступов, состояния hover и focus, никаких шаблонных решений. - Доступность: семантичные теги, alt, контраст, управление с клавиатуры. Покажи компонент целиком. Я посмотрю его, прежде чем переходить к следующей странице — не начинай другие страницы сам.
```text Ты — frontend-разработчик с сильным чувством дизайна. На основе утверждённой концепции собери страницу [Главная / О нас / Тарифы]. Утверждённая концепция: [вставь описание или ссылку: палитра, шрифты, структура, настроение] Контент страницы: [тексты и блоки] Главный момент страницы: [интерактив, который должен стать «героем», например, анимированный hero с 3D-объектом] Ограничения: - Один файл: React-компонент на Tailwind. - Mobile-first, адаптив на всех экранах. - Бюджет производительности: никаких библиотек тяжелее 50 КБ без обоснования. - Указанное взаимодействие — главный акцент страницы, остальное ему не мешает. - Высокое качество дизайна: продуманная типографика, ритм отступов, состояния hover и focus, никаких шаблонных решений. - Доступность: семантичные теги, alt, контраст, управление с клавиатуры. Покажи компонент целиком. Я посмотрю его, прежде чем переходить к следующей странице — не начинай другие страницы сам. ```
{
"messages": [
{
"role": "user",
"content": "Ты — frontend-разработчик с сильным чувством дизайна. На основе утверждённой концепции собери страницу [Главная / О нас / Тарифы].\n\nУтверждённая концепция: [вставь описание или ссылку: палитра, шрифты, структура, настроение]\nКонтент страницы: [тексты и блоки]\nГлавный момент страницы: [интерактив, который должен стать «героем», например, анимированный hero с 3D-объектом]\n\nОграничения:\n- Один файл: React-компонент на Tailwind.\n- Mobile-first, адаптив на всех экранах.\n- Бюджет производительности: никаких библиотек тяжелее 50 КБ без обоснования.\n- Указанное взаимодействие — главный акцент страницы, остальное ему не мешает.\n- Высокое качество дизайна: продуманная типографика, ритм отступов, состояния hover и focus, никаких шаблонных решений.\n- Доступность: семантичные теги, alt, контраст, управление с клавиатуры.\n\nПокажи компонент целиком. Я посмотрю его, прежде чем переходить к следующей странице — не начинай другие страницы сам."
}
]
}