كيفية الجمع بين Java و Js والرسوم البيانية مع الفن أو قصة كيفية إنشاء مسرح تفاعلي

يتم تنظيم سلسلة كاملة من العروض المسرحية هذا العام في إستونيا ، متحدة في سلسلة "تاريخ القرن". خلال العام ، عرضت 22 مسرحًا من البلاد تاريخ الذكرى المئوية لإستونيا في عروضهم. خلال السحب ، حصل المسرح الروسي الإستوني على موضوع مستقبل إستونيا.


تحت القطع - حول كيفية الجمع بين التكنولوجيا والفن.

لكل منا فكرة عما قد يكون عليه المستقبل: ما نخاف منه ، وما نحلم به ، وما قد يكون عليه في الواقع. لكي لا نحصل على عرض يخبرنا فقط عما تفكر فيه دائرة ضيقة من المسرح حول المستقبل ، وجهنا هذا السؤال إلى أولئك الذين يجب أن يعيشوا في المستقبل - إلى الأطفال ، إلى شباب إستونيا الذين تتراوح أعمارهم بين 3 و 19 عامًا. كان هناك المئات من المجيبين ، ونحن ممتنون للغاية لهم.



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

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



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


يعرض أرتيوم جاريف (مدير المسرحية) الأفكار الأساسية حول التصميم

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



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

يتم تشغيل جميع المرافقة الموسيقية مباشرة بواسطة مشروع MODULSHTEIN .



لجعلها أكثر وضوحا قليلا ، دعونا نذهب إلى سياق المسرحية قليلا


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


المفارقة هي أن إيلينا سولومينا مقدمة في التلفزيون الوطني ومعروفة للعديد من المشاهدين.

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

بعد كل شيء ، يذهبون إلى الحزب.




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

وإذا كان الجواب نعم ، إذن ...

تنهار المدينة الفاضلة إلى ديستوبيا ويتم تشديد الحريات بعقد. يظهر حظر جديد ، والآن تدخل الكوماندوز في الحفلة وترتيب الناس. يُسمح ببعضها إلى اليمين ، في المستقبل ، ويتم تجريد البعض الآخر وإرساله إلى اليسار ، حيث يقرر مصيرهم بواسطة آلة التدمير. (بناءً على مقالات نيكولاي كاراييف وبوريس توخ)




ما الحل التقني المطلوب لنا؟


في الواقع ، كان ممثل EMA آخر (بعد Est Mom) ، الذكاء الاصطناعي ، الذي أصبح حقيقة في المستقبل. EMA يقود الجمهور على طول المؤامرة ، ويتجلى في خيارات مختلفة للمستقبل ، ويعلن أيضًا ويبدأ التصويت ، ويحسب ويعرض النتائج ، ويمضي على طول خطوط القصة. تسع القاعة 600 شخص. وكان يجب أن تتاح لكل مشاهد فرصة التصويت ، ويحسب النظام صوته بشكل صحيح.

عرضت خيارات تطوير الأرض الممكنة ونمذجتها على شكل رسم بياني شكل بنية معقدة ومتشعبة.

تميل اليوتوبيا إلى التدفق إلى الواقع المرير ، وبنوايا حسنة تم وضع الطريق إلى الجحيم. وترتبط المؤامرات منطق الدراما. بالنظر إلى عدد الخيارات المستقبلية التي اقترحها الأطفال ، ظهر عدد كبير من الفروع. من المهم تجنب التكرار - ما تم تشغيله لا يجب طرحه للتصويت مرة أخرى كخيار ممكن. على سبيل المثال ، إذا أكد المشاهدون ، بعد مشاهدة يوتوبيا لتكنولوجيا المعلومات ، اختيارهم لمستقبل كهذا ، فإننا نجد أنفسنا في الواقع المرير. إذا رفض المشاهدون الخيار المقترح ، فيجب عليهم مرة أخرى الاختيار بين الخيارات المقترحة - على سبيل المثال ، المستقبل الإيكولوجي والفضائي المستعمر. في كثير من الأحيان كانت هناك مواقف عندما قاتلت القاعة ، تم تقسيم الأصوات ما يقرب من 50 ٪ إلى 50 ٪ والفرق هو عدد قليل من الأصوات.


كل هذا التعقيد يتطلب بنية مناسبة ، وهي الكونت.



ما هي المتطلبات الوظيفية الأخرى الموجودة للحل التقني للأداء؟ نحن بحاجة إلى:

  • يُظهر نظام التصويت ، الذي يجمع الأصوات خلال فترة التصويت ، عملية التصويت ونتائجها.
  • الاختيار التلقائي للإجراءات - اعتمادًا على نتائج التصويت ، وفتح تصويت جديد أو الإعلان عن بداية القصة التالية ، وفقًا لمنطق الرسم البياني.
  • يجب أن يتواصل النظام مع الجمهور ، ويقدم خيارات ويعلن عن النتائج بلغة طبيعية.
  • يجب أن يدير النظام مساعد المدير ويعرض إحصاءات كاملة حول عملية التصويت.

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



مطلوب تطبيق ويب آخر لإدارة النظام ، وإطلاق ، وتفعيل الدول والقضايا التقنية الأخرى.

