Заказчик прислал макет и ТЗ. В макете были комментарии с описанием анимаций (по примерам, которые он скинул). Также заказчик предоставил 3D-модели для интеграции на сайт.
Проблема: Заказчик уже пытался сверстать сайт через нейросеть. Результат был непригоден:
- Вёрстка разваливалась на любом экране, кроме одного фиксированного размера.
- Адаптива не было вообще.
- Код был перегружен мусором, костылями и не поддавался правкам.
- 3D-модели на сайте либо не грузились, либо тормозили.
Задача: Сверстать макет с нуля в соответствии с ТЗ, в кратчайшие сроки. Реализовать весь функционал из комментариев (анимации), подключить 3D-модели, сделать адаптив под все устройства. В будущем сайт должен был натягиваться на Laravel.
Я не стал чинить нейросетевой код — проще было переделать с нуля.
Что сделал:
- Полностью переверстал сайт на чистых HTML, CSS, JS. Без нейросетевого мусора и лишних костылей.
- Реализовал адаптив под все разрешения: десктоп, планшет, телефон. Изначальный код не адаптировался вообще.
- Интегрировал 3D-модели (предоставлены заказчиком) на сайт. Настроил корректную загрузку и отображение без тормозов.
- Реализовал все анимации строго по комментариям в макете (заказчик скидывал примеры — сделал один в один).
- Код подготовил для Laravel: всё разбито логически, вёрстка готова к натяжке без переписывания.
Результат
- Сайт свёрстан с нуля за короткий срок, как и требовал заказчик.
- Адаптив работает на всех устройствах — изначальный нейросетевой код этого не умел.
- 3D-модели корректно отображаются без падения производительности.
- Все анимации из ТЗ и макета реализованы точно по примерам заказчика.
- Код готов к натяжке на Laravel — правки не потребуются.
Примеры с 3D-моделями скинул заказчику сразу — в процессе работы демонстрировал промежуточные результаты.
Заказчик получил рабочий, адаптивный, анимированный сайт с 3D-моделями, которого у него не было после нейросети. Теперь премия получила професиональное сопровождение в виде сайта.