Portalsni ishga tushirish, yaratish va o‘rganish: yaratilgan 471 ta 3D olam

Portals nima?

Portals — 471 ta generatsiya qilingan 3D dunyo bo‘ylab qo‘lda boshqarilmaydigan brauzer sayohati. Kamera oldindan belgilangan yo‘nalish bo‘ylab harakatlanadi, portalga yetib boradi va kesish yoki qorayishsiz to‘g‘ridan-to‘g‘ri keyingi ishlayotgan dunyoga o‘tadi. Parvozni boshqarmaysiz, ammo uning tezligi, ko‘rinishi, ovozi, grafikasi va dunyo tanlovini boshqarishingiz mumkin.

Loyiha JavaScript va three.js yordamida yaratilgan. Har bir dunyo o‘z geometriyasi va teksturalarini brauzerda generatsiya qiladi, ovozi esa ijro vaqtida sintezlanadi. Dunyolar tashqi 3D modellari, tekstura rasmlari yoki ovoz fayllarini yuklamaydi. Loyiha statik sayt hamdir: unga hisob, ilova serveri yoki kuzatuv xizmati kerak emas.

Repozitariy 2026-yil 9-noyabr holatiga ko‘ra s8f relizini ifodalaydi. Ushbu relizda taxminan 1,4 million qator JavaScript va 471 ta dunyo mavjud.

Asosiy xususiyatlar

• 471 ta generatsiya qilingan dunyo: To‘plam yovvoyi tabiat, shaharlar, okeanlar, interyerlar, osmonlar, begona sayyoralar manzaralari, tarixdan oldingi sahnalar, san’atdan ilhomlangan joylar, adabiy dunyolar, kino va televideniyedan ilhomlar, qadimiy mo‘jizalar hamda AI haqidagi ichki hazillarni qamrab oladi.
• Silliq portallar: Joriy dunyo va portal ortidagi dunyo bir vaqtda ishlaydi, shu sababli kamera o‘tish ekranisiz kesib o‘ta oladi.
• Protseduraviy resurslar: Geometriya, teksturalar va ovoz odatiy dunyo resurslari sifatida yuklanmaydi, balki brauzerda yaratiladi.
• Avtomatik parvoz: Har bir dunyo kamera yo‘nalishi va davomiyligini ta’minlaydi. Aksariyat parvozlar taxminan 40–50 soniya davom etadi.
• Moslashuvchan grafika: Avtomatik rejim grafik karta asosida sifat darajasini baholaydi va harakat silliqligini saqlash uchun chizish aniqligini moslaydi.
• Mahalliy sozlamalar: Ko‘rilgan dunyolar, sevimlilar va sozlamalar brauzer xotirasida saqlanadi.
• Galereya va sayohatlar: Galereyada barcha dunyolar ko‘rsatiladi, 20 ta saralangan sayohat esa tanlangan dunyolarni belgilangan tartibda namoyish etadi.
• Statik joylashtirish: Ishlab chiqarish yig‘ilmasi statik veb-xost tomonidan taqdim etilishi mumkin bo‘lgan oddiy fayllarni dist ichida yaratadi.

Talablar

Sizga Node.js 18 yoki undan keyingi versiyasi va Git kerak. Manba kodining bevosita ko‘rinishini o‘rnatish yoki yig‘ish bosqichisiz ishga tushirish mumkin. Maxsus grafik karta ma’qul, ammo loyiha telefonlar va eski noutbuklarda pasaytirilgan sifatda ishlashi mumkin.

Node.js versiyangizni tekshiring:

node --version

Agar natija 18-versiyadan oldingi versiyani ko‘rsatsa, davom etishdan oldin Node.js’ni yangilang.

Portals’ni manba kodidan bevosita ishga tushirish

1. Repozitariyni klonlang

git clone https://github.com/emollick/ai-portals.git
cd ai-portals

2. Mahalliy manba serverini ishga tushiring

npm start

Brauzerda http://localhost:8000 manzilini oching. Bu manba daraxtini avval paket o‘rnatish yoki kompilyatsiya qilishni talab qilmasdan, mavjud holicha taqdim etadi.

Manba ko‘rinishida ikkita kutiladigan cheklov mavjud. Uning galereyasi yangi qo‘shilgan dunyolarni aniqlay olmaydi yoki generatsiya qilingan tavsiflar sahifasini ko‘rsata olmaydi. Birinchi tashrifda brauzer konsoli atlas.json fayli yo‘qligi haqida ham xabar beradi, chunki bu fayl faqat yig‘ish jarayonida yaratiladi.

