岡本雄樹です

アシアルが『アプリ制作教材』として提供しているサンプルアプリとして
『おみくじアプリ』というものがあります。

こちらは、分岐と繰り返し処理を応用しておみくじを100回引いてみよう(ガチャ要素)という作品になっています。

この作品をカスタムして『潮干狩りアプリ』を作成したらどうだろう、
というアイディアが出たので、実際にアプリ化してみたのでご紹介します。

潮干狩りアプリのスクリーンショット

開発時間

  • 実装:1時間以内
  • 素材集め:4時間程度(砂抜き含む)

企画の話

  • 全国商業高校Webアプリコンテストの生徒向けイベント(オンラインキャンプ)にて、おみくじアプリをカスタムする作例を紹介したい
    • 昨年は地域の特産品に関するお土産アプリでした
  • 今年のおみくじはガチャ要素があるので、それを踏まえた作例が欲しい
    • 特産品がザクザク出てくるアプリも考えられるが、写真が沢山必要で大変そうだ
  • そうだ、潮干狩りにしよう!

潮干狩りアプリの仕様について

  • ガチャを回す度にアサリがランダムに何個か出てくる(今回は、0~5個)
  • アサリの画像を画面に出す
  • 出てきたアサリの合計値を画面に表示する

素材の準備

プログラムの構造はベースのおみくじアプリから数行しか変更しないので1時間以内のカスタムで完成できました。問題は素材です。

AIにアサリの画像を描かせて、、、

いや、スーパーで買ってきました。

お安くなっていました、3割引です!

塩抜き済みっぽかったですが、念のため、自宅でも塩抜きをしました。

なお、凄く活きが良かったです。

アサリの画像を1~6個のパターンで用意

途中で「サイコロの目」みたいに並べた方が分かりやすい?
と思い立ち、そのように写真を撮ってみました。

  

  

スカの画像と砂の画像も用意

スカの画像、とりあえず白い□で間に合わせました。

潮干狩りっぽさを出すために、干潟の写真でも撮りに行きたかったのですが、そんな時間も取材費もないため、とりあえず砂場の写真で間に合わせました。

本当は画像を奇麗に切り抜きたかったが・・・

奇麗なサンプルアプリを提供するのが目的では無いので、このまま行きます。
最近は切り抜き用のツールも充実しているので、多分、何かツールを使えば、上手くやれるはずです。

アサリは美味しく頂きました

アサリは最後に酒蒸しにして美味しく頂きました。

カスタマイズ方法

  • おみくじ③を入手
  • アサリの画像をアップロード
  • プログラムの一部を修正

※2024年5月時点の情報です
※アプリ制作教材はアシアル社が教育機関向けに有償教材として提供しているものになります

おみくじ③を入手

Monaca Educationにログインした状態で
アプリ制作教材のサポートページ
にアクセスし
おみくじ③をインポートして下さい。

アサリの画像をアップロード

Monaca Educationの画像アップロード機能でアサリの画像をアップロードします

プログラムの一部を修正

プログラムの一部を修正します。

完成品

潮干狩りアプリをMonaca Educationにインポートする(要ログイン)