⏱️
学習時間の計測と記録の仕組みを Pixela で構築する
現在私が働いている会社では、英語学習プログラムがあります。私もそれに参加しています。
その学習プログラムでは、「週に一度の 1on1 レッスンを受けること」と、「毎日の自己学習の記録をつけること」の2つが課されます。
自己学習の記録は、当初は、自分の記憶に頼ったり、大雑把に記録するなどしていました。ですが最近は、その記録すること自体が億劫になってしまい、さらにそれが英語学習のモチベーションにも影響を及ぼし始めてきた気がしてきました。そこで私は、学習時間の計測と記録の仕組みを Pixela で構築することにしました。
今回構築した仕組みは、以下のようなものです。
- iPhone で NFC タグにタッチする。学習の開始が Pixela に記録される。
- 英語学習を行う。
- 学習を終えるタイミングで、再度、iPhone で NFC タグにタッチする。学習の終了と、どのくらいの時間学習したのかが Pixela に記録される。
この記事では、上記の仕組みの構築方法をご紹介します。
学習時間計測&記録の仕組みの構築方法
1. NFCタグを購入する
仕組みの利用自体が面倒なものになってしまっては、意味がありません。できるだけ手軽に、仕組みを利用できる必要があります。例えば、何かにタッチするだけで計測と記録の両方が行えてしまうような。
それを実現するために、まずは NFC タグを購入します。Amazon などのサイトで「NFCタグ」と入力すれば、たくさんの選択肢が表示されるだろうと思います。私は下の写真のような、丸いシールタイプのものを購入しました。
![NFCタグ](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/b0c3f52f-9d7a-478e-9987-38eb087d6a5b/0ea260b2f41fafbfc196fa861014d136.heic)
2. 学習記録用の Pixela アカウント、グラフを作成する
以降の例では、 という username で、 という GraphID のグラフを作成したと仮定します。また、パスワードに相当する として という文字列を指定した、ということにしておきます。これは、今後の例示の中で登場します。
3. iOS「ショートカット」アプリでオートメーションを作成する
今回のような、「iPhone が NFC タグに触れたら、特定の処理を行う」といった仕組みは、iOS のアプリの「ショートカット」で実現可能です。
「ショートカット」アプリを開いたら、画面下のタブの「オートメーション」をタップします。
そして、画面右上の をタップ。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/753bd233-78bc-4ee7-8041-f4aa305342d6/2046dbfd6a06a3108df37ec267efee43.jpg)
「個人用オートメーションを作成」タップ。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/129b9aa5-0813-4fec-87d9-ed3a2242bebc/fe1b097fccfa68eb1ce777f7fb7a050e.png)
すると表示された複数の「新規オートメーション」の中から、「NFC」を探し出してタップ。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/f3a2dbf4-c732-4aa9-9c7a-f807e3bd47cb/a0e3a645c04e4c9cd831d95ae97e2cc8.png)
内容を確認し、「スキャン」をタップします。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/c0c8752b-aa7f-4314-bfe6-7d243f4e894b/231f250cfef599991348533e85d853f7.png)
すると以下のような表示になりますので、ここで先程のNFCタグを1枚選んで、読み取ります。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/e5aa5c38-052c-4c97-aca9-a75b6b5ab515/581fe4f71236bb01ebfdba0143c50514.png)
iPhone の上の方でタッチするように心がけると、比較的簡単に認識してくれると思います。
iPhone にNFCタグが認識されると、そのタグにつける名称を入力するダイアログが表示されます。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/022af2b2-859f-4b0d-a352-3671e6a14e18/49abfc09c18c771f882564cb1a774a88.jpeg)
元の画面に戻りますので、「次へ」をタップ。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/a372782e-8493-4ee3-aa6c-13bae5125f6c/93bfd148b2255afee84d7c3b65808a14.jpeg)
すると以下のような表示になるので、
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/177ceef8-d50c-4d36-ad05-a231d7a0066d/869f31e66accbf0b42303c59f12efd84.png)
「App およびアクションを検索」と表示されている検索窓に と入力することで表示される「 🔗 URL」というアイテムをタップします。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/1b4e7ece-4267-43f0-83f3-c34827a12b44/355e57d0e00ccfaf61aa695e76219707.png)
すると以下のような表示になりますので、
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/817fad71-5198-4e67-b88d-30337e62b4c4/a2ab9ca8d72bb4f7ff99b10d9ffeab53.png)
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/8b29eb58-57e4-4ce2-8f04-a1999e8685eb/4a16515e2e4acd5810596159a21988f5.png)
(おわかりかと思いますが、以下のURLの や の部分は、あなたの実際の usename や GraphID に置き換えてください。)
さらにアクションを追加していきます。「App およびアクションを検索」と表示されている検索窓に、今度は「内容を取得」と入力します。すると「URLの内容を取得」というアイテムが表示されるはずですので、これをタップします。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/376201cd-592b-4018-a962-0fcd545c1f12/2eb6c732ba2294955de4fc77aa9d43a3.png)
追加されたアクションの マークをタップすると、
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/233bb8e5-df31-40cf-81f0-cb5ad2d57e71/8129e9d7961ad51cd435c45fc59736b7.png)
以下のような表示になります。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/6fd6e06e-9a78-4d56-809c-578f7bb156a7/49d718b547336dca70d0d8f3c9f34b87.png)
「方法」のところは初期状態では になっていますが、ここをタップして に変更します。すると、表示が以下のように変化します。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/ffc441a7-6b96-4c0d-a06f-f341bc812ae7/0b422b53d62d092025ccd36d7a28f777.png)
このうちの「ヘッダ」欄をタップすると、以下のように「新規ヘッダを追加」という入力欄が表示されますので、
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/0adb3931-160f-4672-be93-b3f5b92510b0/8da9b4efca1209f5a730068ee0f13998.png)
その欄をタップします。すると、以下のような表示になります。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/a1fb3728-4549-46bc-af53-59f074f09fd6/1f424775e05c38e2e84b739ad51f9898.png)
「キー」のところをタップし、そこに と入力します。
「テキスト」のところをタップし、そこに と入力します。もちろん、これはあくまで例であり、実際に試す際にはそのユーザーの 文字列を指定してくださいね。
以下のような表示になっていればOKです。 のところは、画面が小さくて と省略されていますが、気にせずに。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/e8e4d5fc-f9b8-4f84-bcd4-5140ef8c9198/b22af794e7746181a49de49066ce49bb.png)
もうひとつ、アクションを追加しましょう。「App およびアクションを検索」と表示されている検索窓に「振動」と入力することで表示された「デバイスを振動させる」というアクションをタップします。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/d8d69f11-34ee-47d9-b457-272eba344443/736734c00bcfa4122fece0e46eb1d1c1.png)
これで追加するアクションは終わりです。画面右上の「次へ」をタップしてください。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/0e7ae520-5a25-4337-bc03-914c5c00c42f/131dea3897ddc1b0254cdc1daf2db228.png)
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/5a303cd0-3c57-45b6-a83f-def72572aade/59accbf12b3cf99d0fb8d7ecca89e4cc.png)
「実行の前に尋ねる」のオプションはオフにしておくほうが、素早く計測を開始・終了できて便利だと思います。
問題なければ、画面右上の「完了」をタップして、オートメーションの作成は完了です。
4. 計測を開始・終了させてみる
それでは、iPhoneのロックを解除した状態で、NFCタグにタッチしてみましょう。
一瞬、iPhone本体が振動し、下のスクリーンショットのような通知が表示されるかと思います。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/9d12fa4b-5b40-48a4-8a86-f75e8d7153a5/b0afa7ee8f77440c7e884ac21b65ba51.png)
これで、計測がスタートした状態です。少しだけ時間を置いて、もう一度、NFCタグをタッチさせてみましょう。同じように iPhone が振動し、同じ通知が表示されたら成功です。
作成したグラフを確認してみましょう。ここまで使用してきた例を用いるなら、 でグラフが表示されるはずです。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/a492fdb0-8440-47c9-8189-39e551fb3dd9/608ec9977248249745da162db0e3b6f7.png)
上出来ですね!
解説
今回、NFCタグの検知をトリガーとして iPhone にリクエストさせた Pixela の API は POST - /v1/users/<username>/graphs/<graphID>/stopwatch です。この API の活用方法については Pixela をストップウォッチとして使い、計測した時間をそのまま記録する でも紹介していますので、ぜひこちらも読んでみてください。
One more thing...
ちなみに、私は自分の iPhone に下の写真ようなカードポケットを貼り付けています。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/bcffefcd-075f-4de6-8321-59823896c75b/413099eae010d5de90d0585c26a81402.jpg)
このカードポケットの蓋の裏面にNFCタグを貼り付けています。
![](https://s3.ap-northeast-1.amazonaws.com/wraptas-prod/pixela/92ea6ea3-3e28-4cc1-9e87-26c4f16e1f66/21c82ca1f88589ef5a43f0c47324a2d4.jpg)
これは計測をこの上なく簡単なものにしてくれる、最高のソリューションだと感じています。