ตัวอย่างเกมจาวาสคริปต์ที่ดี / HTML5 [ปิด]

ตอนนี้ Flash ส่วนใหญ่ถูกแทนที่ด้วยองค์ประกอบ HTML5 (วิดีโอ, เสียง, แคนวาส, ฯลฯ ) มีตัวอย่างที่ดีของเกมบนเว็บที่สร้างขึ้นบนมาตรฐานแบบเปิดที่สมบูรณ์ (หมายถึง Javascript, HTML และ CSS) ฉันเห็นตัวอย่างมากมายของการใช้งาน HTML5 อย่างแท้จริงของสิ่งที่ครั้งหนึ่งเคยมีเฉพาะใน Flash (เช่นที่นี่: http://www.html5rocks.com/ ) แต่ไม่ใช่เกมจำนวนมากโดเมนที่ดูเหมือนจะยังคงครอบครองโดย Flash ฉันอยากรู้ว่าอะไรเป็นไปได้และข้อ จำกัด คืออะไร

มีการขัดต่อ HTML5 เป็นจำนวนมาก แต่การที่จะบอกว่า Flash นั้นถูกแทนที่โดยส่วนใหญ่แล้วจะเป็นการกล่าวเกินจริง ในขณะที่แท็กวิดีโอและเสียงอาจได้รับแรงดึงการเล่นเกมจะเป็นหนึ่งในพื้นที่ที่ถือครองมาเป็นเวลานานไม่ใช่เพียงเพราะการใช้เครื่องมือและประสิทธิภาพที่ดีขึ้น แต่ยังมีโครงสร้างพื้นฐานทางธุรกิจที่สร้างขึ้นรอบ ๆ การกระจายไฟล์ Swf ปรับให้เข้ากับ HTML และ js เกม html5 ที่ฉันเห็นโดยใช้ Canvas นั้นคร่าวๆเมื่อแฟลชเป็น 7 ปีที่ผ่านมาและเมื่อถึงเวลาที่มีการเผยแพร่อย่างกว้างขวางว่าผ้าใบเป็นตัวเลือกที่ใช้งานได้แฟลชจะเปิดตัวแล้วเป็นแผนที่ 3 มิติและคุณสมบัติการเร่งความเร็วฮาร์ดแวร์

เพื่อเป็นการสำรวจว่าคุณสามารถใช้เบราว์เซอร์รุ่นใหม่ล่าสุดได้ไกลแค่ไหนฉันและเพื่อนร่วมงานบางคนได้คอมไพล์พอร์ต Java โอเพ่นซอร์สของ Quake II ไปยัง Safari / Chrome (ซึ่งควรทำงานกับ Firefox ในบางจุดเช่นกัน) แม้ว่ามันจะไม่ได้เริ่มแรกส่วนใหญ่ด้วยเหตุผลประสิทธิภาพ) โครงการอยู่ที่นี่: http://code.google.com/p/quake2-gwt-port/

มันยังต้องการการดูแลและให้อาหารเพื่อให้สามารถใช้งานได้ (เช่น WebGL ยังไม่ได้เปิดใช้งานโดยค่าเริ่มต้นในเบราว์เซอร์การจัดส่งใด ๆ ) แต่เราอัปโหลดวิดีโอที่นี่: http://www.youtube.com/watch?v = XhMN0wlITLk (ขออภัยมันมืดเหลือเกิน - ปัญหาแกมมายังคงอยู่) และคุณสามารถดู Google I / O ของเราได้ที่นี่: http://code.google.com/intl/fr-FR/events/io/2010/sessions/gwt -html5.html

ฉันไม่รู้ว่ามันจะนานแค่ไหนก่อนที่เราจะสามารถพึ่งพาคุณสมบัติของเบราว์เซอร์ใหม่เหล่านี้ได้จริง (WebGL, WebSocket, เสียง / วิดีโอ, ที่เก็บข้อมูลในตัวเครื่องและอื่น ๆ ) แต่ถ้ามันมารวมกัน ในความสามารถในการจัดส่งเกมโดยตรงบนเว็บ แต่ยังคงมีอุปสรรคมากมายที่เหลืออยู่ (เช่นอย่ากลั้นลมหายใจให้ Microsoft ใช้ WebGL ใน IE10)

