knocks-public / 2024-CircuitBreaker

MIT License
2 stars 0 forks source link

Update UI #33

Closed susumutomita closed 6 months ago

susumutomita commented 7 months ago

https://developer.apple.com/design/human-interface-guidelines Based on the guideline

susumutomita commented 7 months ago

https://amzn.asia/d/3npaTdl

sakuyacatcat commented 7 months ago

こういうのを実装できるUIコンポーネントがあると良いのかな

証明者モードのデザイン
- NFC読み取りUI: シンプルなボタンで「年齢情報読み取り」を開始する。読み取り中は進行状態を表示(例:プログレスバー)。
- 年齢条件の確認: 読み取った情報をもとに、年齢条件が満たされているかどうかを表示。条件を満たしている場合は、次のステップへのボタンを活性化。
- QRコード生成: 条件を満たしている場合、証明のQRコードを画面に表示。操作性を考慮し、画面の中央に大きく表示。

検証者モードのデザイン
- カメラの起動UI: 検証者モードでは、最初にカメラを起動するボタンを明確に表示。ボタンをタップするとカメラが起動。
- QRコード読み取り: カメラビュー内にQRコードを読み取る領域を示し、ユーザーがQRコードを簡単に位置合わせできるようにします。
- 検証結果の表示: QRコードの読み取り後、検証結果をわかりやすい形で表示。例えば、検証成功時は緑色のチェックマーク、失敗時は赤色の×マーク。
sakuyacatcat commented 6 months ago

This issue is completed in pull request (#54).