SaaPro Marketing: Премиальный интерактивный сайт на Arabic RTL
Описание промпта
Промпт для создания высококлассного, кинематографичного и интерактивного веб-сайта для маркетингового агентства SaaPro. Сайт должен отражать философию 'Идея -> Опыт -> Конверсия -> Рост', использовать премиальную темную эстетику с акцентным бирюзовым цветом, продвинутые анимации (parallax, scroll-r…
- Генерирует полный код и дизайн для премиального, интерактивного веб-сайта маркетингового агентства на Arabic RTL. Включает сложные анимации, адаптивную верстку и структуру админ-панели.
- Помогает создать уникальное цифровое присутствие, которое визуально подтверждает компетенции агентства. Экономит время на проектирование UX/UI и базовую архитектуру.
- Владельцы креативных агентств, маркетологи, разработчики, ищущие вдохновение для сложных проектов.
Используй промпт для генерации кода. При необходимости разбей задачу на этапы: 1. Дизайн и CSS. 2. JS-анимации. 3. Структура HTML. 4. Логика админки. Уточни детали по стеку технологий перед генерацией.
Требуется понимание принципов работы с 3D-элементами в вебе, Arabic RTL версткой и оптимизацией производительности. Для запуска админ-панели потребуется бэкенд-инфраструктура.
Готовый к использованию код фронтенда, стили, скрипты анимаций и структура базы данных/админки для управления контентом.
Убедись, что шрифты поддерживают арабский язык. Проверь совместимость анимаций на мобильных устройствах. Замени placeholder-данные на реальные перед деплоем.
Промпт не предоставляет готовый хостинг или настроенный бэкенд. Требуется ручная интеграция с CMS или сервером. Сложные 3D-анимации могут требовать оптимизации под слабые устройства.
Промпт открыт для всех. Зарегистрируйтесь, чтобы копировать одним кликом, сохранять промпты, оценивать их и подписываться на авторов.
Текст промпта
ChatGPT / Claude / Llama
Войти для копирования
Выступи в роли ведущего фронтенд-разработчика и UX/UI дизайнера премиум-класса. Твоя задача — создать полный код и дизайн для интерактивного веб-сайта агентства SaaPro Marketing (сабпро). Сайт должен быть на арабском языке (RTL), с темной, кинематографичной эстетикой, использующей бирюзовый/мятный акцент, черный и темно-серый цвета. Философия бренда: 'Идея -> Опыт -> Конверсия -> Рост'.
Требования к дизайну и UX:
1. Визуал: Премиальный, футуристичный, не шаблонный. Hero-секция с крупным заголовком 'Мы превращаем идеи в влияние, а влияние — в рост'. Используй 3D-элементы (orb с логотипом S), реагирующие на курсор. Анимации: scroll-triggered reveals, parallax, magnetic buttons, smooth transitions. Избегай тяжелых курсоров.
2. Типографика: Крупная, читаемая арабская типографика. Используй clamp() для адаптивности.
3. Адаптивность: Полная поддержка Desktop, Tablet, Mobile. На мобильных упрощай тяжелые анимации, сохраняя красоту. Добавь prefers-reduced-motion.
Структура сайта:
- Header: Логотип слева, навигация справа (Главная, Услуги, Портфолио, О нас, Контакты), CTA-кнопка 'Начать проект'.
- Hero: Полноэкранный, с анимированным вводом и призывом к скроллу.
- Услуги (01): Секция с крупными заголовками и интерактивными карточками (Стратегия, Контент, Технологии, Рост, Визуал, AI).
- Методология: Визуализация пути клиента (Идея->Опыт->Конверсия->Рост).
- Портфолио: 'Избранные проекты'. Карточки с hover-эффектами. При клике — детальная страница с галереей (Lightbox) и встроенным видео (поддержка стриминга до 400MB).
- SaaPro AI Lab: Секция с футуристичным дизайном, показывающая использование AI.
- Результаты: Динамические счетчики (placeholders для данных).
- О нас: Не шаблонный текст, отражающий личность бренда.
- Контакты: Форма (Имя, Компания, Телефон, Email, Услуга, Бюджет, Детали) и ссылки на соцсети.
- Footer: Темный, с логотипом, контактами (info@saapro.sa) и правами.
Технические требования:
- Стек: HTML5, CSS3 (SCSS), Vanilla JS (или React/Vue по выбору, но с акцентом на производительность). Используй Semantic HTML.
- SEO: Meta-теги, Open Graph, семантическая разметка.
- Админ-панель: Реализуй backend (или структуру для CMS) с админ-входом. Функционал: управление проектами (CRUD, медиа), услугами, настройками компании, напоминаниями (Reminders) с приоритетами и статусами. Без регистрации пользователей.
- Производительность: Lazy loading, оптимизация видео (HTTP Range Requests), минимизация CLS.
Не используй готовые шаблоны или стоковые фото. Код должен быть готов к развертыванию, модульным и чистым. Сфокусируйся на том, чтобы сайт сам по себе демонстрировал креативность и технологичность агентства.Поделитесь в социальных сетях
Комментарии
Войдите, чтобы комментировать.
Комментариев пока нет.