FlowTick（時間計算ツール）のカレンダービューのデザインと操作性を改善しました。
なぜこの改善を実施したか
FlowTick は「日々の作業時間を記録する」ツールとして開発しましたが、記録が蓄積してくると「先月全体でどれだけ作業したか」を俯瞰したいという需要が出てきました。自分自身も月末の勤怠確認の際に、カレンダーで日付を1件ずつクリックしながら合計を暗算している状況で、これは明らかに不便でした。
また、スマートフォンから記録を確認しようとすると、カレンダーの月切り替えが小さすぎてタップが外れるという問題も抱えていました。開発時はPCでのテストが中心だったため、見落としていた問題です。今回はこれら2点を中心に改善しました。
主な改善内容
月次サマリーの追加
カレンダー表示の上部に、選択した月の作業時間合計をカテゴリ別で表示するサマリーエリアを追加しました。「今月、開発作業に何時間使ったか」「会議にどれだけ時間を取られているか」を月単位でひと目で把握できます。月をまたいで比較したいときは、カレンダーの月切り替えボタンで切り替えると過去月のサマリーも確認できます。
日付セルのデザイン改善
作業記録がある日付は、カレンダー上でひと目で分かるようにインジケーターを表示するよう改善しました。記録が多い日ほど色が濃くなるヒートマップ表示を採用しており、「どの週が忙しかったか」を視覚的に把握できます。過去の記録を振り返るときに、どの日に作業したかを素早く確認できます。
スマートフォン操作性の向上
カレンダーの月切り替えボタンのタップ領域を拡大し、日付選択のレイアウトをスマートフォンサイズに最適化しました。出先からスマートフォンで記録を確認したり、当日の作業開始時刻をすぐに入力したりするケースに対応しています。
活用のポイント
月次サマリー機能の活用例をご紹介します。
- 勤怠システムへの入力補助：月末に月次サマリーを確認しながら、勤怠システムへの総労働時間を入力する
- プロジェクト別の工数把握：カテゴリにプロジェクト名を使えば、月別・プロジェクト別の工数が一目でわかる
- 副業・フリーランスの請求根拠：クライアント別にカテゴリを設定し、請求時の作業時間の根拠資料として月次サマリーを活用する
FlowTick について：FlowTick は開始・終了時刻を入力するだけで作業時間を自動計算するツールです。日跨ぎの計算にも対応しており、勤怠システムへの入力補助として開発しました。記録はすべてブラウザ内に保存され、勤怠情報が外部に送信されることはありません。flowtick.utily.net から無料でご利用いただけます。
フィードバックをお待ちしています
ご意見・ご要望はお問い合わせフォームからお寄せください。実際に使っている方からのフィードバックが、改善の大きな指針になっています。FlowTick の詳細についてはFlowTick 紹介ページもご覧ください。