このページでは、Webブラウザゲームの作り方を解説します。
そもそもWebブラウザゲームとは何か？
こういうやつです↓
インターネットを見ていると、ホームページ上でできるゲームがありますよね？
ダウンロードとか無しでできるやつです。
それのことです。
広告と一緒に付いているようなゲームが多いですね。
ゲームを少ししたら広告が表示されてくるものもありますね。
ちなみに上の画像は私が作ったWebブラウザゲームです。
私が作ったゲームは以下にリンクを付けておきます。
このページを読んだ後に試してみてください。
このページを読んでくれているあなたは、少しでもWebブラウザゲームを作りたいと思っているはずですので、さっそく作り方を解説します。
このページは導入ですので、どんな感じで作っていくのか、全体像を説明します。
いきなり小難しい専門用語が出てくると、余計わからなくなりますので。
Visual Studio Codeをインストールする
まずはVisual Studio Codeというアプリをインストールします。
↓のマークのやつですが、知っていますか？
アドレスも付けておきます。
検索すればすぐ出てきますけどね。
https://azure.microsoft.com/ja-jp/products/visual-studio-code/
このアプリはプログラムを書くために使用します。
実際このアプリをインストールしなくても、メモ帳や秀丸やサクラエディタなどのテキストツールでもよいのですが、絶対これの方が使いやすいのでインストールした方がよいです。
インストール手順などは別ページで解説します。
今回は導入ですので概要のみです。
プログラムを書く
これが本題ですね。
プログラムを書いて、ゲームを作ります。
どんな言語を使うのか？
html, css, javascriptの3つです。
何だそれ？そりゃ難しそうだな、無理だ、と思った方。
全く問題ありません(*^^)v
簡単です。
私はプログラミングのプロではありません。
はっきり言って素人です。
私が説明する内容は、プロの方から見ればまるで素人だとすぐにわかることでしょう。
しかし、そんな私でも作ることができました。
私はプログラミングの学校に通っていません。
学習用の教材も見たことがありません。
インターネットで調べながら作りたいものを作っただけです。
だから費用は全くかかっていません。
調べるのに時間はかかったけど・・・(+_+)
なので、簡単に解説できますので、すぐにできるようになると思います。
別ページで解説します。
ちなみに、
htmlというのは、ホームページを作るときに使うやつです。
画面のどこにどんな文字や画像が表示させるかを設定するためのものです。
cssというのは、表示する文字のサイズや色やスペースのサイズなどを設定するために使うものです。
javascriptは、どんな状態になったらどうする、という処理を書くものです。
これが一番プログラミングっぽいかな。
例えば、ボールを地面に落としたら、ゲームオーバーと表示させる、とかです。
ウェブサイトにアップする
ウェブサイトにアップしなくても、自分のPCだけで遊ぶことはできます。
作ったファイルを他のPCで開けば、別のPCでも遊ぶことができます。
とにかくそれだけでよい人はこの対応は不要です。
でもせっかくなので、ウェブサイトにアップして、インターネットでたくさんの人に遊んでもらいたいですよね？
初めは恥ずかしいかもしれませんが。
その覚悟がある方は、自分のウェブサイトを作る必要があります。
ウェブサイトを作るためには、レンタルサーバーを借りる必要があります。
レンタルサーバーには無料のものと有料のものがあります。
容量の問題や、急にサービスが終了するといったことがありますので、私は有料をお勧めしますが、最初は無料でもよいです。
というか、この項目はゲーム制作とは少し異なる内容ですので、一旦無視しても構いません。
とりあえずプログラムの作成まででゲームは作れますので。
このページは導入ですので、これで以上です。
詳細は別ページで解説します。
私が作ったゲームはこちら
all you have to do is (to) 動詞の原形、の形で、あなたがやらなければいけないことは・・・だけ、を意味します。
all (which) you have to do のように目的格の関係代名詞の省略と想定でき、あなたがやらなければならない全て、と訳せます。
isがあるので、isの後に書かれることが、やらなければいけないことだと何となくわかると思います。
しかし、isの後ろのtoはしばしば省略されて、いきなり動詞の原形が来るため、これを知らなかった私は、何時間も悩み続けて時間を浪費しました。
to+動詞の原形で、・・・すること、を意味します。
以下の例文で解説します。
Birren’s Stationery receives orders through its online ordering system. To place an order, all you have to do is browse our online store, select the items you wish to add to your basket, and click the “Order” button.(後略)
世界一わかりやすいTOEIC L&Rテスト総合模試2[800点突破レベル] 関 正生 著より 引用
Birren’s Stationery receives orders through its online ordering system.
stationeryの頭文字も大文字になっているため、Birren’s Stationeryは固有名詞です。
receivesはreceive(動詞：・・・を受け取る)に三単現のsが付いています。
ordersはreceivesの目的語で、注文(そのままオーダーでもよいと思います。)という名詞です。
throughは・・・を通じて、などの意味の前置詞です。
itsはitの所有格です。I my me mineのmyや、he his him hisのhisと同じです。
it’sと混同しやすいですが、it’sは、it isやit hasの省略です。
its online ordering systemで、そのオーダリングシステム(注文システム)、と訳します。
To place an order,
place an orderで、注文を置く→注文する、という意味になります。
TOEICでは超頻出です。
To place an orderで、注文するために、という副詞句です。
all you have to do is browse our online store
all you have to do is (to) browse our online storeと、toが省略されています。
browseは、インターネットで・・・をブラウズする、・・・を見る、という意味の動詞です。
browseの目的語はour online storeで、私たちのオンラインストアを見ることだけ、という意味になります。
select the items you wish to add to your basket, and click the “Order” button.
selectは、・・・を選ぶ、という動詞で主語がないため、命令形になっています。
選べ、という強い感じではなく、選んで、という感じで使われます。
目的語はthe itemsで、アイテムを選んで(ください)という意味です。
select the items (which) you wish to add to your basket
wishは、wish to do の形で、・・・したいと思う、という意味です。
to add は to不定詞で、・・・を加えるために、というような意味です。
add は、add O1 to O2の形で、O1をO2に加える、という意味になりますが、O1が無いです。
the itemsの後に、急に主語のyouが来ていることから、目的格の関係代名詞の省略だとわかります。
あなたのバスケットに加えたいアイテムを選んで(ください)という意味です。
and click the “Order” buttonは、そしてオーダーボタンをクリックして(ください)という意味です。
********************************
本サイトは、英語学習者が必ず理解できるように全文解説をしています。
以下のように関連した記事を表示できますので、関連した英文を読み、英語のトレーニングをしてください。
このマークはカテゴリーです。
以下に、この記事のカテゴリーが表示されており、クリックすると、この記事と同じカテゴリーの関連記事が表示されます。
このマークはタグです。
以下にこの記事内で解説したポイントを表したタグが表示されており、クリックすると同じポイントを解説している関連記事が表示されます。
コメント