Lord of Ultima ของ EA น่าจะเป็นเกมจาวาสคริปต์ / HTML ที่น่าประทับใจที่สุดที่ฉันเคยเห็น

หมายเหตุ: มันเป็นเกมที่ใช้กลยุทธ์และไม่ใช่ชื่อแอคชั่นดังนั้นในขณะที่มันมีแผนที่การเลื่อนที่ราบรื่นดีไม่มีอะไรเลยนอกจากการคลิกที่ปุ่มตราบใดที่การโต้ตอบโดยตรงเกิดขึ้น

"ฉันสงสัยว่าอะไรเป็นไปได้และข้อ จำกัด คืออะไร"

ข้อ จำกัด ขึ้นอยู่กับเบราว์เซอร์ หากคุณกำลังใช้บางสิ่งที่ร้อนแรงเหมือน Webkit nightlies ไม่มีสิ่งใดที่แฟลชสามารถทำได้ที่เบราว์เซอร์ไม่สามารถทำได้เช่น:

• กราฟิก 2 มิติ (ผ่านผ้าใบ) พร้อมการหมุนการปรับความทึบ ฯลฯ
• 3d (ผ่าน Canvas และ WebGL)
• เสียง (ผ่านแท็กเสียงแม้ว่าในปัจจุบันจะดูดแม้ในเบราว์เซอร์ที่รองรับ)
• HTTP (ผ่าน XMLHTTPRequest)
• Local Storage (ผ่าน localStorage API)
• Sockets (ผ่านเว็บ Sockets)
• SVG
• วิดีโอ (ผ่านแท็กวิดีโอ)

AFAIK นั้นเป็นไปได้ทั้งหมดใน Google Chrome เช่นกัน (และถ้าไม่ใช่ก็จะเป็นในไม่ช้า) เสียงเหมือนเป็นเกมที่สมบูรณ์แบบสำหรับฉัน :)

(ฉันรวมลิงก์ไปยังทุกสิ่งนี้ในร่างแรกของฉัน แต่ StackExchange จะไม่ให้ฉันโพสต์ไว้ตั้งแต่ฉันใหม่ขออภัย!)

ดูที่เว็บไซต์เหล่านี้:

• http://html5games.com/
• http://web.appstorm.net/roundups/browsers/10-html5-games-paving-the-way/

Guy jquery ui กำลังสร้างเอ็นจิ้นเกมชื่อ Aves โดยใช้ javascript / html วิดีโอนี้อธิบายถึงความท้าทายบางประการที่เขาพบระหว่างการพัฒนา เขาได้พูดคุยกันมากมายเกี่ยวกับการวาดภาพช้าและมันไม่ได้เร่งในเวลานี้

คุณสามารถค้นหาเกมทั้งหมดที่พัฒนาโดยใช้เอ็นจิน Effect Games ถึงแม้ว่าเครื่องยนต์จะดูมีทรายในไซต์ของเขาด้วยเครื่องมือและสินทรัพย์ที่มีอยู่ทั้งหมด

IMO ข้อ จำกัด ที่ยิ่งใหญ่ที่สุดของการพัฒนาเกม js / html คือเสียง แท็กทำงานอย่างมีประสิทธิภาพแตกต่างกันไปตามเหตุการณ์ใน Safari / firefox / chrome ทั้งหมดนี้ต้องเป็นเวอร์ชันล่าสุด ล่าสุดฉันตรวจสอบซาฟารีทำงานเฉพาะกับ MP3 และ firefox ใช้งานได้กับ OGG เท่านั้น แม้ว่ามันจะเป็นไปได้อย่างสมบูรณ์ที่จะเอาชนะมันได้ด้วยคอมโบของตรรกะเซิร์ฟเวอร์

ขณะนี้ฉันทำงานอดิเรกในการเขียนเกม Flash และไม่สามารถเห็นโดเมนนั้นถูกเอาชนะโดย HTML5 (js / css / html) จนกว่าพอร์ทัลจะเริ่มยอมรับพวกเขาหรือร้านค้าบนเว็บแอปออนไลน์

Contrasaurus

