続: 画面縮尺100%時の圧迫感について - Sushi Workフィードバック

はじめに

このフィードバックは、下記フィードバックの続きです。

フィードバック内容

返信ありがとうございます。縮尺について質問したものです。

参考までに、sushiworkの入口(entrance)と作業スペース(workspace)の、縮尺を変えたものをそれぞれuploadします(筆者注: アップロード画像のURLは省略)。どれがどれに対応するかは、画像の名前をみていただければわかるかと思います。

以下、個々に現状のどこに違和感を感じたかを書きます
(使ってないメールで新しくログインした際の感想です)
ただし、これは私の環境であり、他の方はそうでない可能性も強くあり、その場合は１参考までに聞いていただければ幸いです

・初めての入口(entrance)

縮尺100%の場合

縮尺50%の場合

1. 100%の場合、「SUSHI WORKを始める」のボタンがスクロールするまで見えない
　→多分、「SUSHI WORKを始める」ボタンは一番上に持ってきた方がいい

2. "タイマー終了を見逃さないために"や"タブ固定でタイマーの状態確認が簡単に"は、既に利用している向けであり、しかしこの画面に案内されるのは初見の人
　→聞く所によると、なるべくメインの画面までのクリック数は少ない方がいいので、この画面への遷移はなくして、"より良くsushiworkを使うには"みたいに独立したページにするといい？(ちょっとこれは適当です)　

・作業スペース(workspace)

縮尺100%の場合

縮尺50%の場合

　100%だと全部の状態が一度に見れない。また他の人の状態も一番下で追いにくい。
　50%にすると全体が一度に見渡せてストレスが少ない。ただしその反面、ボタンが小さくなる等のデメリットがある。

　総じて以下かと思います

　1. 他者の状態は遠くから見ても識別がつく(お茶やガリはちょっと見辛くなるが、それはあまり影響がない)ので小さくても良い (縮小しても意味がわかる)

　2. 他者の進捗の表示は、”他の人が今やっている感”を演出するのに重要なので、可能なら見せ他方がいい (私が縮小をしてる積極的な理由)

　3. 上記の結果、ボタンや時間が小さくなる

回答

再度のフィードバック&画像アップロード、ありがとうございます！一気に理解が深まりました。

Sushi Workのデザインは、レスポンシブデザインを採用しています。レスポンシブデザインとは、画面サイズに合わせて、画面の見栄えを切り替える仕組みです。試しにSushi Workを開いているブラウザを画面の左半分や4分の1に小さくしてみてください。画面サイズに応じて、レイアウトが切り替わる様子が分かると思います。

画面サイズが中くらいの場合に、投稿頂いた画面のようになります。その場合のデザインの詰めが甘かったです。

画面サイズが大きければ、縮尺100%でも、縮尺50%のような見栄えになります。私の環境では、そのようになっており気付きにくかったです。スクリンショットを投稿いただいて気付くことができました。ありがとうございます！

一時的な対応としては、ブラウザの縮尺を変更する以外にも、Macの「システム環境設定」→「ディスプレイ」から解像度を高くすれば、縮尺50%の場合に近くなるかもしれません。この方法だと、他も一緒に画面が細かくなってしまうので、現実的ではないかもしれませんが。。

問題は理解できたので、どこかのタイミングで修正します！少し時間がかかるかもなので、お手数おかけして申し訳ありませんが、それまで縮尺50%でご使用いただければ幸いです。

また、ユーザー登録後の案内画面(「初めての入口(entrance)」と記載いただいた画面)は、確かに内容的に登録直後になくても良さそうなので、これも修正を検討します！

2021/10/22 追記

改善しました！

2021/12/06 追記

さらに改善しました！