Ishlab chiqarish yig‘ilmasini yaratish va ko‘rish

Yig‘ish bog‘liqliklarini o‘rnating, joylashtirish paketini yarating va uni ko‘rish serverini ishga tushiring:

npm install
npm run build
npm run preview

Yaratilgan statik sayt dist ichiga yoziladi. Uni tekshirish uchun http://localhost:8001 manzilini oching.

Yig‘ish loyihaning skriptlarini esbuild yordamida kichraytiradi va faqat joylashtirish uchun kerak bo‘ladigan quyidagi resurslarni yaratadi:

• Har bir dunyo va sayohat uchun kichik ulashish ko‘rish sahifasi.
• Har bir dunyo va uning tavsifini ko‘rsatuvchi oddiy sahifa.
• Qaysi dunyolar yangi ekanini qayd etuvchi galereya ma’lumotlari.
• Xosting konfiguratsiya fayli.

s8f relizini qayta yaratish

Yig‘ish buyrug‘i reliz belgisini qabul qiladi. Repozitariy hujjatlariga ko‘ra, quyidagi buyruq 2026-yil 9-noyabrda amaldagi s8f reliz faylini faylma-fayl va baytma-bayt qayta yaratgan:

npm run build -- --stamp s8f

Ishlab chiqish vaqtida oddiy yig‘ishdan foydalaning. Reliz metama’lumotlari kerak bo‘lganda yoki hujjatlashtirilgan relizni qayta yaratmoqchi bo‘lsangiz, belgidan foydalaning.

Asosiy boshqaruv va foydalanish

Portals avtomatik ravishda parvozni boshlaydi. Ovoz sukut bo‘yicha o‘chirilgan, shuning uchun sintez qilingan saundtrekni eshitmoqchi bo‘lsangiz, S tugmasini bosing. Klaviatura boshqaruvlari:

• Space: Parvozni to‘xtatish yoki davom ettirish.
• O‘ng strelka: Keyingi portalga tezroq yetib borish.
• S: Ovozini yoqish yoki o‘chirish.
• G: Kamerani barqarorroq va ufqni tekisroq qilish uchun Gentle rejimini yoqish.
• H: Joriy dunyoni sevimli sifatida saqlash.
• P: Rasmni saqlash.
• I: Galereya, sayohatlar va qidiruv interfeysini ochish.
• O: Grafika, kamera, san’at uslubi, sayohat, hamroh va kun vaqti parametrlarini ochish.
• F: To‘liq ekran rejimiga kirish yoki undan chiqish.

Sichqonchani harakatlantirsangiz, ekran pastida boshqaruv paneli paydo bo‘ladi. Unda klaviatura boshqaruvlariga mos tugmalar, shuningdek Pace slayderi va Earthly to Strange slayderi mavjud. Oynalar tor bo‘lganda, slayderlar parametrlar interfeysiga ko‘chiriladi.

Foydali dastlabki sayohat

1. Manba yoki production preview’ni ishga tushiring.
2. Ovozni yoqish uchun S tugmasini bosing.
3. Oddiy portal kesib o‘tishini kuzatish uchun bitta to‘liq dunyo namoyish etilishini kuting.
4. Kamera harakati noqulay bo‘lsa, G tugmasini bosing.
5. I tugmasi bilan galereyani oching va to‘liq to‘plamni qidiring yoki ko‘zdan kechiring.
6. G‘ayrioddiy dunyolar qanchalik tez-tez tanlanishini boshqarish uchun Earthly to Strange qiymatini sozlang.
7. Sevimli sifatida saqlamoqchi bo‘lgan dunyoni uchratsangiz, H tugmasini bosing.

Uzluksiz portallar qanday ishlaydi

Kesib o‘tishdan taxminan bir soniya o‘tgach, dvigatel keyingi dunyoni tanlaydi. U dunyoni tasvirlar orasida bir necha millisekunddan boshlab quradi, so‘ng u ko‘rinmay turgan paytda uning shaderlari va teksturalarini oldindan tayyorlaydi.

Manzil shunchaki harakatsiz preview emas. Ikkinchi kamera har bir kadrda keyingi ishlayotgan dunyoni portal ochilishiga tasvirlaydi. Kamera darvozaga yetib kelishidan sal oldin dvigatel manzilni joriy dunyoga aylantiradi va parvozni davom ettiradi. Tayyorlash tugamagan bo‘lsa, joriy parvoz sekinlashadi va portal oldida kutadi.

