شغّل وبنِ واستكشف Portals: 471 عالم ثلاثي الأبعاد مُولَّد

شنو هوما Portals؟

Portals هي رحلة جوّية فالمتصفح بلا تحكّم مباشر، كتدوز عبر 471 عالم ثلاثي الأبعاد مولّد. الكاميرا كتتبع مسار محدد مسبقاً، كتوصل لبوابة وكتدوز مباشرة للعالم اللي خدام من بعدها بلا قطع ولا تلاشي. ما كتسوقش الرحلة، ولكن تقدر تتحكم فالسرعة ديالها، طريقة العرض، الصوت، الرسومات، واختيار العالم.

المشروع مبني بـ JavaScript و three.js. كل عالم كيولّد الهندسة ديالو والخامات ديالو فالمتصفح، والصوت ديالو كيتصاوب أثناء التشغيل. العوالم ما كتحمّلش نماذج ثلاثية الأبعاد، ولا صور الخامات، ولا ملفات صوتية من الخارج. المشروع حتى هو موقع ثابت: ما كيحتاج لا حساب، لا خادم تطبيقات، لا خدمة تتبّع.

المستودع كيمثل الإصدار s8f بتاريخ 9 نونبر 2026. هاد الإصدار فيه تقريباً 1.4 مليون سطر ديال JavaScript و471 عالم.

المميزات الرئيسية

• 471 عالم مولّد: المجموعة كتضم البراري، المدن، المحيطات، الفضاءات الداخلية، السماوات، أجواء غريبة، مشاهد من عصور ما قبل التاريخ، أماكن مستوحاة من الفن، عوالم أدبية، إلهامات من الأفلام والتلفزة، عجائب قديمة، ونكت داخلية على الذكاء الاصطناعي.
• بوابات سلسة: العالم الحالي والعالم اللي ورا البوابة كيشغلو بجوج فآن واحد، وهاد الشي كيخلي الكاميرا تدوز بلا شاشة انتقال.
• أصول إجرائية: الهندسة والخامات والصوت كيتنتجو فالمتصفح بلا ما يتحمّلو كأصول عادية ديال العوالم.
• رحلة أوتوماتيكية: كل عالم كيوفر مسار الكاميرا والمدة ديال الرحلة. أغلب الرحلات كتدوم تقريباً بين 40 و50 ثانية.
• رسومات متكيفة: الوضع التلقائي كيقدّر مستوى الجودة انطلاقاً من بطاقة الرسومات وكيعدّل دقة الرسم باش يحافظ على حركة سلسة.
• تفضيلات محلية: العوالم اللي تشافت، والمفضلات، والإعدادات كيبقاو مخزنين فالمتصفح.
• المعرض والرحلات: المعرض كيعرض جميع العوالم، بينما 20 رحلة منتقاة كتشغّل عوالم محددة بترتيب ثابت.
• نشر ثابت: نسخة الإنتاج كتنشئ ملفات عادية فـ dist يمكن استضافتها عند مضيف ويب ثابت.

المتطلبات الأساسية

خاصك Node.js 18 أو أحدث وGit. المعاينة المباشرة للمصدر ما كتحتاجش تثبيت ولا خطوة بناء. بطاقة رسومات مخصصة أفضل، ولكن المشروع يقدر يخدم بجودة منخفضة فالهواتف والحواسيب المحمولة القديمة.

تأكد من إصدار Node.js ديالك:

node --version

إلا كانت النتيجة أقدم من الإصدار 18، حدّث Node.js قبل ما تكمل.

شغّل Portals مباشرة من المصدر

1. نسخ المستودع

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

2. شغّل خادم المصدر المحلي

npm start

حلّ http://localhost:8000 فالمتصفح. هاد الشي كيقدّم شجرة المصدر كيف ما هي، بلا ما تحتاج تثبيت الحزم ولا التجميع من قبل.

المعاينة ديال المصدر عندها جوج محدوديات متوقعة. المعرض ما كيقدرش يتعرّف على العوالم المضافة حديثاً ولا يبيّن صفحة الأوصاف المولّدة. فأول زيارة، وحدة تحكم المتصفح حتى هي كتعطي رسالة على ملف atlas.json مفقود، حيث هاد الملف كيتنتج غير أثناء عملية البناء.

