الصفحة الرئيسية>المتعلقة بالبرمجة>شفرة المصدر الأخرى
تنزيل

Codewords: لعبة لوحية متعددة اللاعبين في الوقت الفعلي على الويب.

أنا معجب كبير بألعاب الطاولة وجامع الألعاب. أنا أيضًا مصمم UX ومصمم ألعاب. لقد كنت أفكر منذ فترة أنه يمكنني مزج هذه الأشياء لإنشاء ألعاب لوحية رقمية.

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

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

لذلك اعتقدت أن ألعاب الطاولة الرقمية هذه يمكن أن تكون بديلاً ممتعًا للعبة لم يتمكن أحد من شرائها بعد، أو كلعبة يمكنك لعبها في أي مكان متصل بالإنترنت.

إنشاء اللودوراتوري

شغف آخر لدي هو البرمجة. منذ أن كنت صغيرًا جدًا، كنت أعبث مع BASIC، والآن كمصمم أحاول دائمًا فهم المزيد حول البرمجة للويب.

خلال الأشهر الماضية كنت أدرس بعض أطر عمل جافا سكريبت - مثل Vue وReact - وقررت أنه يمكنني محاولة جعل هذه الألعاب تنبض بالحياة.

ولهذا السبب، سأبدأ سلسلة من الألعاب تحت العلامة التجارية "Ludoratory": ستكون تجارب في تطوير الويب وتصميم الألعاب. من المفترض أن تكون كل لعبة مجانية للعب، بدون إعلانات أو تتبع، وبرمز مفتوح المصدر. آمل أن أتمكن من التعلم معهم أثناء تقديم شيء ممتع للآخرين.

كلمات مشفرة

"الأسماء الرمزية"، بقلم فلادا شفاتيل، كان هدفي الأول في كتابي Ludoratory.

إذا لم تلعبها بعد، أنصحك بمحاولة الحصول على نسخة في أقرب وقت ممكن، لأنها لعبة مذهلة.

فكرتي حولها، Codewords، هي نسخة متعددة اللاعبين في الوقت الفعلي من تلك اللعبة اللوحية، حيث تحتوي الشاشة الكبيرة على كل الكلمات، ويتم استخدام الهواتف المحمولة كخريطة لـ Codemaster. هناك بعض التغييرات البسيطة عن اللعبة الأصلية (لقد قمت ببناء اللعبة باستخدام القواعد المنزلية التي نلعبها)، لذلك كتبت مقالة قصيرة تشرح القواعد هنا.

الاعتمادات

لقد قمت بتصميم اللعبة وترميزها باستخدام بعض المساعدة من الأطر والمكتبات والموارد:

  • Vue.js للواجهة الأمامية، باستخدام Vue-CLI، مع دعم PWA.
  • Firebase لإدارة التحديثات في الوقت الحقيقي.
  • Vue QRCode، بواسطة xkeshi، لإنشاء QRCodes لكل لعبة جديدة.
  • Vue Translate، بواسطة javisperez، للسماح بلعب اللعبة باللغتين الإنجليزية أو البرتغالية.
  • صورة ظل غامضة لوجه ذكر، بواسطة مالك إرنست، لصورة الخلفية.
  • تأثير CSS Glitch، بواسطة Mary Lou على Codrops، أيضًا لصورة الخلفية.

الترجمة إلى الفرنسية مقدمة من إيف بيليتييه

إعداد المشروع 

 npm install

يجمع ويعيد التحميل السريع للتطوير 

 npm run serve

يجمع ويصغر للإنتاج 

 npm run build

الوبر وإصلاح الملفات 

 npm run lint

هذا كل شيء!

يمكنك لعب اللعبة الآن على https://codewords.ludoratory.com. كما قلت، الكود موجود على جيثب. أنا متحمس لسماع أي انتقادات وشكوك وتعليقات واقتراحات قد تكون لديكم حول اللعبة أو الكود الخاص بي أو مشروع Ludoratory.

شكرا لكم، وآمل أن تستمتعوا باللعبة.

يوسع
معلومات إضافية
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة الكل