[project-redisign-help-dialog] ヘルプ画面のナビゲーションバーのリデザイン

[takusea]

内容

ヘルプ画面のナビゲーションバーを新しいデザインのものに変更します。

スクリーンショット・動画など

[Hiroshiba]

LGTM！！

背景が半透明のすりガラス（グラスモーフィズム？）になっているの、おしゃれなのですが読んで欲しいテキストがある時はちょっと適さないかもと感じました！
内容が表示されているところは白背景になっていて文字は読みやすいのですが、それはそれで協調性がないと感じられなくもないなと。

がっつり読み物コンテンツのあるダイアログでの使用は難しいのかもと思いました。

[takusea]

背景が半透明のすりガラス（グラスモーフィズム？）になっているの、おしゃれなのですが読んで欲しいテキストがある時はちょっと適さないかもと感じました！ 内容が表示されているところは白背景になっていて文字は読みやすいのですが、それはそれで協調性がないと感じられなくもないなと。

がっつり読み物コンテンツのあるダイアログでの使用は難しいのかもと思いました。

裏が半分透けることでオーバーレイしている状態であることを示そうという思惑はありますが、確かに必須ではなく可読性優先するならなくしても良さそうです。

ただ、協調性や統一感という面では半透明をなくしても切り替えの際に緑背景（Background色）と白背景（Surface色）が交差してる時点で欠け気味な気がしてきました。

そこで、読み物系の白背景を全幅取らないようにするか、リスト系の箇所も白背景を入れる（又はサイドバーまで全面白）が対策として考えられそうです。

後者の場合、統一性のためツールバーのカスタマイズダイアログ等、似たレイアウトのデザインの背景色も白にすべきかと思います。

読み物系の白背景を全幅取らないようにする場合：

リスト系の箇所も白背景を入れる場合：

[Hiroshiba]

@takusea すみません遅くなりました！！（もっと素早くお答えできるように心がけたいと思います 🙇 ）
どちらもおしゃれで素敵ですね！！

個人的には読み物系が読み物らしくなっていて好きではあるのですが、後者の全白背景がものすごくしっくりきました！
白背景のリスト表示と以前のリスト表示を見比べると、（以前の）ドロワーとコンテンツの背景色が同じ場合、内容物の境界が若干わかりづらくなっていたかもと感じました。
加えてドロワー内のセルを選んだときの統一感が生まれているので、すごくしっくり来たんだと思います。

もしリストとかも白背景にする場合、結構変更量は大きくなりそうでしょうか･･･？ 🙇

[takusea]

もしリストとかも白背景にする場合、結構変更量は大きくなりそうでしょうか･･･？ 🙇

色変数のちょっとしたテコ入れと、ダークモード時の読み物系の箇所の背景色が暗くなるくらいで、そこまで大きくはないかと！
というのも、ダークモード時にクリック可能な要素を下地から浮いている＝背景より明るいという表現がしたいのと、リストコンポーネントの用途として中にコントロール要素が入ることがあり、2段階分明度が欲しいという考えです！

ボタンを入れてみての例はこんな感じです

背景現状、リスト要素現状

背景現状、リスト要素明るく

背景暗く、リスト要素現状

それに合わせた読み物系の背景色の変更

背景現状

背景暗く

[Hiroshiba]

@takusea なるほどです！
より暗くした背景色の黒さでも特に問題なさそうに感じました！！
比較図ありがとうございます！！