2021-08-28
学生x防犯・防災をテーマとしたjigインターン2021夏シーズン2、Bチームはコロナで避難訓練ができていない小学生のためのクイズアプリ「防災王」

防災王サーバーレス版 forked from 2021-summer-2-b


台風か火災、ジャンルを選んで出題される3問に答えよう。


選んだ選択肢ごとに点数がついて合計点数が表示される。


チームB、いつき、ゆー、サウスケイ、こーよー

JavaScriptのESモジュールで分割してチーム開発、1つのHTMLでつくるSPAとしてまとまっています。ボタンを押したときの効果音がアガりますね! 写真だけでなく、効果音もオープンデータなどフリー素材をうまく使ってクオリティーアップ!

Code for FUKUIで、オープンな素材まとめ、作りました。
code4fukui/openres: 素材オープンデータまとめ
いい感じのサイトあれば、ぜひIssueやプルリクお送りください!


サウンドパネルsrc on GitHub
今回の「防災王」で活用されていた「効果音ラボ」のステキ効果音4つを使ったサウンドパネル作りました。 HTMLに効果音ファイルを指定するだけで、音が鳴るボタンができますよ!(AudioButton extends HTMLElement and HTMLButtonElement、SafariはHTMLButtonElement継承非対応) <script type="module" src="https://code4fukui.github.io/audio-button/audio-button.js"></script> <audio-button src="sound/dodon.mp3">ドドン</audio-button> <audio-button src="sound/pipo.mp3">ピポ</audio-button> <audio-button src="sound/chiin.mp3">チーン</audio-button> <audio-button src="sound/pappapa.mp3">パッパパー</audio-button>

jigインターン生によるブログ、ご覧ください!
⭐jigintern diary⭐

Tweet
クリエイティブ・コモンズ・ライセンス
本ブログの記事や写真は「Creative Commons — CC BY 4.0」の下に提供します。記事内で紹介するプログラムや作品は、それぞれに記載されたライセンスを参照ください。
CC BY / @taisukef / アイコン画像 / プロフィール画像 / 「一日一創」画像 / RSS