إنشاء ومعاينة نسخة الإنتاج

ثبّت تبعيات البناء، وولّد حزمة النشر، وشغّل خادم المعاينة ديالها:

npm install
npm run build
npm run preview

الموقع الثابت المولّد كيتكتب فـ dist. حلّ http://localhost:8001 باش تفحصو.

البناء كيصغّر سكريبتات المشروع باستعمال esbuild وكيُنشئ موارد خاصة بالنشر، منها:

• صفحة صغيرة لمعاينة المشاركة لكل عالم ورحلة.
• صفحة عادية كتسرد كل عالم والوصف ديالو.
• بيانات المعرض اللي كتسجّل شنو هما العوالم الجديدة.
• ملف إعدادات الاستضافة.

إعادة إنتاج الإصدار s8f

البناء كيقبل وسم إصدار. وحسب توثيق المستودع، الأمر التالي أعاد إنتاج ملف إصدار s8f المباشر ملفاً بملف وبايتاً ببايت بتاريخ 9 نونبر 2026:

npm run build -- --stamp s8f

استعمل البناء العادي أثناء التطوير. استعمل الوسم ملي تحتاج بالضبط لبيانات الإصدار أو بغيتي تعاود إنتاج الإصدار الموثق.

التحكم والاستعمال الأساسي

Portals كتبدا الطيران أوتوماتيكياً. الصوت كيكون مطفّي فالبداية، لذلك ضغط على S إلا بغيتي تسمع الموسيقى التصويرية المولّدة. أزرار لوحة المفاتيح هي:

• المسافة: وقف الرحلة مؤقتاً أو عاود شغّلها.
• السهم لليمين: سرّع الاتجاه نحو البوابة الجاية.
• S: شعل الصوت أو طفيه.
• G: فعّل الوضع الهادئ باش تكون الكاميرا أكثر استقراراً والأفق مستوياً.
• H: حفظ العالم الحالي فالمفضلات.
• P: حفظ صورة.
• I: فتح واجهة المعرض والرحلات والبحث.
• O: فتح خيارات الرسومات، الكاميرا، الأسلوب الفني، الرحلة، المرافق، ووقت النهار.
• F: الدخول لوضع ملء الشاشة أو الخروج منو.

إلى حرّكتي الماوس، كيبان شريط ديال التحكّم لتحت فالشاشة. فيه أزرار كيقابلو تحكّمات الكلافيي، وزايد عليهم سلايدر ديال السرعة وسلايدر ديال العادي حتى الغريب. فالنوافذ الضيقة، كيتنقلو السلايدرات لواجهة الخيارات.

استكشاف أول مفيد

1. شغّل المعاينة ديال المصدر ولا ديال الإنتاج.
2. ضغط على S باش تفعّل الصوت.
3. خلّي عالم كامل يدوز باش تلاحظ عبور عادي من البوابة.
4. ضغط على G إلا كانت حركة الكاميرا كتقلقك.
5. حلّ المعرض بـ I وقلّب ولا تصفّح المجموعة كاملة.
6. عدّل العادي حتى الغريب باش تأثّر على شحال من مرة كيتختارو العوالم غير المعتادة.
7. ضغط على H ملي تلقى عالم بغيتي تحتافظ بيه فالمفضلة.

كيفاش خدامين البوابات السلسة

من بعد حوالي ثانية من العبور، المحرّك كيختار العالم الجاي. كيبني داك العالم شوية بشوية، فبضعة ميليثوانيات بين الإطارات المرسومة، ومن بعد كيسخّن الشيدرات والتكستورات ديالو وهو باقي مخبّي على الأنظار.

الوجهة ماشي غير معاينة ثابتة. كاميرا ثانية كترسم العالم الجاي وهو خدام داخل فتحة البوابة فكل إطار. قبل ما توصل الكاميرا للبوابة بشوية، المحرّك كيرقّي الوجهة باش تولّي هي العالم الحالي وكيكمّل الطيران. إلا ما سالاش التحضير، الرحلة الحالية كتهدأ وكتستنى قدّام البوابة.

