コンセプト:iOS 15のSafariを、同じコア設計原則と目標に基づいて再考c

コンセプト:iOS 15のSafariを、同じコア設計原則と目標に基づいて再考c
コンセプト:iOS 15のSafariを、同じコア設計原則と目標に基づいて再考c

iOS 15でAppleが発表したSafariの最新デザインは、控えめに言っても物議を醸しています。iPhoneで最も人気のあるアプリの一つを、全く異なるデザイン哲学に基づいて刷新したのです。私を含め、数え切れないほどの人が、新しいデザインを「修正」し、より使いやすく快適にする方法を模索してきました。これが私の最新の試みです。私が目指したのは、同じ原則を踏襲し、同じ目標を目指すことでした。片手で使いやすく、サイト間を瞬時に切り替えられるモバイルブラウザです。

まず根本的な問題から始めましょう。iOS 15のSafariの新しいURLバーはコンテンツの上に浮かび、スクロールすると消えてしまいます。特に、タブバーが下部にあるウェブサイトでは厄介な存在となっています。そのため、ベータ版の最後までこのフローティングURLバーが残れば、多くのユーザーに受け入れられないことは明らかです。Appleはベータ版ごとに継続的に改善を続けてきましたが、UI要素をただ追加しているだけのように感じます。

インスピレーションを得るために、マップアプリを参考にしました。AppleはiOS 10でマップを再設計し、必要なボタンやコントロールをすべて備えた、ドラッグ可能なモーダルビューを採用しました。地図を詳しく見たい時は非表示にでき、道順を調べたり興味のある場所を探したりしたい時は完全に展開できます。

サイトのデフォルトロゴ画像

このUI要素はウェブブラウザに最適です。以下は、Safariのドラッグ可能なモーダルビューのために私が考案した4つの段階です。タブが1つ開いている最短状態では、コア要素のみが表示されます。URLバー、リロードボタン、共有ボタン、新規タブボタン、タブ表示ボタンが表示されます。

サイトのデフォルトロゴ画像

複数のタブを開いている場合、URLバーの下でタブ間をフリックできます。別のタブをタップするだけで簡単に切り替えられるので、ジェスチャーがホームインジケーターに干渉することはありません。

タブ表示ボタンをタップするか、モーダルを上にドラッグし続けると、タブのプレビューが表示されます。新しいタブ表示と新しいスタートページを分離するのではなく、Appleはこれらを統合して単一のハブを作成することもできます。

サイトのデフォルトロゴ画像

モーダルを一番上までドラッグすると、AppleがSafariの新しいスタートページに組み込んだ新しいコンポーネントがすべて表示されます。また、ここではすべてのタブも確認できます。すべてのタブグループへのショートカットと、iCloudタブへのショートカットもあります。タブの下には、お気に入りと、すべてのブックマークと履歴にアクセスできるリンクがあります。その下に共有されたタブ、そしてその下にその他のタブがあります。

サイトのデフォルトロゴ画像

新しいSafariをテストしている人の多くは、新しいタブ表示を気に入っています。しかし、インターフェースの他の部分とは全く切り離されており、正直言って少し複雑です。開いているタブの切り替えは可能な限りシンプルにし、URLバーのすぐ下にビジュアルプレビューをリアルタイムで表示できるようにすれば、はるかに優れたエクスペリエンスを実現できるはずです。

サイトのデフォルトロゴ画像

もちろん、「すべてのタブ」ボタンをタップすれば、新しいグリッド表示が表示されます。これはSafariの再設計における最大のポイントですが、タブ表示の核となるべきではありません。Appleは新しいジェスチャーによるタブ切り替えを積極的に宣伝していましたが、ジェスチャー自体は、そのすぐ下にあるUI要素を再現しようとしています。

新しいデザインのもう一つの問題は、分かりやすくタップしやすい「戻る」と「進む」ボタンのためのスペースが不足していることです。このデザインにこれ​​らのボタンを配置するのは依然として困難ですが、もっと分かりやすい方法で実現できるはずです。設定でオプションとして配置できると良いと思います。「戻る」と「進む」のスワイプジェスチャーは非常に一般的で使いやすいです。これらのボタンは実際にはそこになくても構いません。しかし、もし必要なら、ここに配置した方が使い勝手が良いでしょう。

サイトのデフォルトロゴ画像

iOS 15の新しいSafariデザインについてどう思いますか?私たちが提案した変更は理にかなっていると思いますか?ぜひ下のコメント欄であなたのご意見をお聞かせください!

havebin.com を Google ニュース フィードに追加します。 

FTC: 収益を生み出す自動アフィリエイトリンクを使用しています。詳細はこちら。