LINEとメールによる通知

２週間ほど前、LINE Notifyによるコメントの通知機能を追加したのですが、今のところ、ほとんどの学生が設定していない様子です。大福帳.jsを「友だち」に加えなければならないのでは、と思っているのかもしれません。

実際は、大福帳.jsを「友だち」にする必要はなく、LINEの公式アカウントであるLINE Notifyに大福帳.jsがメッセージを送信し、ユーザーはLINE Notifyから通知を受けるという仕組みです。また、ユーザーがLINE Notifyを操作して、通知の受取りを解除することも簡単にできます*。

心理的なバリアはメールのほうが低いような気もするので、塩漬けにしてあった「メールによる通知」の設定も、「アカウント」に表示されるようにしておきました。

なお、LINE Notifyでの通知を教員側が設定すると、受講生の新規の書込みが通知されます。授業の帰りに、自分の端末で、その日の授業の書込みを確認するのは、案外と悪くないものです。

一方、メールを使って同じような通知を行うと、沢山のメールがいっときに届けられて、ほとんど迷惑メール状態になってしまいます。そのため、受講者からの書込みを教員にメールで通知する機能は、今のところ組み込んでいません。

メッセージの自動保存

受講生の大福帳への書き込みは、フォームに記入後【書き込む】ボタンを押して完了、という流れになっていますが、わずかながら、書き込みができていなかった、という例がありました。おそらくボタンの押し忘れと思います。

いまどきのウェブサービスは自動保存が当たり前なので、そちらに慣れている若者は、最後にボタンを押すところまで気が回らないのかもしれません。

そこで、受講生の記入欄も、Ajaxで自動保存されるよう改修しておきました。入力後、1秒間何もしなければ保存、という設定です。

この状態でしばらく様子を見ることにします。

画像の縮小アルゴリズムの改善

授業ごとのメッセージに写真を１点添付できる機能を加えたのですが、大きな画像がたまるとディスクがじきに逼迫するのは目に見えているため、画像サイズは512×512ピクセル固定*としました。

そのため、画像をアップロードする前に、クライアント側で画像の縮小を行なう工程を入れてあったのですが、単純にcanvasのdrawImage()で縮めただけだったため、物体の縁や線の部分がジャギーになってしまっていました。

ピクセル毎に処理するのも重たそうだったので、ウェブで見つけた「多段階縮小アルゴリズム」**に変えてみたところ、実用に耐えるレベルにはなったのではないかと思います。

これまでのアルゴリズムで縮小

改良版のアルゴリズムで縮小

スマートフォン用の画面デザイン

スマホには殆ど触らない生活をしていることもあって、大福帳.js の画面デザインは完全にパソコン向きだったのですが、そのままではいけないと思い、受講者用の画面を少し改善してみました。

左に受講生、右に教員の書き込み欄を並べるのが「大福帳」の基本的なフォーマットですが、スマホの小さな画面でそれを実現しようとすると、それぞれの欄がかなり小さくなってしまいました。

さりとて、LINEのように「互い違い」に表示するのも何となくイケナイような気もするし、もうしばらく様子を見ながら、最適なデザインを探したいと考えています。

一方で、教員用の画面のデザインは、相変わらずパソコンの使用を前提にしています。悪しからずご了承願います。

LINE Notifyへの通知の挙動（備忘録）

LINEとの連携を設定している受講者がメッセージを書き込むと、そのメッセージには、LINE Notifyのアクセストークンと「未送信」のフラグが付けられる。

教員が「コメントを公開」すると、アクセストークンが設定され、かつ、未送信のメッセージへのコメントが、LINE Notifyに送信される。LINE Notifyからのレスポンスコードが200（正常）の場合には「送信済」にフラグを変更する。

受講者がメッセージを書き込んだ際に「未送信」のフラグが付けられる。従って、大福帳の設定が「随時メッセージ交換を行なう」になっている場合、受講者がメッセージを更新する都度、フラグは「未送信」にリセットされ、教員が大福帳の設定画面で「設定」ボタンを押すと、コメントが再送される。

メール関係のトラブル

サインアップやパスワード変更の際のメールでエラーが立て続けに発生するトラブルに遭遇。原因がDNS周りにあることは確かなのですが、大福帳.js 用に使っているのは自分が管理するメールサーバーではないため、細かく調べることができませんでした。

研究室のサーバーをメール送信用に使っても良いのですが、何かの都合でリブートしたり、たまに作業停電があったりするので、折角 大福帳.js をクラウド上で運用している意味が薄らいでしまいます。

次善の策として、メール送信は Gmail から行なうように設定を変更しました。メールで送信されるのは乱数で生成した確認用のURIだけですので、プライバシー等の面で全く問題ないと判断しました。

SNSとの連携