เกมนี้สร้างขึ้นด้วยความเจ็บปวดอย่างเลือดหยดน้ำตาและ HTML5 แกนเมทริกซ์เปลี่ยนห้องสมุดได้ปั่นออกมาเป็นMatrix.js นอกจากนี้หลายภาษาหลักส่วนขยายสไปรท์, เสียงและห้องสมุดผ้าใบที่มีวิธีการทำงานของพวกเขาเป็นแพลตฟอร์มเกม Pixie

ไม่มี Flash ผ้าใบ HTML5 และเสียงทั้งหมด ทำงานได้ดีที่สุดใน Chrome

คุณต้องไปที่ห้องสมุด CAAT จริงๆแล้วมันยอดเยี่ยมมาก! มันเป็น Scenegraph (เช่น thing.addchild / thing2.removechild) ห้องสมุดสำหรับผืนผ้าใบ

ตัวอย่างของเกมนี้มันทำให้ฉันผิดหวังพร้อมกับเกมที่มีอยู่ในหน้านั้น: http://labs.hyperandroid.com/animation

มากเสียจนฉันถ่ายโอนเกมของเราเองเพื่อใช้และใช้เวลาแค่คืนเดียวเท่านั้น

วางในการต่อสู้ก้อนหิมะหลายคน http://holiday2010.ogilvy.com

มากเสียจนฉันพยายามปรับปรุง lirary และเพิ่มเนื้อหาลงในนั้น: http://github.com/onedayitwillmake/CAAT-Hello

มีอยู่ใน github: http://github.com/onedayitwillmake/CAAT-Hello/tree/circlepack

แม้ว่าการควบคุมจะถูกทำให้เมา / ต้องการการทำงาน แต่ฉันรักอากิฮาบาระ - http://www.kesiev.com/akihabara/

Google Pacmanต้องเป็นเกม JS / HTML ที่น่าประทับใจอีกเกมหนึ่ง (ได้รับมันเป็นเกมเดียวที่ฉันเคยเห็น แต่มันก็ยังน่าประทับใจจริงๆ :)

ตำแหน่งของซอร์สโค้ด

มีแบบฝึกหัดที่ยอดเยี่ยมสำหรับห้องสมุด Akihabara ที่รวบรวมโดยDarius KazemiและDarren Torpeyที่: บทเรียนของ Akihabara

Biolab Disaster เป็น platformer sidecrolling ที่ดีมากแสดงสิ่งที่สามารถทำได้ด้วย html5 และ js http://playbiolab.com/

ฉันเพิ่งย้ายเกม Space Strategy ของฉันจาก Silverlight / C # ไปยัง HTML5 / Javascript / Canvas ล้วนๆ:

Astriarch - ผู้ปกครองแห่งดวงดาว

มันเป็นเกม 2D และมีกราฟิกที่ง่ายมากดังนั้นมันจึงเหมาะกับการใช้ผืนผ้าใบเพราะไม่มีภาพวาดมากมายเกิดขึ้น ที่ถูกกล่าวว่าฉันประทับใจกับสิ่งที่บางส่วนของเกมภาพเคลื่อนไหวมากขึ้นมีการทำออกมาด้วยเทคโนโลยีเดียวกัน เช่นเดียวกับนกโกรธที่ Chrome เว็บสโตร์: Angry Birdsคุณอาจต้องการดูเกมอื่น ๆ ใน Chrome เว็บสโตร์เพื่อดูตัวอย่างเพิ่มเติม

เหตุผลหนึ่งที่ฉันย้ายเกมของฉันคือฉันต้องการให้มันสามารถทำงานบนแท็บเล็ต / อุปกรณ์มือถือโดยไม่ต้องเขียนโค้ดใหม่ทั้งหมดใน Java หรือ Objective C. iOS และ Android ทั้งคู่มีการควบคุม 'WebView' เพื่อทำให้ง่ายขึ้น ฉันมีปัญหาในการแก้ไขเล็กน้อยที่ทำไปแล้ว (iOS ต้องการให้ทรัพย์สินทั้งหมดของคุณอยู่ในโฟลเดอร์เดียวเท่าที่ฉันเคยเห็น)

