initial commit

1 files changed, 25 insertions, 0 deletions

diff --git a/files/zh-tw/games/tutorials/index.html b/files/zh-tw/games/tutorials/index.html
new file mode 100644
index 0000000000..d0ce8dfdf2
--- /dev/null
+++ b/files/zh-tw/games/tutorials/index.html
@@ -0,0 +1,25 @@
+---
+title: Workflows for different game types
+slug: Games/Tutorials
+tags:
+  - Canvas
+  - Games
+  - JavaScript
+  - NeedsTranslation
+  - TopicStub
+  - Web
+  - Workflows
+translation_of: Games/Tutorials
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<p>This page contains articles that highlight different workflows for effectively creating different types of web games, whether you want to create a 2D or 3D game from scratch, or port a C++ or Flash game over to open web technologies.</p>
+
+<dl>
+ <dt><a href="/en-US/docs/Games/Workflows/2D_Breakout_game_pure_JavaScript">2D breakout game using pure JavaScript</a></dt>
+ <dd>In this step-by-step tutorial you'll implement a simple breakout clone using pure JavaScript. Along the way you will learn the basics of using the {{htmlelement("canvas")}} element to implement fundamental game mechanics like rendering and moving images, collision detection, control machanisms, and winning and losing states.</dd>
+ <dt><a href="/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">2D breakout game using Phaser</a></dt>
+ <dd>In this step-by-step tutorial you'll implement the same breakout clone as the previous tutorial series, except that this time you'll do it using the<a class="external external-icon" href="http://phaser.io/">Phaser</a> HTML5 game framework. This idea here is to teach some of the fundamentals (and advantages) of working with frameworks, along with fundamental game mechanics.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">2D maze game with device orientation</a></dt>
+ <dd>This tutorial shows how to create a 2D maze game using HTML5, incorporating fundamentals such as collision detection and sprite placement on a {{htmlelement("canvas")}}. This is a mobile game that uses the <a href="/en-US/Apps/Build/gather_and_modify_data/responding_to_device_orientation_changes">Device Orientation</a> and <a href="/en-US/docs/Web/Guide/API/Vibration">Vibration</a><strong> APIs</strong> to enhance the gameplay and is built using the <a href="http://phaser.io/">Phaser</a> framework.</dd>
+</dl>