こすぎ朝学」で何度かビブリオバトルを開催しています。
@jun1logさんがビブリオバトル普及委員会に名乗りをあげたこともありまして(まだ正式決定してませんが)こすぎ朝学のPRと川崎のビブリオバトルを盛り上げよう!ということで作ってみました。

こすぎ朝学ビブリオバトルタイマー

機能

  • プレゼンとディスカッションのカウント
    • プレゼン時間は通常の5分に加え、ミニ・ビブリオバトル用に3分も選べる
    • ディスカッション時間は2~3分で選択できる
    • 残り時間のプログレスバー。プレゼン中は残り2分、20秒で色が変わります。
  • レスポンシブデザイン。PCでもスマホでもOK。
  • タイマーのフルスクリーン表示(PCのみ)。プロジェクターに映す場合などに。

ナゼ色が変わるのが「残り2分」なのか・・・理由が気になってしまった方は、土曜日の朝にちょっと早起きして、こすぎ朝学に遊びにきてください。


こすぎ朝学ビブリオタイマーはHTML一枚っぺらでできています。
正確に時間を測定するため、setIntervalによるカウントではなく、カウント開始時間からの時刻差分で測定しています。

本ビブリオバトルタイマー作成にあたって利用しているサービスのメモなど。

フレームワーク

  • AngularJS

    • JavaScriptのMVW(Model-View-Whatever)フレームワーク
    • ちょこっとしたWEBアプリをつくるのにとにかく便利。
  • Bootstrap

    • CSSフレームワーク
    • レスポンシブデザインが簡単にできるのとパーツが多いので好き。

CDN

ソーシャル

その他サービス

課題など

  • ソーシャル関連を外出しして、GitHubで公開できるようにしておきたい。
  • フルスクリーンから戻るためのボタンがない。
  • (需要あれば)ショートカットキーで操作できるようにしたい。
  • (需要なくても)LeapMotionで操作できるようにしたい。