Вільне дослідження 3D-містечка з сакурами в аніме-стилі

Будь ласка, використайте Three.js, щоб створити «вільне для дослідження 3D-містечко з сакурами в аніме-стилі» в одному HTML-файлі, а потім опублікуйте його як вебсторінку, якою можна ділитися. [Технічні обмеження] - Використовуйте лише three.js r128 (UMD-збірку) з cdnjs. Не завантажуйте зовнішні моделі чи зображення — генеруйте всі моделі, текстури та вивіски магазинів процедурно за допомогою коду й Canvas. - Використовуйте оригінальні назви всіх магазинів, написи та персонажів. Не імітуйте жоден реальний бренд або наявну роботу. - Використовуйте MeshStandardMaterial або MeshPhongMaterial. Уникайте високої металічності та карт відбиття середовища (на деяких комп’ютерах через них об’єкти можуть відображатися без кольору). - Об’єднуйте статичні об’єкти за матеріалом у невелику кількість мешів, щоб сцена працювала на звичайних комп’ютерах; додайте перемикач якості High / Medium / Low. [Сцена: «桜ヶ丘 (Сакураґаока)», невелике японське містечко весняного дня] 1. Торгова вулиця: головна вулиця, що простягається з півночі на південь, із понад 20 магазинами по обидва боки (раменною, кав’ярнею, велосипедною крамницею, книгарнею, квітковим магазином, крамницею японських солодощів, аптекою, міні-маркетом тощо). Кожен магазин має: багаторядкову вивіску (назва магазину + назва англійською + номер телефону), смугастий навіс із фестончастим краєм, заглиблений вхід із добре помітною глибиною інтер’єру та вуличну вітрину (ящики з фруктами, стійку з журналами, вітрину зі зразками їжі, перукарський стовп, що обертається). На верхніх поверхах є вікна, кондиціонери, балкони з розвішаною білизною та телевізійні антени на дахах. 2. Деталі вулиці: електричні стовпи з безліччю повітряних дротів, декоративні вуличні ліхтарі з прапорцями торгової вулиці, гірлянди фестивальних ліхтариків, квадратна тротуарна плитка з жовтою тактильною смугою, решітки зливостоків, знаки «止まれ» («Стоп») і автобусна зупинка. 3. Залізничний переїзд і потяги: двоколійна залізниця. Коли наближається потяг, червоні вогні переїзду блимають почергово, лунає дзвінок, а шлагбауми опускаються. Приміський потяг із двох вагонів зупиняється на станції приблизно на 14 секунд, а потім вирушає. Вікна прозорі, тож усередині видно сидіння та поручні. 4. Станція з острівною платформою: табличка з назвою станції, навіс над платформою, лавки та торговельний автомат. 5. Площа із сакурою: столітня вишня з круговою лавкою навколо стовбура. 6. Святилище Інарі: великі кіноварні торії та ряд малих торіїв, кам’яні ліхтарі, статуї лисиць, зал для молитов (дах мідно-зеленого кольору, тіґі, кацуоґі, скринька для пожертв, підвішений дзвін), фонтан для ритуального обмивання (темідзуя), статуї дзідзо, таблички ема, священне дерево та гравійне покриття. 7. Набережна річки: два ряди сакур, що утворюють квітковий тунель, ліхтарі, річка, будинки на протилежному березі та далекі гори. [Як створити сакури (ключова частина)] - Орієнтуйтеся на сорт Сомей-Йосіно: стовбур низько розділяється на 3–4 основні гілки, які рекурсивно розгалужуються ще на три рівні. Гілки розходяться в боки й трохи звисають на кінчиках, утворюючи загальну форму парасольки. - Створіть крону з десятків тисяч «карток скупчень цвіту»: намалюйте на Canvas п’ятипелюсткові квіти (з виїмками на кінчиках пелюсток, червонуватими серединками та тичинками), а позаду квітів додайте м’який рожевий базовий шар. Використовуйте alphaTest і двобічне відображення карток. - Додайте всередину крони кілька рожевих заповнювальних скупчень для надання об’єму. Зовнішні та верхні частини мають бути світлішими, а внутрішні й нижні — із теплими рожевими тінями. - Використовуйте ніжно-рожевий, а не неоново-рожевий колір. Крона має м’яко коливатися на вітрі, земля під кожним деревом — бути вкрита килимом опалих пелюсток, а пелюстки — постійно падати в повітрі (за допомогою шейдера). [Персонажі] - Понад 20 учнів і містян в аніме-стилі: анімація ходьби із суглобами колін та ліктів, намальовані на Canvas аніме-обличчя (великі очі, відблиски, рум’янець), які моргають, чубчики з окремих пасом, різноманітні зачіски (довге волосся, боб, хвіст, що погойдується, два хвостики), матроські форми, шкільні піджаки та повсякденний одяг. Відображайте персонажів із двотоновим cel-shading і темним контуром. - Люди ходять вулицею, спілкуються на площі, чекають на платформі, моляться у святилищі та їздять велосипедами вздовж набережної. [Транспорт] - Створюйте автомобілі екструдуванням силуету в профіль (із колісними арками, вікнами, фарами, японськими номерними знаками та колесами, що обертаються). Автомобілі зупиняються перед залізничним переїздом і, поки лунає дзвінок, чекають, доки шлагбауми піднімуться. [Освітлення та час доби] - М’який вигляд аніме-фону: блакитне небо з білими хмарами (шейдер), легкий серпанок удалині та тіні з синьо-фіолетовим відтінком. - Додайте перемикання між режимами Afternoon / Dusk / Night Sakura. Уночі засвічуються вікна, ліхтарі та вуличні лампи. [Керування] - Від першої особи: WASD — ходьба, Shift — біг, Space — стрибок, F — політ, миша — огляд навколо (блокування вказівника), цифрові клавіші — телепортація до кожної локації, H — приховати інтерфейс, M — вимкнути звук. - На мобільних пристроях: перетягуйте пальцем по лівій половині екрана для ходьби, а по правій — для огляду навколо. - Увімкніть зіткнення, щоб гравець міг піднятися на платформу та сходами. - Використовуйте Web Audio для генерації атмосферного звуку: шуму вітру, співу птахів, дзвінка на переїзді та звуків руху потяга.