授業で大福帳に書き込んでもらった後は、できるだけ早くコメントを記入するようにしているのですが、授業後に大福帳.jsにアクセスしてコメントを確認する受講者はぽつりぽつりとしかいません。

他にも沢山授業はあるし、サークルやバイトで忙しいでしょうから、それは当然かもしれませんが、もうちょっと気にかけて欲しいな、と思う気持ちはあります。

コメントをメールで自動的に送信することは技術的にはたいして難しくありませんが、私自身が押し付けがましいメールを受けとりたくないこともあって、大福帳.jsには組み込んでいません*。

この大学の１年生を対象にしたアンケートでは、LINEの利用者は毎年増加しており、今年は9割を超えていました。

そこで、LINEのAPIを使って、教員が記入したコメントを自動的にLINEの受講者のアカウントに送る機能を追加してみました**。


設定は、ログイン後、「アカウント」で行います。LINEへの通知を設定すると、LINE Notifyの認証・確認画面が開き、受講者が連携を許可すると、（OAUTH2の手順で）LINE側からアクセストークンが得られます。大福帳.js はそのトークンを使って、受講者ごとにコメントを発出します。

コメントが送信されるのは、教員が「大福帳の設定」で、「コメントを公開する」（または、「随時メッセージ交換を行なう」）を選んで、【設定】ボタンを押したタイミングです。

（2016年11月13日更新）

=======
* 内部的にはメールによる通知機能は組み込み済みで、ログインした状態で
https://goose.cite.tohoku.ac.jp/daifukujs/user/email_notification/on
にアクセスするとオンにすることができます。

** 当初はLINE LoginとMessaging APIを組み合わせた方式で開発していたのですが、Messaging APIの無料プランは投稿数に上限があるため（１月あたりの応答回数1000回まで）、そうした制限のゆるいLINE Notifyに切り替えました（１時間あたりAPIを1000回コールできるらしい）。

大福帳.js を１ヶ月ほど使ってみて

大福帳.js は、2016年の盆休みに制作し、10月から始まった工学部２年生向けの数学の授業（60名ほど）で「実証テスト」を始めました。

クラスは全員スマホを携帯していたので、サインアップと受講登録はほとんどその場で完了しました（その後、メールサーバーの具合が悪かった期間があったため、登録できずにいた学生が２名ほど相談に来ました）。操作面では今どきの学生は全く問題なく対応できることを確認しました。

授業は、終了時刻よりも５分ほど早めに切り上げるようにして、記入してもらっています。記述量は、個人差はありますが、５０〜１００文字程度、といったところです。

書き込みをすると、バッジ（リンゴマーク）を１つ以上差し上げること、その個数を出席（授業への参加度）の目安にすることを伝えたところ、殆どの学生が書き込みをしてくれています。

少し意外だったのは、氏名などが表示されるわけではないのに、書き込みを「非公開」に設定する学生が多数派だったことです。

３回目くらいから、書き込みの内容がマンネリ化する受講者が見受けられたので、「お題」として「授業のキーワード」を指定しました。

回答の記入は、パソコンさえあればどこでもできるので、スキマ時間の活用にもなって、当初予想したほどの負担感はありませんでした。１件あたりの回答時間は１分弱くらいといったところですが、慣れれば（乗ってくれば）さらに短縮可能です。むしろ、総じてポジティブな書き込みが多く、励みになりました。

大福帳の動作

大福帳の動作について「ヘルプ」の記載を補足・訂正します：

コースを作成し、その中に複数の授業を登録します（レンチのアイコン）。

授業の中から、大福帳に書き込みを行うものをひとつ選択します
選択した授業については、受講生の大福帳への書き込み、教員のコメントの公開を教員側で設定できます（歯車のアイコン）。

選択されていない過去の授業については、受講者の書き込みは不可、教員のコメントは「公開」の状態になります。

授業はリストに登録されている順番で管理されています。そのため、大福帳に書き込みが行われた「後」に授業のリストを編集すると（レンチのアイコン）、授業と大福帳への書き込みの対応関係がずれてしまいますのでご注意ください。

画像の添付機能の追加

文字に加え、各回の書き込みに画像を１点、添付できるようにしました。

受講生の画面のカメラのアイコンをクリックすると、画像のアップロード画面が開きます。画像は512×512ピクセルに自動的に調整されます。

受講生の書き込みの上にカメラのアイコンが表示されていると、写真が添付されていることを表します。アイコンをクリックすると画像がポップアップで表示されます。

メール送信のトラブル

サインアップやパスワードリセットの際に利用しているメールサーバーが、Fromを詐称して "no_reply" から送信できないよう設定が変更されていたことに気づかず、暫くの間、メール送信がストップしていました。10月27日に気づいて、設定を変更しました。