思わず熱中してしまうゲーム風プログラミング学習サイトまとめ

UX MILK編集部

モノづくりのヒントになるような記事をお届けします。

近年ではプログラミングをゲーム風に楽しく学べるサービスが増えていますが、中には「ゲームっぽい」だけでフタを開けてみたらただのプログラミング講座だった…というものも多いです。

もちろん、コードを書く部分はただのプログラミング講座にはなってしまうのですが、いわゆるゲーミフィケーションとよばれる報酬制度や世界観の演出は大事です。

そこで今回はゲーム好きな筆者が試して、実際記事執筆を忘れて遊んでしまいそうになったサービスを厳選してご紹介します。

海外のものも多く、ローカライズされているものを極力選びましたが、されていないものも、頑張れば読める程度の英語のものに絞っています。

CODECOMBAT

スクリーンショット 2016-05-18 14.31.17

言語:Python、JavaScript、CoffeeScript、Lua

キャラを選んでダンジョンを進める、本格的なブラウザゲーム風の学習サービスです。キャラをコードで動かしてミッション達成を目指します。一応日本語化されてはいますが、クオリティは怪しいです。

VIM Adventures

スクリーンショット 2016-05-18 15.30.26

題材:vim

エンジニアに愛用される高機能エディタvimの操作を覚えるためのゲームです。黒い点滅が自分の操作するキャラクタなのですが、開始早々十字キーを押すと、「h」「j」「k」「l」を使って動かせと怒られる徹底っぷりです。独特なvimの操作を覚えるには最適です。

自キャラを実際のカーソルになぞらえているので、ワード単位でカーソルを動かしたり、文末のカーソルを縦移動した時の挙動などを駆使しないと進めない構造になっていて非常にユニークです。

Elevator Saga

スクリーンショット 2016-05-18 15.40.40

言語:JavaScript

エレベーターを制御して、制限時間内に規定の人数を希望のフロアに運び届けるというゲームです。一見地味なゲーム画面ですが、コンセプトが明確でわかりやすく、面白いです。エレベーターの台数や階数が増えるに連れて難しくなっていきますが、色々と試行錯誤しながら試してみたくなります。

CSS Diner

スクリーンショット 2016-05-18 13.56.38

言語:CSS

左上の目的文にしたがってCSSを指定していきます。上の画面の場合、「皿の上にあるりんごを選択しよう」とあるので、真ん中のHTMLを見ながら<apple />にスタイルを指定するつもりでセレクタを指定します。正しい場合アニメーションが再生され、次の問題にうつります。

fight codeスクリーンショット 2016-05-18 14.24.40

言語:JavaScript

自分のロボットを予めプログラミングしておき、他のユーザーのロボットと戦わせることのできるゲームです。弾に当たった時にどういった挙動をするのかなどを決めておくなど、戦略を練ってプログラミングするのが楽しいゲームです。中級者向け。

RubyWarrior

スクリーンショット 2016-05-18 14.52.29

言語:Ruby

戦士をコードで動かしていきます。基本一本道でゴールを目指しますが、ステージが進むと色々な仕掛けが増えていき、悩まされます。初心者にはちょうどいい難易度でおすすめです。

コード・ガールこれくしょん

スクリーンショット 2016-05-18 15.16.10

言語:PHP、Ruby

いわゆる日本のソーシャルカードゲーム風の学習サービスです。「探索」でコードを問いてアイテムやポイントを貯め、ガチャでキャラをコレクションしていきます。より早く問題を問いてコンボを繋げたり、ゲーム要素が強いです。

Code Studio

スクリーンショット 2016-05-18 13.46.10

言語:複数

Blockyというシステムを使って初心者でもわかりやすく、命令ブロックを組み立ててプログラミングの仕組みや概念を学ぶことが出来ます。MinecraftやStar Wars、アナと雪の女王などとのコラボもあって、子供向けではありますが、もちろん初心者の大人でも楽しく勉強できます。

Code Monkey

スクリーンショット 2016-05-18 15.34.12

こちらもキャラクターに命令を出してミッションを達成していくタイプのゲームです。子供におすすめ。

まとめ

多くのプログラミング学習ゲームはキャラを動かしながら命令を書いていくタイプですが、vimのゲームなどはかなり移植で、とっつきづらいvimの操作を覚えるにはいいですね(厳密にはプログラミングではないですが…)。

後半のふたつなどはお子さんにもおすすめなものなので、ぜひ試してみてください。


Welcome to UX MILK

UX MILKはより良いサービスやプロダクトを作りたい人のためのメディアです。

このサイトについて