Dunyolar qanday tanlanadi

Tanlagich tashrif buyuruvchi hali ko‘rmagan dunyolarga ustuvorlik beradi. Tashrifning dastlabki o‘n ikki dunyosi davomida u loyiha baholovchi agentlari eng yuqori baholagan dunyolarni afzal ko‘radi. Har bir dunyo 1 dan 5 gacha bo‘lgan sifat darajasiga ega va bu darajalar qaysi tajribalar avvalroq ko‘rinishini belgilashga yordam beradi.

Tanlagich kontrastni ham izlaydi. U joriy manzaradan turi, yorqinligi yoki harorati bilan farq qiladigan manzilni tanlashga moyil. Earthly to Strange sozlamasi g‘ayrioddiyroq yozuvlar qanchalik tez-tez ko‘rinishini boshqaradi.

Loyiha tuzilishini tushuning

Eng muhim fayl va kataloglar:

• index.html: Ilova sahifasi.
• src/main.js: Klaviatura boshqaruvlari, parametrlar va pastki boshqaruv paneli.
• src/core: Parvoz, portallar, dunyo tanlash, ovoz va grafik sifat tizimlari.
• src/kit: Osmon, suv, relyef, o‘simliklar, hayvonlar, binolar va interyerlar kabi umumiy dunyo qurish komponentlari.
• src/worlds: Har bir dunyo uchun modul, dunyo reyestri va kirish zali.
• src/parts: Ayrim dunyalar ishlatadigan asosiy dekoratsiya qismlari.
• src/extras.js: Attraksionlar, hamrohlar va badiiy uslublar ro‘yxati.
• src/rides, src/companions va src/styles: Ushbu qo‘shimchalarning amalga oshirilishi.
• src/ui: Galereya va ulashish kodi, shuningdek saytning yagona uslublar jadvali bo‘lgan ui.css.
• vendor/three: Biriktirilgan three.js kutubxonasi.
• thumbs: Galereya eskiz rasmlari.
• design: Build jarayoni o‘qiydigan dunyo matnlari va relizga kelish jadvallari.
• tools: Build skripti va mahalliy server.

Dunyo moduli qanday tuzilgan

Dunyo src/worlds ichidagi fayldir. Uning default eksporti build funksiyasini o‘z ichiga olgan obyektdan iborat. Dunyo src/worlds/index.js faylida sarlavhasi, turi va izohi bilan ro‘yxatdan ham o‘tkazilishi kerak, chunki tanlagich va galereya ushbu ro‘yxatni o‘qiydi.

build funksiyasi uchta asosiy elementni qaytaradi:

• three.js sahnasi.
• Kamera yo‘li.
• Parvoz davomiyligi.

Aksariyat dunyolar asosiy dekoratsiyasini src/parts ichidagi alohida faylga joylashtiradi. src/kit dagi umumiy vositalar qayta foydalaniladigan komponentlarni taqdim etadi, shuning uchun har bir dunyo umumiy manzarani mustaqil ravishda amalga oshirishi shart emas.

Dunyolarni o‘rganish yoki kengaytirish uchun xavfsiz ish jarayoni

1. Tushunmoqchi bo‘lgan muhit turiga o‘xshash mavjud dunyoni src/worlds ichidan tanlang.
2. Sahna qanday yig‘ilganini ko‘rish uchun uning importlarini src/parts va src/kit ichigacha kuzating.
3. Repozitoriyning amaldagi obyekt tuzilishi va kamera yo‘li qoidalarini o‘rganish uchun uning default eksporti va build funksiyasini tekshiring.
4. Kerakli sarlavha, tur va izoh metama’lumotlarini ko‘rish uchun src/worlds/index.js dagi tegishli ro‘yxatdan o‘tkazuvni tekshiring.
5. Manba kodini tez sinash uchun npm start buyrug‘ini ishga tushiring.
6. Yaratilgan galereya va ulashish resurslarini tekshirish uchun production build yarating.

Bu repozitoriy odatdagidan ancha katta, shuning uchun hujjatlashtirilmagan API’larni taxmin qilish yoki modulni noldan yaratishdan ko‘ra, yaqin mavjud dunyoni moslashtirish xavfsizroq.

Ovoz va grafikalar xatti-harakati

Ovoz sintezi

