【開発日記#2】企画書を作ってみた｜インターバルタイマーの設計メモ
こんにちは、mAgmAです！
前回の記事（[開発日記#1]
(https://zenn.dev/magma_program/articles/db3242a6cde0d8)）
では、インターバルタイマーを作る動機や方向性について書きました。
今回はその続きとして、簡単な企画書・設計メモをまとめてみました！
📌 アプリの概要
| アプリ名 | Web Interval Timer（仮） |
| 概要 | 作業時間・休憩時間を自由に設定できる、シンプルなWebタイマー |
| 利用者 | 集中して作業したい人、トレーニングに活用したい人 |
| 技術 | Java（Spring Boot）、HTML/CSS/JavaScript |
| 公開 | 無料サーバーでWeb上にデプロイ予定 |
🧠 アプリの目的・特徴
-
目的：
Webブラウザで動く軽量なインターバルタイマーを提供し、作業効率や集中力UPをサポートする -
特徴：
- 広告なし、即起動、操作が直感的
- タイマー通知機能を実装
- 時間のプリセット保存（将来的に検討）
- 最低限のCSSレスポンシブ対応（スマホ完全対応は非目標）
👥 ユーザーストーリー（例）
「在宅ワーク中の社会人が、ポモドーロテクニック（25分作業＋5分休憩）を効率的にこなしたい」
主な行動の流れ：
- Webサイトにアクセス
- 作業時間と休憩時間を入力
- 「スタート」ボタンを押す
- タイマーがカウントダウンし、時間ごとに通知（音 or 色変化）
- 必要に応じて「停止」や「リセット」
🧩 画面構成イメージ（ワイヤーフレーム）
※手描きです。きたない
📝 ワイヤーフレームに関するメモ
仮タイトル
インターバルタイマー
仮サブタイトル
時間を区切って効率アップ！
２つのタイマーを交互に作動させて作業に活用できるWebアプリケーションです。
その他の検討ポイント
- コンテンツは中央揃えです(確定)
- 各時間のタイトルは英表記してもかっこよさそう
- 入力欄は型、単位ともに未定です
- ボタンの順番はわからん、上図がいいと思った、スタートが真ん中？
✏️ 書いてみての感想
今回、企画書という形でアプリの目的や機能を整理してみて、自分でも開発の方向性がだいぶ明確になったように感じました。
個人開発だと、コードを書き始めたくなる気持ちも強いですが、**「誰のために」「何を作るのか」**をちゃんと言語化しておくと、モチベーションがぶれにくくなりそうです。
🔜 次回予告
次回は、開発環境の構築とSpring BootでのHello Worldまでを扱います。
Java開発の基本的なセットアップから、最初の動作確認までを記録していきます！
🗂 今後の進め方（開発日記シリーズ構成）
| #1 | [なぜ作るのか？集中したい私のためのWebタイマー] | ✅投稿済み |(https://zenn.dev/magma_program/articles/db3242a6cde0d8)
| #2 | 企画書を作ってみた ← 今ココ！
| #3 | 開発環境を整えてHello World | 🔜次回公開予定 |
| #4 | タイマーの基本ロジックをJavaで実装 | ⏳予定 |
| #5 | フロントエンドのUIをHTML/CSSで構築 | ⏳予定 |
| #6 | Javaとフロントを接続して動かす | ⏳予定 |
| #7 | 無料サーバーでWebに公開する | ⏳予定 |
| #8 | ふりかえりと、やってよかったこと | ⏳予定 |
次回もお楽しみに。また読んでくださると嬉しいです！
読んでくださってありがとうございました！
アドバイスも待ってます！
Discussion
今の仕様だとフロントエンドだけで実装できそうですが、 Java（Spring Boot）は何に使うんでしょうか。
作業時間の記録用？それをやるとなると認証どうするかとかちょっと複雑になりそうなので
とりあえず、フロントエンドだけで実装してみるのはどうでしょう。
コメントありがとうございます！
Javaは作業時間の記録とタイマーの実装に使おうと思っています！
認証…ログイン機能のようなものという認識でいいのでしょうか。
調べなおしてフロントで実装できる方法を調べてみます！
ちなみにJavaを使おうとしてアプリケーションを開発する場合、どんな機能があるんですか？浅い質問ですみません
Javaというか、サーバで実行されて、HTMLやデータを返すプログラム（バックエンド）と、ブラウザで実行されて画面に動きをつけたりするプログラム（フロントエンド）があり、フロントエンドのプログラムは基本的にjavascript か、typescript のようなjavascriptに変換できる言語でしか記述できません。タイマーはブラウザ上で動くのでjavaのようなサーバサイドで動く言語では実装できないとおもいます。
タイマーの設定のような小さいデータならjavascriptでブラウザに保存することもできますが、何万件というデータやブラウザをこえてデータを共有したいならバックエンドでやる必要があります。作業時間の記録をするなら、バックエンドでやるのが一般的ですが、その場合ログイン機能が必要でライブラリ使うにしてもけっこう難易度高いです。
バックエンドとフロントエンド、両方同時にやろうとすると混乱する可能性があるので、最初のうちは片方だけやる方が無難だと思います。その場合、フロントエンドの方が画面が動くのでモチベーション維持しやすいかもしれません。
返信ありがとうございます！
説明ありがとうございます。今想定している規模だったらjavascriptで実装する分で十分なんですね。理解が足りていませんでした。
まずはフロントエンドで実装して、場合によってJavaで拡張するようにしていきたいと思います。