commew / timelogger-web

時間記録アプリ
https://timmew.commew.net
MIT License
2 stars 0 forks source link

タスクの計測に最低限必要なAPIの設定を行う #52

Closed keitakn closed 1 year ago

keitakn commented 1 year ago

完了の定義

補足情報

タスクの更新と削除はおそらく初期リリースに含める事は難しいのでAPI設計は後回しにする。

keitakn commented 1 year ago

@y-uchiida

以下の動作を行った時の挙動について質問です。

  1. PCのGoogleChromeでログイン、任意のタスクの計測を開始
  2. タスクの停止をしないでブラウザを閉じる
  3. エンドユーザーとしては同じアカウントで再度ログインした時に 1 の内容が残っていて欲しい

これの対処法としては以下の案があります。

  1. navigator.sendBeacon() を利用してブラウザが閉じられる前にAPIにタスクの状態を保存する
  2. ブラウザを閉じる時に警告用のモーダルを出して「停止」または「終了」する事を促す

1 は確実性に欠けるのもあり、2が無難かと思いますがいかがでしょうか?

もし 2 の案で行く場合はFigma上にモーダルの作成をお願い出来ればと思います。

y-uchiida commented 1 year ago

@keitakn ご確認いただきありがとうございます。 あすデザイナーチームとミーティングするので、その際に対応を決めます。 少々お待ちください!

y-uchiida commented 1 year ago

@keitakn お待たせしております。 デザイナーチームで話をしまして、

エンドユーザーとしては同じアカウントで再度ログインした際に1の内容が残っていて欲しい

という点について合意しました。 実装方法についてはお任せしますが、ブラウザが開いているかどうかにかかわらず、ユーザーによって停止されるまではタイマーを動かし続けていただきたいです。

また、ブラウザを閉じる際に計測中のタイマーがあった場合、「このまま閉じるとタイマーが動き続ける」ということを通知するモーダルを出す方がいいのでは、という意見が出ました。 そのモーダルは、おって作成します。 見映え自体は、タスクの削除時などと同じようにシンプルなものになる予定です。

以上、取り急ぎご連絡です。

keitakn commented 1 year ago

@y-uchiida

実装方法についてはお任せしますが、ブラウザが開いているかどうかにかかわらず、ユーザーによって停止されるまではタイマーを動かし続けていただきたいです。

了解です。2点質問があります。

  1. エンドユーザーが前回と違うブラウザで利用した場合の挙動について

localStorageやCookieなどに開始時刻を保存すれば実現可能だとは思います。

ただこの方法だとエンドユーザーは前回開いたブラウザと同じブラウザを開く必要があります。

最初はSafariを使っていたけどChromeでログインした時にも計測時間の引き継ぎを行う場合はサーバー側にデータを保存するしかないのでAPIの実装が必要になります、その分完成が遅くなりますがこちらの仕様はどうしますか?

  1. ブラウザを閉じる際のモーダルについて

また、ブラウザを閉じる際に計測中のタイマーがあった場合、「このまま閉じるとタイマーが動き続ける」ということを通知するモーダルを出す方がいいのでは、という意見が出ました。

個人的な意見ですが、この文言だと特にエンドユーザーに対してモーダルを出す必要性はないかなと思いました。というのもネイティブアプリなどであればバックグラウンドでアプリが起動し続けるので、エンドユーザーのスマホのコンピューターリソースを消費する事になるので、エンドユーザーに警告を出すのも分かるのですが、ブラウザの場合バックグラウンドで動作させる事は出来ないので1に書いた通り開始時刻を保存しておいて再度訪れた際に経過時間を計算して再開という形になるのでバックグラウンドで動作し続ける挙動にはならないからです。いかがでしょうか?

ちなみに参考にしているaTimeLoggerでも特に警告メッセージは確認出来ませんでした。

どうせモーダルを出すのであれば、モーダル内に「記録中のタスクを一時停止して終了」のような文言のボタンを設置してそれを押下したらAPIにデータを保存して閉じる、とかであれば意味ありそうな気がします。

一応以下のAPIを使えば実現出来そうですが、これは結構不安定な挙動でAPI通信に失敗した際に記録に失敗してしまう可能性があります。

https://developer.mozilla.org/en-US/docs/Web/API/Beacon_API

  1. エンドユーザーが前回と違うブラウザで利用した場合の挙動について

こちらの仕様の返答次第ですが、動きっぱなしのタイマーの引き継ぎは同じブラウザに限定という仕様であればlocalStorageなどの同期APIを使えるので動作は安定するかなと思います。

y-uchiida commented 1 year ago

