このようなアプリを作らなくても、Shortcut appで同様の仕組みを構築できると思う

ただしグラフは自分で作る必要がある

Todo

Remixのチュートリアルをやる

デザインとアニメーションを無視して動くモックをつくる

データセーブはローカルストレージ

本の追加

タップでカウントアップ

長押しでカウントダウン

要件

スマホでワンボタンで売り上げ入力ができる

売り上げ冊数のカウンターが増える

時刻が記録できる

やり直しができる

手動で時刻入力もできる

複数の本が買われた時に素早く入力できる

本の情報が入力できる

後からイベント時のグラフが表示できる

累積売り上げグラフ

5分間平均部数記録

Webアプリでやりたい

よかったら誰でも使えるように公開したい

ググってでてきたアプリはそういうものはなかった

UI設計

考察

最も単純なUIを考える。本が買われたら買われたボタンを押すだけのもの

履歴が出てきて消せる

このUIの課題：本がたくさんある時に切り替えがめんどくさい

方法はいくつかある

簡単に切り替えるUIをつくる

最初から全てのUIを出す(切り替えなし)

素早い切り替えUIをどうすればいいだろうか？

左：ボタンを押したら画面下から本の表紙がいっぱい展開されて押すと切り替えられる方式

例：Hey

右：UI表示ボタンを押したらその周りに本が出てきて、そちらの方向に指を移動すると本が選択される

このUIの課題：3冊の本が買われた時にいちいち切り替えるのは面倒

そもそも切り替えないで画面上に表示させるUIにすることにする

Koala samplerのような感じで上にデータ表示をさせれば編集も画面繊維なくできるので良いだろう

削除は上の詳細画面でできればとりあえずいいだろう

（オプション）アニメーション設計

Riveを使うと動かせるらしい？

タップでカウントアップするときにこういう感じに楽しげ＆気持ちよくしたい

長押しする時に消えそうなアニメーションになってほしい

画面設計

フレームワーク選定

create-react-appを今更使うのもなんだかな、ということでRemix(FW)を使ってみることにした