وأخيرًا ، الشيء الأكثر أهمية هو كيفية تفاعل EMA مع الجمهور.



وهنا من الضروري تقديم مفهوم "السوبر" ، الذي كان جديدًا بالنسبة لي. Super عبارة عن شاشة تعمل على خفض المشهد وإغلاقه.

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

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



لذلك ، لدينا رسم بياني معقد ونظام تصويت وثلاثة أنظمة FrontEnd التي يجب أن تتفاعل مع الجمهور والمدير (مساعد رائع للمخرج سفيتلانا شوشينا).

الحل


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

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

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



من ناحية الخادم ، كانت هناك بعض الشكوك - Python vs Java. كان الخيار لصالح جافا. الأسباب هي السرعة ، خطر أقل لكسر شيء ما بمتطلبات مفهومة وأيدي مباشرة ، وأخيرًا Spring Boot ، والتي تدعم Neo4j.



يتم تنفيذ جزء الخادم في Spring Boot. في الواقع ، يقوم الخادم بتجميع الأصوات ، والتبديل بالأمر من "السوبر" إلى الولايات التالية ، عندما ينتهي التصويت ، يتلقى الأوامر من المشرف ، ويعطي الإحصائيات وما إلى ذلك. بالإضافة إلى أنه يوفر كل الخيارات لـ FrontEnds ، ويسجل أيضًا المشاهدين.



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

يحتوي النظام على مركزي تحكم.

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

يتم تنفيذ Super على Vue. في البداية ، أردنا الاتصال بالصوت من واجهة برمجة تطبيقات Google Speech ، ولكن لم نتمكن من ضمان عدم حدوث أي تأخيرات عبر الشبكة. لذلك ، تم اختيار خيار آخر - سجلنا استجابة واجهة برمجة تطبيقات Google Speech على شكل قطع.

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

في البداية ، تمت كتابة عميل الجوال (صفحة الويب) بلغة Vue ، لكننا حصلنا على عدم توافق جزئي في بعض طُرز الهواتف. لقد جربنا أجهزة إرسال بابل ، ولكن بسبب كومة الإعدادات ، زاد حجم الصفحة ، وعلى الرغم من أن التصويت بدأ في العمل على بعض الهواتف ، إلا أنه كان ينكسر على البعض الآخر. ونتيجة لذلك ، تمت إعادة كتابة عميل الهاتف المحمول إلى Vanilla JS.

في الأساس ، تبين أن هذا نظام موزع.

كان الحجم النهائي للنظام (ملف الجرة) 146 ميغا بايت. قدمت لنا شركة Telia للاتصالات السلكية واللاسلكية خادمًا افتراضيًا بسعر رمزي قدره 1 يورو شهريًا ، وهي ممتنة للغاية لها.

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




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

وها هي قطعة تصويت أثناء العرض.


تلقى العرض عددًا كبيرًا من المراجعات الإيجابية في الصحافة.
https://rus.postimees.ee/6141942/budet-ne-budet-net-nichego-opasnee-budushchego
https://rus.postimees.ee/6147704/nashe-zavtra-v-zerkalah-utopii-i-antiutopii


في مهرجان الدراما في تارتو ، استمر التصفيق حوالي 5 دقائق.

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

مخرج ومصمّم مجموعة - Artyom Gareev
الملحن ، منتج المشروع - ألكسندر Zhedelev
البصرية - ألينا موفكو
مصممة أزياء - Rosita Raud
مصمم إضاءة - أنطون أندريوك
مصمم الرقصات - أولغا بريفيس
الكتاب المسرحيون: كارين لامسون ، ماري لي ليل ، إلينا شيشيرينا ولورا كالي
بالفيديو - نيكولاي الخزوف
برمجة وإنشاء تطبيق - ألكسندر تافجن ، آنا أجافونوفا
حل خلفي الجليد الفني - ألكسندر Sprohgis
الرسوم المتحركة - مارتن ياكوش
فرقة موسيقى - مودولشتين
مارتن التروف - الكلارينيت ، باس الكلارينيت
أليكسي سيمينخين - العمل مع العينات والتأثيرات
الكسندر Zhedelev - الغيتار ، المزج ، أبليتون
المعلم الصوتي - آنا ديدينا
مساعد المدير سفيتلانا شوشينا
ويشارك في الأداء ما يلي:
ناتاليا ديمشينكو ، ألكسندر زيلنكو ، دانييل زاندبرغ ، دميتري كورداس ، إيكاترينا كورداس ، ألكسندر كوتشميزوف ، فيكتور مارفين ، ناتاليا مورينا ، إلينا تاراسينكو ، إدوارد تي
سيرجي فورمانيوك وليونيد شيفتسوف وإلينا ياكوفليفا
استوديو المسرح الروسي: دينيس فولكوف ، بولينا غرينيفا ، نينا زاغفوزدكينا ، أناستازيا كوليدا ، ناتاشا كريستنسن ، أناستازيا ماسالوفا ، ساندرا مينوسيان ، صوفيا ميكاليفا ، كاثرين مياجي ، ميخائيل باششوك ، كاترين سيليوجينا ، كريستينا سوروكينا ، صوفيا ستريبيرج ، إيليا

Source: https://habr.com/ru/post/ar425537/


All Articles