ความต้องการข้ามแพลตฟอร์มประเภทนี้เป็นเหตุผลที่ดีว่าทำไมบางคนย้ายออกจาก Flash และไปสู่ ​​HTML5 แต่ข้อเสียคือคุณต้องทดสอบกับเบราว์เซอร์และเวอร์ชัน N ที่แตกต่างกันและมีอาการปวดหัวทั้งหมดที่เกี่ยวข้องกับการพัฒนาเว็บทั่วไป ปัญหาเหล่านี้ได้รับการแก้ไขโดยห้องสมุดเช่น jQuery และห้องสมุด / แพลตฟอร์มเกม HTML5 อื่น ๆ ที่กล่าวถึงที่นี่ ( ImpactJSเป็นปัญหาที่ฉันเคยเห็น แต่ยังไม่ได้ลอง) นอกจากนี้ปัญหาเหล่านี้จะไม่เป็นปัญหามากเมื่อ FireFox 7 ไม่ทำงานและ IE 9+ จะแพร่หลายมากขึ้น

หากคุณมีความสนใจในปัญหาบางอย่างที่ฉันเผชิญกับการย้ายจาก Silverlight ไปยัง HTML5 Canvas คุณควรตรวจสอบการโพสต์บล็อกของฉันที่นี่: การย้ายแอป Silverlight ไปยัง javascript โดยใช้แท็ก Canvas HTML5

นี่คือ 3 เกมที่ยอดเยี่ยมโดยใช้ImpactJSเครื่องยนต์

Impact เป็นเครื่องมือประมวลผลเกม JavaScript ที่ให้คุณพัฒนาเกม HTML5 ที่น่าทึ่งสำหรับเดสก์ทอปและเบราว์เซอร์มือถือ

หากคุณไม่แน่ใจเกี่ยวกับสิ่งที่คุณสามารถทำได้กับ HTML5 ในปัจจุบันฉันจะบอกว่าสิ่งเหล่านี้เป็นตัวอย่างที่ดีที่สุด โปรดทราบว่าเนื่องจากเป็นหัวข้อที่น่าสนใจฟิลด์นี้จึงเปลี่ยนแปลงอย่างรวดเร็ว!

Z-Type

A Space Shoot'em'Up ที่คุณพิมพ์เพื่อยิง

ไบโอแลป

ต่อสู้ทางผ่าน Biolab ที่ติดเชื้อใน Jump'n'Run นี้ ใช้ปืนพลาสม่าของคุณเพื่อยิงทุกสิ่งที่เคลื่อนไหว! มี 3 ระดับให้สำรวจและต่อสู้กับศัตรู 6 แบบ

สิ่งมีชีวิตและปราสาท

เกมแอคชั่นไขปริศนาที่คุณช่วยให้นักล่าสมบัติหนุ่มขโมยสมบัติจำนวนมหาศาลจากปราสาทยุคกลาง

บังเอิญมีคำถามเกี่ยวกับ Slashdot วันนี้เกี่ยวกับการเล่นเกม html5 / javascript:

http://ask.slashdot.org/story/10/07/14/0632238/JavaScriptHTML-5-Gaming

มันกล่าวถึงโดยเฉพาะ Galactic Plunder นักกีฬาพื้นที่เลื่อนด้านข้าง:

http://dougx.net/plunder/plunder.html

http://www.javascriptgaming.com/

กรอบการพัฒนา HTML5 ที่น่าสนใจจริงๆที่ฉันเพิ่งเจอคือ Sencha เป็นหลักสำหรับอุปกรณ์พกพา / สัมผัส แต่จะไม่ใช้ระบบสัมผัสเป็นเวลาสองปีนับจากนี้ นี่คือตัวอย่างบางส่วนที่น่าสนใจรวมถึงการ์ดเกม:

http://www.sencha.com/products/touch/demos.php

นี่คือเกม HTML5 บางเกมในเกมเอฟเฟกต์ ... แม้จะมีโปรเจ็กต์ที่คุณสามารถเข้าร่วมได้ ฆ่าเวลาระหว่างการคอมไพล์ด้วย Crystal Galaxy Demo เป็นส่วนใหญ่

จากไซต์: "Cycleblob มีการใช้งานโดยใช้องค์ประกอบผ้าใบ Canvas และ HTML 5 และเขียนอย่างสมบูรณ์ใน JavaScript"

http://cycleblob.com/

ลองPrivate Joeสำหรับเกมยิงอาร์เคดย้อนยุค 2d เต็มรูปแบบ

หากคุณต้องการลองเกมที่ปรับให้เหมาะกับมือถือตรงไปที่marketJS