こんにちは！
子供向けプログラミング教室kobakoスタッフです。
自分で作った作品を友達や家族に見せたい！多くの人に見てもらいたい！
そういった場合、有料のレンタルサーバーを契約して、ホームページを作って開設して、運営していくことが一般的です。
ですが、いきなり有料のものや、ホームページを作るとなるとハードルがぐんと高くなってしまいます。
そこでおすすめなのがOpenProcessingです。
ところで・・・
この記事を書いている人はだれ？
子供向けプログラミング教室です！
JavaScriptを使ったゲームプログラミング、ゲーム企画が得意な教室です。
プログラミング教室で実際に使用している、学習成果のある教材をYouTube無料配信しています。
OpenProcessingのここがすごい
OpenProcessingは、初心者向けプログラミング言語としても知られる、Processingやp5.jsで作った作品を
無料で公開することができるサービスです。
HTMLやCSS、画像やオーディオファイルもアップロードできる
HTMLやCSSもアップロードできるため、簡易的なホームページとして公開することができますし、
画像やオーディオファイルもアップロードできるため、キャラ画像や音楽をつけたProcessing作品を公開することもできます。
公開したページはURLとして所持できますので、友達や家族に配布することもできます。
正直、これだけ揃っていれば、小さなホームページであればOpenProcessingで事足りてしまうんじゃないかと思います。
他の人の作品のプログラムコードが見れる
OpenProcessingに公開された作品は、プログラミングコードの中身も閲覧することができます。
他の人の作品を参考にしながら、「これってどうやってプログラミングしているんだろう？」という疑問もすぐ解決できます。
他のユーザーも閲覧してくれる
OpenProcessingは一種のコミュニティサイトでもあります。
他のユーザーが自分の作品を閲覧してくれたり、いいねをくれたり、コメントをくれたりもします。
しかも世界中にユーザーからです。
自分の作品が世界中に届けられて、しかも全くの第三者から評価を得られる仕組みがあるのはモチベーションにもつながります。
OpenProcessingの使い方
OpenProcessingの使い方はとても簡単です。
作品をプログラミングする
会員登録なしにプログラミングを始めることができます。
作った作品を公開するときになってはじめて会員登録が必要になります。
トップページの「Create a sketch」よりすぐにプログラミング画面へ遷移します。
再生ボタンを押せば実行、</>ボタン押せばプログラミング画面へ戻ります。
https://openprocessing.org/sketch/create
HTMLを編集してみる
HTMLやCSSも編集することができます。
ModeをHTML/CSSに変更しましょう。
p5.jsのコードはそのままに、HTML部分の修正が可能です。
注意点としては、head内の修正はやめておきましょう。
head内は自動的に上書きされてしまうため、せっかくの編集も無効になる危険性があります。
body内での編集に留めておきましょう。
画像やオーディオファイルをアップロードする
画像やオーディオファイルをアップロードするには一度作品を保存する必要があります。（そのため会員登録も必要です）
個人的にわかりづらかったので特記しますが、
作品を保存後、以下のボタンを押すことで画像やオーディオファイルのアップロードが可能です。
これがわからず、結構迷いました。
ブログなどに作品を貼り付ける
ブログをお持ちなら、OpenProcessingで作ってアップロードした作品は以下のようにブログに貼り付けることもできます。
以下はゲーム演出用に紙吹雪を作ったものを掲載してみました。
たくさんの作品を公開しよう！
1つのものを長く一生懸命作るのも良いですが、プログラミング教室kobakoでは多作を推奨しています。
30分程度の基本講義を経て、基本講義を踏まえた作品作りをし、OpenProcessingに公開していきます。
短い時間ですから、中途半端な作品になることもあります。
ですが、プログラミングも作品作りもトライアンドエラーです。
ひたすら試行錯誤する意味でも、中途半端でも多作していくことで、次の作品の意欲がわいてくるし、
幅広い知識も身についてくると私たちは考えます。
ぜひプログラミング教室kobakoで作品作りをはじめてみてください。
無料体験へのお申し込みはこちらから！
kobakoのゲームプログラミング教材もYouTubeで無料配信中です！
初回の授業料（体験）は無料です。
※現在はオンライン授業でのみ対応しています。通学型ではありません。
