公開日：2023-12-07

こんにちは。ほりです。

このブログは、Customine Advent Calendar 2023の7日目の記事です。

‍

投稿を予約したところで、どんな内容にしようかなぁと考えまして、せっかくなら普段あまり使ったことがない”やること”を使ったもの、かつ、なにかゲームっぽいものを作りたいなぁと思いました。

‍

”やること”のページをぼんやり眺めていて、よしこれだ！と決めたやることは「手書きキャンバスをスペースに表示する」でした。

絵を描くゲーム・・・じゃあバラエティ番組でよく見る、次々絵を書いて絵の伝言ゲームみたいにして最後にお題を答えるやつにしようと決めました。

‍

早速、出来上がったkintoneアプリについてご紹介します。

‍

ゲームのルール

１．お題を投稿する

２．お題を見て、絵を描く

３．描かれた絵を見て、答えを予想しつつ絵を描く

４．３回、絵が描かれたら、３回目の絵を見て回答する

‍

kintoneアプリのご紹介

‍

‍

一覧画面でできること

クイズのkintoneアプリなので、答えとか見えたら困ります。よって、一覧画面ではレコードが全く表示されないようにしました。これは一覧画面の設定で適当に条件をつけました。

‍

代わりにボタンを４つ用意しています。

・お題を投稿するボタン

・お題から選んで絵を描くボタン

・描かれた絵を見て、更に絵を描くボタン

・最後に答えを当てるボタン

‍

それぞれのボタンについて解説します。

‍

お題を投稿するボタン

ボタンを押すと、レコード追加画面に遷移します。

お題を投稿したいので、自動で「お題です！」にチェックが付くようにしていています。

ここでお題を文字列１行フィールドに記入して、お題がわかりにくそうだったら回答例の画像も添付しておきます。

‍

‍

お題を記入したら「保存」ボタンを押して完了です。

‍

お題から選んで絵を描くボタン

このボタンを押すと、お題の一覧がポップアップダイアログで表示されます。

‍

ここでは、既に回答の絵が描かれているお題は除外しています。（後で回答したいレコードを選ぶ時に困るので…）

一つ選んで、「挑戦する」ボタンを押すと、お題の詳細画面に遷移します。選んで押してみましょう。

そうすると、こんな詳細画面になります。

‍

上のボタンを押すと、レコード追加画面に遷移します。

‍

‍

お題が表示されているので、それを見て想像して描きます。

お題は前の画面からレコードを渡してその値を出しています。

描いたら「保存」ボタンを押して完了です。

‍

添付ファイルフィールドに保存されました。

‍

描かれた絵を見て、更に絵を描くボタン

誰かが描いた絵を見て、更に想像して絵を書くためのボタンです。ボタンを押すと、回答が１つか２つのレコードがポップアップで表示されるので選びます。（添付ファイルフィールドの画像も表示できたらよかったのですが…！）

‍

選んで「これにする！」を押します。

‍

この絵でいいな、と思ったら、上のボタンを押します。

‍

前の人が描いた絵も表示されるので、これを見ながら絵を描いて「保存」ボタンを押したら完了です。２回目以降は、当然お題は見えないようにしています。

ちなみに、前の人が描いた絵は関連レコードで表示しています。ここは基本機能を使っています。

同じ問題であることを管理するために、見えていませんが「問題レコード番号」というものをキーとして持っていますので、それを使って関連レコードに表示しています。

‍

最後に答えを当てるボタン

３回目の絵を見て答えを当てるボタンです。このボタンを押すと、３回目に回答されたレコードがポップアップで表示されます。回答してみたいものを選んで「これにする！」を押します。

‍

‍

そうすると画像が表示された詳細画面に遷移するので、これに回答したかったら、上のボタンを押します。

‍

‍

ボタンを押したら、ダイアログが出てくるので予想する回答を記入します。

‍

答えを記入して「答える！」を押します！！

‍

‍

残念ながら、外れてしまいました…

‍

カスタマイズを全部見せます！

さらっと説明してきましたが、実は結構いろいろなカスタマイズを仕込んでいます。細かく説明すると長くなりすぎてしまうので、よかったらカスタマイズを参考にご自身で試してみていただければと思います！

‍

ちなみに、カスタマイズをちょっと作っては確認して、直して、確認して、kintoneアプリの設定も見直して、確認して、・・・の繰り返しで作成しております。

なのでアクション番号がばらばらですが、アクション番号は小さい順ではなく、あくまでもアクションのつなぎ順に動きますので、あまり気にする必要はありません。（つまりカスタマイズ例のアクション番号は気にしないでね！）

‍

一覧画面のカスタマイズ

詳細画面のカスタマイズ

お題を投稿する追加画面

‍

絵を描く追加画面のカスタマイズ

‍

‍

ネタを思いついて作ってみての感想を最後に。

‍

これをやるためのボタンがほしいなって思ったらすぐ追加できるし、この処理とこの処理の間に、さらにこの処理がいるなって思ったらすぐアクション追加して挟めるし、動かして違うなと思ってもまたすぐやり直して、確認して、もすぐできるし、トライ＆エラーして行く過程がとってもとっても楽しかったです！！

‍

ぜひぜひ、みなさんも、楽しいカスタマインライフをお過ごしください(*´∀｀*)