Har bir dunyo sekin ijro etiladigan akkord va bir nechta qo‘ng‘iroq tovushini oladi. Aksariyat dunyolarda shamol, suv, xona shovqini yoki barqaror kosmik g‘uvillash kabi sokin fon tovushi ham ishlatiladi. Dunyo yomg‘ir, to‘lqinlar, qushlar va uzoqdagi qo‘ng‘iroqlarni o‘z ichiga olgan o‘n to‘qqizta mavjud effekt orasidan tanlangan uchtagacha qatlamni qo‘shishi mumkin. Brauzer audio dvigateli bu tovushlarni audio fayllarni yuklamasdan sintez qiladi.

Grafik sifatini avtomatik boshqarish

Grafika Auto holatiga o‘rnatilganda, Portals grafik karta asosida mos sifat darajasini hisoblaydi. Keyin silliq parvozni saqlashga yordam berish uchun tasvir chizish aniqligini oshiradi yoki pasaytiradi. Eskiroq noutbuk yoki telefonda talabchanroq sozlamalarni sinashdan oldin Auto rejimini yoqilgan holda qoldiring.

Ilg‘or maslahatlar

Qulaylik uchun Gentle rejimidan foydalaning

Barqarorroq kamera va tekis ufqni saqlash uchun G tugmasini bosing. Oddiy parvoz noqulaylik tug‘dirsa, avval shu sozlamani sinab ko‘ring.

Manba va yig‘ilgan versiyalarni sinang

Tezkor takrorlash uchun manba serveridan foydalaning, ammo joylashtirishdan oldin har doim dist yig‘ilmasini tekshiring. Ayrim galereya ma’lumotlari, tavsif sahifalari, ulashish ko‘rinishlari va hosting sozlamalari faqat yig‘ishdan keyin mavjud bo‘ladi.

Faqat sahna ko‘rinishini emas, portal tayyorligini ham sinang

Dunyo o‘tishdan oldin tayyor bo‘lishi kerak. Dunyo kodini o‘zgartirganda, manzil sahnasining o‘zi bilan birga uning portaliga yaqinlashish jarayonini ham kuzating. Og‘ir generatsiya yoki shader tayyorlash parvozning kutish vaqtida sekinlashishiga olib kelishi mumkin.

Takrorlanadigan ketma-ketliklar uchun sayohatlardan foydalaning

Portals dunyolarni belgilangan tartibda namoyish etadigan 20 ta sayohatni o‘z ichiga oladi. Misollar qatoriga do‘l donasidan chuqur dengizgacha boradigan One Drop of Water hamda tirik hujayra ichidan boshlanadigan Zooming Out kiradi. Oddiy tanlagich taqdim etadigan tajribadan ko‘ra yo‘naltirilganroq tajriba kerak bo‘lganda, belgilangan ketma-ketliklar foydalidir.

Xotira va maxfiylik chegaralariga rioya qiling

Ilovaning backend qismi yo‘q va u hisob, kuzatuv, sevimlilar yoki sozlamalar haqidagi ma’lumotlarni serverga yubormaydi. Sevimlilar yoki ko‘rilgan dunyolar bilan bog‘liq muammolarni tuzatishda bu qiymatlar brauzer tomonidan saqlanishini yodda tuting.

O‘zgarishlarni nashr etishdan oldin litsenziyani tekshiring

Repository CC BY-NC-SA 4.0 litsenziyasi ostida tarqatiladi; bu litsenziya ko‘rsatish va ayni litsenziyani saqlash sharti bilan notijorat ulashish va moslashtirishga ruxsat beradi. three.js va ayrim qisqa funksiyalar alohida shartlardan foydalanadi. O‘zgartirilgan yig‘ilmani qayta tarqatishdan oldin LICENSE va THIRD-PARTY-NOTICES.txt fayllarini o‘qing, ayniqsa README qo‘shimcha shaderlar va yordamchi funksiyalar manbalarini hujjatlashtirgani sababli.

Xulosa

Portals uzluksiz brauzer sayohatini yaratish uchun protseduraviy three.js sahnalari, sintez qilingan audio, moslashuvchan grafika, fon rejimida dunyo generatsiyasi va ikki dunyoli renderlashni birlashtiradi. Manbani darhol npm start orqali o‘rganishingiz, to‘liq joylashtiriladigan saytni npm run build yordamida yaratishingiz va arxitekturani o‘rganish yoki kengaytirishda loyiha tuzilmasi hamda mavjud dunyo modullaridan qo‘llanma sifatida foydalanishingiz mumkin.