NOEMA — автоматизация и ИИ

О шаблоне

Футуристичный технологический лендинг с выразительной типографикой и видео.

Как создавался шаблон

1. Этап 1

   Создай только первый значимый этап — законченный одностраничный сайт …

   Запрос: Создай только первый значимый этап — законченный одностраничный сайт консалтинговой студии по автоматизации процессов и внедрению ИИ. Пока не делай отдельные страницы, авторизацию или backend. Нужна оригинальная интерпретация строгого инженерного editorial-дизайна. Используй IBM Plex Sans для интерфейса и заголовков и IBM Plex Mono для нумерации, подписей, статусов и технических меток. Заголовки — тонкое начертание 300, крупный размер, плотный line-height и небольшой отрицательный letter-spacing. Палитра: почти белый фон, графитовый текст, очень тонкие холодно-синие линии сетки и один чистый электрический синий акцент. Никаких теней, скруглённых SaaS-карточек, градиентных кнопок и фотостокового корпоративного декора. Построй страницу как серию почти полноэкранных технических листов, объединённых общей координатной сеткой. В hero слева размести метку направления, крупное обещание и пояснение, справа — живую абстрактную визуализацию потока данных: тонкая полупрозрачная синяя лента из …

   Результат: Создан одностраничный лендинг Velvio в строгом инженерном editorial-стиле: hero с кодовой canvas-визуализацией потока, четыре направления автоматизации, три этапа Discover/Implement/Improve с SVG-схемами, четыре результата с живыми микроинтерфейсами, кейс Current/Rebuilt, три шага сотрудничества и финальный CTA с формой заявки. Без отдельных страниц, авторизации и backend.

2. Этап 2

   Повтори правку только как frontend-эффект существующей страницы. Не с…

   Запрос: Повтори правку только как frontend-эффект существующей страницы. Не создавай и не меняй backend, формы, интеграции, маршруты или данные. Добавь кастомный курсор для desktop fine pointer: маленькая синяя точка, вокруг четыре тонкие угловые скобки; рамка плавно следует за указателем и непрерывно медленно вращается. Ссылки и кнопки — магнитные цели: при наведении рамка притягивается к центру и подстраивает размер. Слой курсора имеет pointer-events: none. На touch, coarse pointer и prefers-reduced-motion системный курсор остаётся обычным. Остальное не меняй.

   Результат: На существующий лендинг Velvio добавлен frontend-эффект декоративного технического курсора: синяя точка и четыре угловые скобки, плавно догоняющая указатель вращающаяся рамка и магнитное поведение на ссылках и кнопках. Эффект включается только при точном указателе без reduced motion, слой не перехватывает события. Форма заявки переведена на платформенный адрес отправки з��явки; дизайн, контент, маршруты и микроинтерфейсы не изменены.

3. Этап 3

   Доработай только существующий кастомный курсор, не меняя дизайн, конт…

   Запрос: Доработай только существующий кастомный курсор, не меняя дизайн, контент, форму, маршруты и данные. Сделай поведение точно как у референса methodic: пометь магнитные цели классом .cursor-target или data-cursor-target — не только ссылки и кнопки, но и целиком интерактивные карточки, строки списка, вкладки и переключатели. На pointermove определяй цель через document.elementFromPoint(...).closest(...), бери её getBoundingClientRect() и плавно растягивай четыре угловые скобки до контура элемента с отступом 6 px. Центральная точка/крест остаётся строго под указателем. В свободном состоянии скобки медленно вращаются; при захвате цели выровняй рамку к ближайшим 90° и останови вращение, после ухода снова верни компактную вращающуюся рамку. Не ограничивай размер рамки фиксированными 260×120 — она должна охватывать всю цель. Пересчитывай контур при scroll и resize. Слой pointer-events:none. На touch/coarse pointer и prefers-reduced-motion полностью отключи эффект и оставь системный курсор. О…

   Результат: Доработал только кастомный курсор. Что изменилось в поведении: - магнитной целью теперь может стать любой элемент с `.cursor-target` или `data-cursor-target`, а также ближайший интерактивный родитель (ссылки, кнопки, поля, вкладки); - цель определяется на `pointermove` через `document.elementFromPoint(...).closest(...)`; - четыре угловые скобки плавно расходятся до полного прямоугольника цели с отступом 6 px — без прежнего ограничения по ширине и высоте; - точка и крест остаются строго под указателем, к центру цели не смещаются; - в свободном состоянии рамка компактная и медленно вращается, при захвате цели вращение останавливается с выравниванием к ближайшим 90°, после ухода возвращается компактная вращающаяся; - контур пересчитывается при прокрутке, изменении размеров окна и размеров самой цели; - слой остаётся `pointer-events: none`, на touch/coarse pointer и при `prefers-reduced-motion` эффект полностью отключается без перезагрузки, системный курсор сохраняется. Магнитными целям…

4. Этап 4

   Придумай для этой студии одно короткое оригинальное футуристичное наз…

   Запрос: Придумай для этой студии одно короткое оригинальное футуристичное название, которое не связано с Velvio и подходит компании по автоматизации процессов и внедрению ИИ. Сам выбери лучший вариант, затем замени на него бренд VELVIO во всех видимых местах сайта, заголовке страницы, метаданных и подвале. Сохрани тексты, дизайн, структуру, форму, анимации и курсор без других изменений. В итоговом сообщении отдельно напиши выбранное название, чтобы я так же переименовал проект.

   Результат: Лендинг студии автоматизации процессов и внедрения ИИ переименован в NOEMA: бренд заменён в шапке, логотипе, hero-описании, подвале, заголовке страницы и метаданных (description, Open Graph). Тексты, дизайн, структура, форма заявки, анимации и технический курсор сохранены; отправка формы переведена на платформенный маркер.

5. Этап 5

   Добавь в hero микро-CTA «Разобрать процесс» с якорем на форму заявки.

   Запрос: Добавь в hero микро-CTA «Разобрать процесс» с якорем на форму заявки.

   Результат: Создание изменений остановлено. Кредиты за эту попытку не списаны.