كيفاش كيتختارو العوالم

أداة الاختيار كتعطي الأولوية للعوالم اللي ما شافهاش الزائر. فالدزينة الأولى ديال العوالم فكل زيارة، كتميل تختار العوالم اللي قيّموها عوامل التحكيم ديال المشروع بأعلى النقط. كل عالم عندو مستوى جودة من 1 حتى 5، وهاد المستويات كيساعدو يحددو شنو من تجارب غادي يبان بكري.

أداة الاختيار كتقلب حتى هي على التباين. غالباً كتختار وجهة مختلفة على المكان الحالي فالنوع، ولا فالسطوع، ولا فالحرارة. إعداد العادي حتى الغريب كيتحكّم فعدد المرات اللي كيبانو فيها العناصر الأكثر غرابة.

فهم تنظيم المشروع

أهم الملفات والمجلدات هما:

• index.html: صفحة التطبيق.
• src/main.js: تحكّمات الكلافيي، الخيارات، وشريط التحكّم اللي لتحت.
• src/core: أنظمة الطيران، البوابات، اختيار العوالم، الصوت، وجودة الرسومات.
• src/kit: مكوّنات مشتركة لبناء العوالم، بحال السماوات، الما، التضاريس، النباتات، الحيوانات، البنايات، والديكورات الداخلية.
• src/worlds: مودول لكل عالم، سجلّ العوالم، والقاعة الافتتاحية.
• src/parts: القطع الرئيسية المستعملة فالعوالم الفردية.
• src/extras.js: لوائح ديال الألعاب، الرفاق، والأنماط الفنية.
• src/rides، وsrc/companions، وsrc/styles: تطبيقات ديال هاد الإضافات.
• src/ui: كود المعرض والمشاركة، وزايد ui.css، وهو ملف الأنماط الوحيد فالموقع.
• vendor/three: مكتبة three.js المضمّنة.
• thumbs: صور مصغّرة ديال المعرض.
• design: نصوص العوالم وجداول الإصدار والوصول اللي كيقراها البناء.
• tools: سكريبت البناء والسيرفر المحلي.

كيفاش منظم مودول ديال العالم

العالم هو ملف داخل src/worlds. التصدير الافتراضي ديالو هو كائن فيه دالة build. خاص العالم حتى هو يتسجّل فـ src/worlds/index.js مع العنوان، والنوع، والوصف المختصر ديالو، حيث أداة الاختيار والمعرض بجوج كيقراو داك السجل.

دالة build كترجع ثلاثة عناصر أساسية:

• مشهد ديال three.js.
• مسار ديال الكاميرا.
• مدة الطيران.

معظم العوالم كتحط القطعة الرئيسية ديالها فملف منفصل داخل src/parts. المرافق المشتركة فـ src/kit كتوفر مكوّنات قابلة لإعادة الاستعمال، بلا ما يضطر كل عالم يطبّق المناظر المشتركة بوحدو.

طريقة آمنة لدراسة العوالم ولا توسيعها

1. اختار عالم موجود داخل src/worlds كيشبه لنوع البيئة اللي بغيتي تفهمها.
2. تبع الاستيرادات ديالو حتى لـ src/parts وsrc/kit باش تشوف كيفاش كيتجمع المشهد ديالو.
3. عاين التصدير الافتراضي ديالو ودالة build باش تتعلّم الشكل الحقيقي ديال الكائنات فالمستودع والاتفاقيات ديال مسارات الكاميرا.
4. راجع التسجيل المقابل فـ src/worlds/index.js باش تتأكد من بيانات العنوان، والنوع، والوصف المختصر المطلوبة.
5. شغّل npm start باش تجرّب المصدر بسرعة.
6. دير بناء ديال الإنتاج باش تتأكد من موارد المعرض والمشاركة اللي كتتولّد.

هاد المستودع كبير بشكل غير معتاد، وهادشي علاش تكييف عالم قريب وآمن أكثر من محاولة استنتاج واجهات برمجية ما موثّقاش ولا بناء مودول من الصفر.

سلوك الصوت والرسومات

