الصفحة الرئيسية » تصميم المواقع » HTML5 Website Showcase 48 Demos Flash-Killing Demos

    HTML5 Website Showcase 48 Demos Flash-Killing Demos

    لذلك سمعت أن كل الشائعات حول HTML5 ستتولى برنامج Adobe Flash. بينما يجادل معظم مجتمع الويب بأنه ممكن أم لا ، يجب أن تتجول في ما يجعل HTML5 قويًا للغاية حتى أن شركة أبل العملاقة تريد استخدامه لاستبدال Flash.

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

    ملاحظة: نظرًا لأن HTML5 غير مدعوم تمامًا من قبل مستعرض ويب معين مثل Internet Explorer ، فمن المستحسن بشدة استخدام مستعرض Firefox لعرض جميع عروض HTML5 أدناه.

    حيوية

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

    Audioburst الرسوم المتحركة

    رسم متحرك مريح ورائع تم إنشاؤه باستخدام علامة HTML5 الخاصة بالقماش والصوت.

    بركة الكرة

    يعرض هذا العرض التوضيحي في حدث Google I / O الأخير ، إلى أي مدى يمكن أن يكون HTML5 ديناميكيًا.

    Blob Sallad

    مخلوق نتج عنه HTML5 يرضيك.

    Bomomo

    مع Bomomo ، يمكنك مراقبة حركة ذرية مختلفة محاكاة باستخدام HTML5.

    متصفح الكرة

    الحصول على دهشتها مع هذه الكرة HTML5 "عبر متصفح".

    فقاعات

    استمتع بإنشاء فقاعات عائمة لا نهاية لها بألوان مختلفة.

    قماش الرسوم المتحركة الرسوم المتحركة

    رسم HTML5 بسيط ومضحك يساعدك على فهم ما يمكن أن يفعله عنصر قماش HTML5.

    Coolclock

    ساعة تناظرية لطيفة وقابلة للتخصيص تم بناؤها بواسطة HTML5 و JavaScript.

    فليكر PS3 عرض الشرائح

    عرض صور Flickr الخاصة بك باستخدام عرض شرائح نمط PS3 في متصفح الويب.

    بولارويد التفاعلية

    عرض تفاعلي يعمل بشكل مشابه تمامًا للواجهة متعددة اللمس.

    الألعاب النارية شبيبة

    استمتع بلحظة الألعاب النارية من خلال الجاذبية والسرعة اللذين تفضلهما ، بدعم من HTML5 و Javascript.

    المشكال

    مشاعر HTML5 جميلة ومستقبلية.

    جزيئات سائلة

    الرسوم المتحركة الحساسة للجسيمات التي تتفاعل بناءً على حركة الماوس.

    Mesmerizer

    عرض HTML5 حساس ومميز آخر يوضح كيفية تفاعل العناصر القريبة مع حركة الماوس.

    سديم الغيمة

    تضيع مع هذه السديم عجيب HTML5.

    إختلاف المنظر

    عرض جميع الأشكال 2D في منظور متوازي.

    الجسيمات الرسوم المتحركة

    الرسوم المتحركة الجسيمات HTML5 الأنيقة التي يمكن أن تشكل في رسالتك المفضلة.

    انتشار

    تضيع مع هذه الرسوم المتحركة انتشار لا نهاية لها.

    سترفيلد

    الرسوم المتحركة starfield HTML5 رائعة للغاية من شأنها أن تغير الاتجاه والسرعة على أساس حركة الماوس.

    تدمير الفيديو

    بنقرة واحدة لازدهار تشغيل الفيديو.

    الموجي

    لاحظ كيف تتحرك موجة قماش HTML5 من خلال تغيير السعة ، الطول الموجي ، العرض ، إلخ.

    تأثير 3D

    أعجب من الرسوم المتحركة قماش؟ هذا هو عنصر قماش HTML5 أكثر يمكن القيام به ، ويسمى تأثير 3D. يمكن للمطور الاعتماد على عنصر قماش ، DOM و JavaScript لإنشاء تأثير ثلاثي الأبعاد ، والذي يمكن تطويره لاحقًا إلى رسوم متحركة أو لعبة ثلاثية الأبعاد.

    Canvas3D وفليكر

    استمتع بتجربة ثلاثية الأبعاد جديدة باستخدام صور Flickr.

    محاكاة القماش

    واقعية ، محاكاة القماش القائم على HTML5.

    تتطور الوحش

    راقب وحشًا يتطور إلى مخلوق معقد ، أحد منشئه هو HTML5.

    جوجل Giftbox

    يتم تقديم محرك البحث العملاق جوجل في عرض 3D ، للعب.

    شبيبة اللمس

    عرض ثلاثي الأبعاد عالي الجودة وواقعي.

    عرض بيانات

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

    Gnuplot

    Gnuplot ، تطبيق للتخطيط للبيانات في إصدار HTML5.

    RGraph

    يوفر RGraph مجموعة واسعة من عرض البيانات مثل شريط الرسم البياني ، شريط التقدم ومخطط الرادار التقليدي.

    تطبيق الويب

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

    CanvasPaint

    شاهد شقيق Microsoft Paint يأتي إلى متصفح الويب الخاص بك ، والده هو HTML5.

    CanvasMol

    تطبيق علمي تم تصميمه لمساعدتك على فهم بنية بعض عناصر الأرض.

    منشئ الكرتون

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

    اسحب أي شيء هنا

    اسحب أي شيء يمكنك سحبه في العرض التوضيحي لإظهار التفاصيل.

    رسم غارتيتش

    تطبيق HTML5 أصلي يسمح لك بعمل بعض الرسومات الأساسية التي يمكن حفظها في تنسيق صورة مختلفة مثل jpeg أو png.

    PhysicSketch

    ارسم ما تريد وشاهد كيف تتفاعل مع الجاذبية المحاكاة.

    دفتر الرسم

    تطبيق رسم HTML5 قوي يمكّنك من رسم صورتك وتعديلها بالطريقة الدقيقة.

    حديث قصير

    تطبيق ويب يؤكد الموقع الجغرافي للرسالة ذات الصلة بالطقس التي تم الحصول عليها من Twitter ، وبالتالي تكوينها في خريطة "الطقس الاجتماعي" القائمة على قماش ، تافهة للغاية (كما ذكر المؤلف) ولكن مثيرة للاهتمام.

    لعبه

    3Bored

    لن تشعر بالملل أبدًا إذا كان بإمكانك الاستمرار في التهرب من مئات رصاصات HTML5 في الثانية التالية.

    انطلق

    ارتد الكرة لكسر جميع الطوب.

    Canvascape

    ليست لعبة جيدة ، ولكنها توضح كيف يمكن استخدام HTML5 لتطوير لعبة متصفح First Person Shooting.

    إمسكها

    كم عدد الكرات التي يمكنك تفاديها للحصول على مربع HTML5 الخاص بك?

    تفاعل تسلسلي

    سلسلة الانفجار لتحقيق الهدف ، لا تدمن.

    Cubeout

    لعب Tetris في عرض ثلاثي الأبعاد من أعلى لأسفل.

    etchaPhysics

    ارسم عنصرًا لتحريك الكرة إلى النجم ، ولا تنس الجاذبية.

    أحجية جقسو

    انقر وتدوير وإسقاط قطع اللغز لحل هذا اللغز القائم على HTML5.

    لغز الشريحة

    انزلق إلى النصر ، وهي لعبة HTML5 أخرى مصممة للضغط على عصير عقلك.

    نفس اللعبة

    أزل مجموعة معينة للحصول على مجموعة أخرى مقترنة بنفس اللون وستحصل في النهاية على نصر.

    تتريس

    واحدة من أكثر الألعاب الكلاسيكية التي عادت إلى الحياة من خلال HTML5.

    نتوء مستدير

    لعبة Tetris أخرى في إصدار شبه زائف.

    استنتاج

    ما هو الحد من HTML5؟ في هذه المرحلة ، لا يمكننا اتخاذ قرار ، لكن مع الفيديو المثير للإعجاب أدناه يمكننا معرفة إلى أي مدى تم دفع HTML5:

    نعم ، إنه Quake II في متصفح الويب ، لذلك أصبح من الواضح الآن أنه مع HTML5 ، سيتم إنشاء المزيد من تطبيقات الويب الرائدة لخدمة مليارات مستخدمي الإنترنت. إنه سريع ، إنه يتطور ، وهو يغير الشبكة العالمية. والسؤال هو ، كيف يمكنك استخدام HTML5 لتغيير اللعبة?

    نحن نحب أن نسمع فكرتك!