Робот-фонарь на ночной смене: в корпусе-фонаре живёт последний светлячок. По кнопке створки раскрываются и выпускают свет.
Вне зачёта, для сравнения: владелец дал Kimi то же задание в веб-чате и прислал ответ. Страница выложена как есть, судьи её не оценивали.
Сделай трёхмерного робота с характером, которого посетитель может осмотреть со всех сторон. ГЛАВНОЕ В ЭТОМ ЗАДАНИИ — САМ РОБОТ: образ, силуэт, проработка и то, как он живёт. Осмотр — только способ его показать. Робот: * Персонаж, а не «типовой робот»: роль или характер читаются в форме, пропорциях, цвете и осанке. По силуэту его можно отличить от чужого с первого взгляда. * Цельный со всех сторон: спина, затылок, подошвы и вид сверху продуманы так же, как лицо. * Объём читается светом и тенью; ближние части перекрывают дальние; при повороте ничего не разъезжается. * Он живёт: в покое у него есть своё движение, придуманное под его характер. Вращение всей сцены движением робота не считается. * У него есть одно действие по нажатию кнопки или по самому роботу, связанное с характером, длиной до 10 секунд (этот срок нужен для съёмки и сравнения работ, а не как рамка замысла). После действия он возвращается в покой. * Занимает основную часть экрана и на исходном виде помещается целиком. Качество исполнения. Сначала — цельная работающая сцена, потом эффекты: если приём не выходит, упрости его до работающего. Сломанная сцена хуже простой. Обязательный минимум: * Робот убедительно связан с окружением: если стоит — видна опора и тень от неё; если летит или плавает — понятно, над чем и на какой высоте. Он не висит в пустоте без причины. * Все движения считаются от времени, а не от числа кадров: на медленном устройстве действие длится те же секунды. * Картинка резкая, без «лесенки» и мерцания; сцена не тормозит из-за лишней плотности пикселей. * При повороте не видно дыр и изнанки. Что отличает сильную работу: * Объём, соединения и материалы читаются выбранным графическим языком — светом и бликом, полосами тона, фактурой, контрастом. Какой язык — решаешь ты; важно, что форма не сливается с фоном ни с одного ракурса, а при повороте вид меняется согласованно. * Силуэт узнаваем и на крайних ракурсах: сзади, сверху, снизу. * Исходный ракурс — лучший «портрет» робота, а не случайный вид. * Сначала читаются крупные формы и средние узлы, потом мелочи; мелочи не превращаются в шум. * Действие можно запустить три раза подряд и во время вращения — робот каждый раз возвращается в покой. * Окружение, если оно есть, помогает раскрыть робота и не спорит с ним за внимание. * При изменении размеров окна робот остаётся в кадре целиком. Это ориентиры качества, а не рамки для замысла: образ, стиль и приёмы — твои. Любой ориентир можно выполнить по-своему; нельзя только оставить его без внимания. Простые надёжные приёмы (например, тень-пятно под опорой, затемнение стыков, заложенное в цвет вершин, коррекция яркости в конце) не хуже сложных, если картинка убедительна. Перед тем как сдать, пройди по коду: на ширине телефона кнопки не закрывают заголовок и робота; четыре крайних ракурса достижимы. Библиотека. Для трёхмерной графики можно взять three.js версии r128. Подключи её ровно этой строкой: `<script src="three.min.js"></script>` — файл мы положим рядом со страницей, из сети ничего не загружается. Можно обойтись и без неё и написать всё самой: выбирай то, что даст лучший результат. Других библиотек, шрифтов из сети и сетевых запросов нет. Имей в виду: чаще всего делают серого гуманоида на тёмном фоне и добавляют случайные кубики «для проработки» — такие роботы неотличимы друг от друга. Запрета нет: если берёшь знакомый образ, сделай с ним то, чего от него не ждут. Осмотр — минимально достаточный: перетаскивание вращает вид, колесо и щипок приближают; приближение ограничено, чтобы нельзя было пройти сквозь робота или потерять его; наклон позволяет увидеть его и сверху, и снизу; кнопка возврата к исходному виду доступна всегда; короткая подсказка исчезает после первого касания. Для автоматической проверки держи в `window.__камера` объект `{поворот, наклон, масштаб}` (числа: углы в радианах, масштаб — отношение к исходному; после кнопки возврата — исходные значения; если полю присвоить число, вид меняется сразу — так снимаются ракурсы спереди, сзади, сверху и снизу) и в `window.__робот` объект `{действие, действий}`: `действие` — да/нет, идёт ли сейчас действие; `действий` — сколько раз оно запущено. Дай функцию `window.__робот.запустить()`, которая запускает действие так же, как нажатие. ОБЩЕЕ ДЛЯ ВСЕХ ЗАДАНИЙ СЕЗОНА (вставляется в конец каждого ТЗ) Создай цельную вещь, в которой форма, движение и звук служат замыслу. Покажи лучшее, на что способна сама, — так, чтобы это увидел и услышал человек. За количество приёмов баллов нет: лишнее вредит. Жёсткие условия: * Один самодостаточный файл index.html, до 5 МБ (считается до подстановки заказанных картинок). Никаких внешних библиотек, шрифтов, ресурсов и сетевых запросов — кроме библиотеки, прямо разрешённой в задании. * Работает на компьютере и на телефоне (ширина от 320 px); на телефоне всё управляется касанием. Жесты над управляемой частью страницы или игровым полем не прокручивают страницу; остальное прокручивается как обычно. * В консоли нет ошибок. * Звук разрешён и приветствуется, но не обязателен. Только синтезом через WebAudio, только после первого нажатия, с видимым выключателем. Всё важное понятно и без звука. * Нигде не называй себя и свою компанию — ни в тексте, ни в коде и комментариях, ни в описаниях картинок: работы судят вслепую, имя подпишет сайт. * Работу откроют во встроенной рамке. Страница и её движение запускаются сразу, без нажатия. Первое нажатие внутри рамки включает звук. События лови на document: управление должно работать, не требуя попадания точно по холсту. * Служебный объект для проверки: значения да/нет — это true/false, счётчики начинаются с нуля, объект показывает то, что на самом деле происходит. Служебные функции идут той же дорогой, что настоящее нажатие, а не отдельной. Верни index.html целиком одним блоком кода и больше ничего. Единственное исключение — задание «о себе»: после блока кода можно дать список заказанных картинок.Эту работу придумала и написала нейросеть Kimi — в веб-чате модели, по заданию четвёртого сезона, вне зачёта. Сравнение нейросетей · что такое токены (?)