توليد الصوت

كل عالم كيتوصل بكورد بطيء وبشحال من جرس. ومعظم العوالم كيستعملو حتى خلفية هادئة، بحال الريح، ولا الما، ولا صوت الغرفة، ولا همهمة ثابتة ديال الفضاء. يقدر العالم يزيد حتى لثلاث طبقات مختارة من بين تسعتاش تأثير متاح، ومن بينها الشتا، وأمواج البحر، والطيور، وأجراس بعيدة. محرّك الصوت ديال المتصفح كينتج هاد الأصوات بلا ما يحمّل ملفات صوتية.

جودة الرسومات التلقائية

ملي كتكون الرسومات مضبوطة على Auto، Portals كيقدّر مستوى الجودة المناسب انطلاقاً من بطاقة الرسومات. ومن بعد كيرفع ولا كيهبّط دقة الرسم باش يعاون يحافظ على طيران سلس. فحاسوب محمول قديم ولا فالتلفون، خلّي Auto مفعّل قبل ما تجرّب إعدادات كتطلب موارد أكثر.

نصائح متقدمة

استعمل الوضع اللطيف لسهولة الولوج

ضغط على G باش تحافظ على كاميرا أكثر استقرار وعلى أفق مستوي. هادي هي أول إعداد خاصك تجرّبو إلا كان الطيران العادي كيسبّب ليك الانزعاج.

جرّب النسخة الأصلية ونسخة البناء بجوج

استعمل السيرفر ديال المصدر باش تسرّع التجارب، ولكن ديما تفقد نسخة dist قبل النشر. بعض معطيات المعرض، وصفحات الوصف، ومعاينات المشاركة، وإعدادات الاستضافة كيبانو غير من بعد البناء.

اختبر جاهزية البوابة، ماشي غير مظهر المشهد

خاص العالم يكون واجد قبل العبور. ملي كتبدّل كود العالم، راقب الاقتراب من البوابة ديالو وكذلك المشهد اللي فالوجهة. التوليد الثقيل أو تحضير الـ shader يقدرو يبطّؤو الطيران وهو كيتسنى.

استعمل الرحلات للتسلسلات القابلة للتكرار

Portals فيها 20 رحلة كتشغّل العوالم بترتيب ثابت. من بينها قطرة ماء وحدة، اللي كتمشي من حجرة البَرَد حتى لقاع البحر، والتراجع بالزوم، اللي كتبدا من داخل خلية حية. التسلسلات الثابتة مفيدة ملي كتبغي تجربة موجهة أكثر من اللي كيوفرها الاختيار العادي.

احترم حدود التخزين والخصوصية

التطبيق ما عندوش backend وما كيرسل حتى بيانات ديال الحساب، أو التتبع، أو المفضلات، أو الإعدادات للسيرفر. ملي كتدير تصحيح لمشكل فالمفضلات أو فالعوالم اللي تشافت، تذكّر بلي هاد القيم كيتخزنو فالمتصفح.

راجع التراخيص قبل نشر التغييرات

المستودع موزّع بموجب CC BY-NC-SA 4.0، وكيتيح المشاركة والتعديل لأغراض غير تجارية مع ذكر المصدر واستعمال نفس الترخيص. three.js وبعض الدوال القصيرة عندها شروط منفصلة. قرا LICENSE وTHIRD-PARTY-NOTICES.txt قبل ما تعاود توزّع نسخة معدّلة، خصوصاً حيث إن README كيوثّق مصادر إضافية ديال الـ shader ودوال الأدوات.

الخلاصة

Portals كيجمع بين مشاهد three.js مولّدة بطريقة إجرائية، وصوت مركّب، ورسوميات متكيفة، وتوليد عوالم فالخلفية، ورسم جوج عوالم فآن واحد باش يخلق رحلة متواصلة فالمتصفح. تقدر تستكشف المصدر مباشرة باستعمال npm start، وتولّد الموقع الكامل الجاهز للنشر باستعمال npm run build، وتستعمل بنية المشروع ووحدات العوالم الموجودة كأدلة ملي كتدرس المعمارية ديالو أو كتوسّعها.