Apple Engine

Apple, iPhone, iOS, その周辺のことについて

iPhone X のノッチはなぜ気にならないのか?

iPhone X は発表時にノッチが気になると言っていた人が多かったが、使った人の感想を見るとノッチが気にならないという人が多いようだ。

ノッチが気にならないよう工夫がされており、アプリ UI の設計側から見るとわりと明瞭である。

 

なぜ気にならないか

画像の灰色のエリアはセーフエリアと呼ばれており、ここにコンテンツを納めるように Apple の iOS Human Interface Guidelines に記載されている。

要するに灰色ではない白い部分はアプリにとってはレイアウト上の余白であり、アプリ側から見るとユーザーに注目してもらわなくてもよい部分である。

f:id:x67x6fx74x6f:20180306171032p:plain

 

Files(ファイル)アプリでは上のノッチは時計や電波、バッテリー残量などが表示されているステータスバーの領域の一部であり、タイトルの書かれているナビゲーションバーの一部となっている。
アプリ使用時ユーザーがステータスバーを注視することはあまりないだろう。

下部のホームインジケーターも下部のタブの余白という感じなっている。

f:id:x67x6fx74x6f:20180306171101p:plain

 

Human Interface Guidelines に記載されているわけではないが、個人的には UI は以下の画像のような感じだと思われる

  • 赤色は注意深見なくてもよい場所
  • 半透明の赤色はユーザーが現在のコンテンツから何かしたいときに操作する場所

f:id:x67x6fx74x6f:20180306171123p:plain

 

全画面表示の Apple 謹製アプリはどうなっているか

例えば、マップアプリだと上部には UIVisualEffect のブラーがかかっており、 ユーザーにステータスバーとして認識させるよう促している。

端末を傾けたランドスケープ状態ではステータスバーはなくなり、セーフエリア外は余白となっている。

f:id:x67x6fx74x6f:20180306171204p:plain

 

ノッチが気になる状態とは?

端末が縦状態のポートレートではあまり気になることはないが、ランドスケープでは気になることがある。

それは、2:1 の画像や動画を画面にフィットさせ全画面で表示した時。

f:id:x67x6fx74x6f:20180306171244p:plain

 

2:1 の比率の写真はパノラマや360度画像ぐらいしかないだろうし、動画を画面にフィットさせると端が切れるためユーザー体験が最良というわけでもない。

このシチュエーションに関してはあまり気にしなくても良いだろう。