Meet at Idobata

21世紀の開発者のためのグループチャット Idobata の開発ブログです。

brand-new Idobata™

こんにちは、春イベントに向けてアップを始めた ursm です。

本日は皆さまに Idobata の新バージョンをご紹介いたします。今回のリリースでは元々 Bootstrap のバージョンを上げるだけのつもりだったのですが、ついでに色々やってしまった結果、コートベース全体に渡るオーバーホールとなりました。

$ git diff bs3..master | filterdiff -p1 -x  frontend/npm-shrinkwrap.json | diffstat -s
2893 files changed, 14894 insertions(+), 18598 deletions(-)

ユーザインターフェースの改善を中心として、動作の高速化や将来的な機能拡張の容易性を高める変更を行いました。テクニカルな解説は別の記事に譲るとして、今回はユーザから見た主な変更点をご紹介します。

各種ツールへの影響

Bootstrap のバージョンを 2 から 3 にアップデートしました。いくつかのクラス名が変更となっていますので、hook や bot を作成されている方はお手数ですがご対応をお願いいたします (idobata-hooks にマージされているものはすでに対応済みです)。特に badge の色指定がなくなったこと、label の色指定に使うクラス名が変更になったことが影響が大きいと思います。idobata-hooks の該当コミットもご参照ください (ここでは badge を赤くするために .progress-bar-danger を付けるというちょっとしたハックを使っています)。

Pusher のイベント名を変更しました (例: message_created -> message:created)。互換性のため message_created だけはしばらくの間以前と同じタイミングで送るようにしていますが、hubot-idobata をお使いの方はお手隙のタイミングで 0.3.0 以降のバージョンに更新をお願いいたします。 また、room_touched, all_room_touched イベントが廃止されて join:updated イベントになりました。join は room と user の中間モデルという位置付けで、未読数はこれのプロパティとなっています。hubot-idobata 以外のアダプタを作成・利用されている方は誠に恐縮ながらご対応のほどよろしくお願いいたします。

インターフェースの改善

全体的にコントラストを高め、ソリッドな印象になりました。タイトルバーの部分はモバイルでの操作性を考慮してやや大き目に、スワイプによるサイドバーの出し入れもできるようにしています。また、実験的にアニメーション効果を取り入れて操作したときに何が起きたかわかりやすいようにしてみました。

メッセージ一覧は線を減らしてすっきりとした見た目になりました。なるべくゆったりさせつつ、チャットとして大事な一覧性を損ねないよう配慮しています。メッセージの投稿ボタンとアップロードボタンはひとつに統合されました。また、新機能としてルーム内を検索できるようになりました。

設定画面はパネルを基調としたデザインに変わりました。一覧のアイテムを増やす操作は左上の緑色のボタン、絞り込みは右上のフィールドといった具合に操作性の統一を計っています。

編集項目は使い勝手と見た目を考慮して inplace editor 風のコンポーネントになりました。また、トークンや invitation URL はワンクリックでクリップボードにコピーできるようになりました (Flash が有効な環境のみ)。

パフォーマンス

サーバから取得するデータを最適化することで初回のページロードが高速になりました。ページを切り替えたときの動作も速くなってはいますが、こちらまだまだ改善の余地があります。

オフラインからオンラインに復帰したときのリロード処理が高速になりました。以前はページ全体をリロードしていましたが、今はアプリケーションの内部状態を一旦破棄して再構築することで高速化しています。欲を言えばリロードせずに差分のイベントのみを取得するのが望ましいのですが、今後の課題とさせてくださいませ。

クエリのチューニングと合わせてデータベースインスタンスのメモリを4倍に増量しました。これまで以上に快適なチャットをお楽しみいただけるものと思いいます。

キーボードショートカット

ルーム名を部分一致で絞り込んで移動できるコマンドバーという機能を追加しました。c で起動します。? でショートカットの一覧が見れますので合わせてご活用くださいませ。

Android アプリ

Idobata for Android の提供を始めました。例によって WebView を貼り付けただけの簡便なものですが、アセット一式をパッケージングしているので起動が微妙に速い……と思います。iOS 版と同じくプッシュ通知にも対応しています。ぜひご利用くださいませ。

Hook

イマイチわかりにくかった Generic を Custom Webhook と名前を改めました。既存の Generic hook については Endpoint URL 含め影響はありません。


皆さまに新しい Idobata を気に入っていただけることを願っています。今後の展開にもご期待ください!