@keitakn

  1. エンドユーザーが前回と違うブラウザで利用した場合の挙動について 工期が大きく伸びそうであれば、同一ブラウザのみの対応で構いません。
    優先度は下げていただいてよいです。

  2. ブラウザを閉じる際のモーダルについて
    リソース消費の問題ではなく、ユーザーの期待に沿うかどうかの観点で話をしました。
    計測中のタイマーを残してブラウザを閉じたときに、そのタイマーがどうなるか?という点について、一般のユーザーの間で共通認識が得られるほど標準化した動作ではないと考えたためです。
    タイマーが止まることを期待するユーザーもいれば、動き続けることを期待するユーザーもいると思われたので、挙動を明示したほうがよいのではないかという話になりました。
    とはいえ、わざわざタスクを増やすほど重要なことではないので、モーダル無しでも構いません。

keitakn commented 1 year ago

@y-uchiida

工期が大きく伸びそうであれば、同一ブラウザのみの対応で構いません。

工数はそれほど変わらないとは思いますが https://developer.mozilla.org/en-US/docs/Web/API/Beacon_API のAPIを利用した実装になるので不安定な動作にはなると思います、なので一旦は同一ブラウザのみの対応で進めさせて頂きます。(これであればlocalStorageなどを利用する事で安定した動作が実現出来るので)

タイマーが止まることを期待するユーザーもいれば、動き続けることを期待するユーザーもいると思われたので、挙動を明示したほうがよいのではないかという話になりました。

なるほどです。

とはいえ、わざわざタスクを増やすほど重要なことではないので、モーダル無しでも構いません。

限られた時間での開発になるので、可能であればこちらは後回しにさせて頂ければと思います。

HAYASHI-Masayuki commented 1 year ago

@keitakn 間違っていたらごめんなさい。これって、タスクの開始時点ではサーバ側に状態を保存しない前提ですか? タスク開始時点でサーバ側に記録していれば、ブラウザを閉じてほかの環境からログインして計測状態を確認することになにも問題はないと思ったので。

keitakn commented 1 year ago

@HAYASHI-Masayuki

タスクの開始時点ではサーバ側に状態を保存しない前提ですか?

こちらは開始時点で保存する想定でした、そうか、ここで測定開始日時を渡せば特に問題なく戻ってきた時に再計算出来ますね!なのでAPIの設計でどうにでもなりそうな気がしました!

ありがとうございます!

localStorageやCookieなどに開始時刻を保存すれば

なのでこの辺も不要ですね。

stkzk3110 commented 1 year ago

@y-uchiida

初期状態の実行タスクない状態でタスクを計測したい場合、どういう導線で計測開始できる感じになりますかね? Figma上にそれっぽいUIがなかったため、確認させてもらってます🙏

スクリーンショット 2023-05-02 21 36 13
keitakn commented 1 year ago

@stkzk3110

横から失礼します、おそらくですが https://github.com/commew/timelogger-web/pull/66 で実装されたホバー付きのカテゴリButtonを押下するとかですかね:eyes:?

stkzk3110 commented 1 year ago

@keitakn @y-uchiida

なるほど! ここの矢印のボタン押したら裏でAPIが叩かれてタスク登録されるみたいな感じなんですかね🤔

スクリーンショット 2023-05-03 8 59 31

よくみたらkuniyukiさんの方でissueあげてくれてたのでその認識であってそうです! https://github.com/commew/timelogger-web/issues/47

ここにまとめてくださったイメージをベースに会話すると例えば会議というカテゴリの時間を複数タスクとして記録できるようになるみたいなイメージであってますよね? このカテゴリの矢印のボタンを押したらタスク登録されて、再度同じく別のタスクとして記録したい場合にタスクホバーから同じ矢印のボタンを押すみたいな使い方ってことですよね🤔 https://github.com/commew/timelogger-web/issues/49#issuecomment-1509852834

stkzk3110 commented 1 year ago

📝 タスク計測開始時に叩くAPI

タスク計測停止時に叩くAPI

タスク終了時に叩くAPI

y-uchiida commented 1 year ago

あ、解決してましたね...ご認識の通りでよいです! 左メニューのカテゴリ一覧にマウスホバーすると計測開始ボタンが出てきて、それをクリックすることで当該カテゴリでの計測が開始される想定です🙇

同じタスクカテゴリのものを、別のタスクとして計測したい場合は、もう一度左メニューのカテゴリ一覧から計測開始ボタンをクリックしていただきます。

以上、お知りおきください!

stkzk3110 commented 1 year ago

完了したのでクローズします。