見出し画像

常に最前面に表示されるタイマーアプリを作ってみた

開発動機

仕事でシステムをチーム開発する際、時間を決め打って議論やペア/モブプログラミングをすることが多い。
定めた制限時間は常に全員が認識できるようにしている。

制限時間が見えているのは良いことだ。
限られた時間の中で建設的に議論を進めようとする力が参加者の間に働く。

全員がその場に居るのであれば、卓上タイマーを使えばいい。

議論するメンバーが遠隔の場合、ZoomやDiscordで画面を共有しながら話し合うことになる。
共有できるのは1画面の限られたスペースであり、Webブラウザやコードエディタなどを行き来しているうちに通常のデスクトップタイマーは背面に隠れてしまう。

タイマーが常に最前面に居座ってくれるとありがたい。

概要

シンプルなタイマーアプリ。
機能は一般的なタイマーと同様で最低限のことだけ。

ウィンドウ下部に表示される3つのスライダーで「時」「分」「秒」をセットする。

タイマーが開始されると、3つのスライダーは非表示になる。
白く光っているバーが時間経過でアニメーションして短くなってゆく。

設定した時間が経過すると音が鳴り、画面の色が変わる。
リセットボタンを押すと、直前にセットされていた残り時間に戻る。

アプリケーションを閉じて再度開くと、閉じた時にセットされていた残り時間と画面サイズが記憶されている。

インストール方法

※現在Windowsのexeのみビルドして配布しています

GitHubのリリースページへアクセスし、最新のリリースの「Assets」から「frontimer-Setup-バージョン名.exe」をダウンロードする。

「frontimer-Setup-バージョン名.exe」を実行。
署名なしのアプリケーションとしてビルドされているので(コードサイニング証明書は高い…)Windowsのセキュリティ設定でブロックされてしまう。
インストールを続けるには「詳細情報」をクリック。

そのまま表示された「実行」をクリック。

インストーラーが立ち上がるので、指示に従ってインストール完了。

Windows11の「クロックアプリ」でよくない?

その通りです。

現時点でWindows11の「クロック」というアプリでは、この「タイマーの最前面化」が実装され、更にポモドーロ機能も追加されて神アプリになった。
是非Microsoft謹製のクロックアプリをお使いください(おい)

拙作のUIが気に入った方だけfrontimerをダウンロードしてみてください。

開発裏話

Windows10を使っていた頃「クロック」にはこの「タイマーの最前面化」機能が無かった。
そのためC#で「タイマーの最前面化」機能を有するアプリを作り、開発チームメンバーに配布して使っていたりした。

言語の学習がてらC#で作ってみたものの、メンテしていくなら得意な言語を使ったほうが負担が少ない。
大した労力でもないので書き直すことに。

(書き直しを始めた頃には既にWindowsのクロックアプリはアップデートされ最前面化ができるようになっていたのだが、過去に使うのを諦めたのもあり更新を見逃していた…。)

React×TypeScriptでUIとロジックを実装し、Electronでデスクトップアプリケーション化する。

C#版ではやっていなかったテストやCI/CD周りもちゃんとやっておこうという方針。

Dependabotを入れ、依存関係の更新に追従。
自動テストにJestを導入し、GitHub Actionsでコミットやプルリクの度にテストが走るよう設定。
タグをつけると自動的にリリースのドラフトが発行され、そこにWindows用のexeファイルがアップされる。

C#版では手元でビルドしたexeを配布していたが、自動ビルドを導入したReact×TypeScript(Electron)版ではGitHubのリリースページから直接ダウンロードできるので勝手が良い。

プルリクやIssueいただければ、気が向いたときに対応します。

この記事が気に入ったらサポートをしてみませんか?