WWDC 2017 の SceneKit サンプル Fox 2 を調べる その2

Fox 2 のリソースファイル

前回書いたように Shared フォルダにリソースファイルが入っている。
以下、リソースの入っているフォルダの内訳

フォルダ	中身
Art.scnassets	シーンファイルとパーティクルシステム、画像ファイル
Assets.xcassets	各プラットフォームでのアイコン、AppleTV ホームで上の段画像
audio	音声ファイル
Overlays	画面全面に表示される UI の画像

画像と音声は、ファイルを見たり、オーディオを再生するとわかるので、Assets.xcassets、audio、Overlays については割愛。

Art.scnassets 内の構造

このプロジェクトのシーンに使用するリソース全てが Art.scnassets にある。

フォルダ/ファイル	説明
character	操作するキャラクター レッサーパンダの Max に関するリソース
enemy	敵キャラのリソース。使われていないものもある
particles	シーン内で使用するパーティクル
textures	シーンの背景で使用しているテクスチャ
collision.scn	キャラの障害物判定
level_scene.scn	背景シーン
scene.gks	新ファイルと GKComponent をつなぐためのバイナリのplist。シーンファイルで Components で設定した GKComponent のクラスを選択すると自動的に生成される
scene.scn	敵キャラと背景のシーン
tile.png	タイル画像。このプロジェクトファイルでは使用されていない

次回は character フォルダ の中身を見てゆく。

WWDC 2017 の SceneKit サンプル Fox 2 を調べる その1

Fox 2 とは？

WWDC 2017 SceneKit: What's New のプレゼンで発表されたデモ。

以下の動画の1分40秒から4分あたりをご覧いただきたい。

developer.apple.com

アプリ流れ

レーサーパンダの Max を操作して、宝石手に入れる。
宝石を取得すると鍵が出現。
その鍵を入手し、奥の小屋の鍵を開け仲間を助け出すという流れ。

このサンプルを調べる意味

このサンプルは SceneKit の機能のショーケースとなっている。
そのため、このプロジェクトファイルを理解するということは SceneKit の新機能を理解する近道になると思われる。

Fox 2 の動作環境

現状 Version 1.3　の 2018-04-05 版では、 iOS 11, tvOS 11, macOS 10.13 となっており、Xcode 9 が必要となる。

また、Metal の機能を多様しているため、iOS 11, tvOS 11 のシミュレータはサポート対象外となっており、実機を使うべし。

Fox 2 のサンプルで使用されている機能/技術

• カメラへのコンストレイント適応してアプリやゲームでのカメラの振る舞いを設定する
• 新しい物理ベースの被写界深度で実現したカメラレンズのボケの効果
• スクリーンスペース GPU テッセレーション（Pixar の openSubdiv を使用）
• 新しいアニメーションエンジンや API を使用した段階的に設定できるキャラクターアニメーション
• カスケードシャドーマップ
• GameplayKit との統合（主に Xcode の Scene Editor）

はじめに

以下のページの右上の「Download Sample Code」ボタンを押しファイルをダウンロードする。

developer.apple.com

zip ファイルが解凍されると、Assets、Objective-C、Swift のフォルダがある。
今回は Swift で解説してゆくので Swift フォルダの xcodeproj を開く。

（ちなみに、今回のバージョンの Swift の Mac 版はエラーが出る可能性があり、動作しない場合は Objective-C の方を動かす）

Fox 2 プロジェクトファイルを見て見る

中身は以下のよう

フォルダ/ファイル	説明
README.md	Markdown で書かれた Fox 2 の概要
Shared フォルダ	各プラットフォームで使用する画像、音、シーンファイル、UI 用リソース、swift ファイルがある
iOS フォルダ	iOS で使用するファイル。iOS のみヴァーチャルゲームパッドの設定がある
macOS フォルダ	Mac で使用するファイル。
tvOS フォルダ	Apple TV で使用するファイル
Products フォルダ	.app ファイルが参照される
Frameworks フォルダ	SceneKit と GameplayKit が置かれる

プロジェクトファイルは Shared フォルダに共有できるデータがあり、
各プラットフォームごとに必要なファイルである AppDelegate や起点となる GameViewController、SCNView を表示するだけの Storyboard、アプリの設定を決める info.plist が設定されている。
上の表のように iOS だけヴァーチャルゲームパッドを設定するようになっている。

また、GameplayKit での Entitiy Component System や、2次元座標でターゲットを追いかける GKAgent2D が使用されている。

ちなみに、このサンプルでは Metal のシェーダーは書かれておらず、すべて Scene Editor 上の Shader Modifiers でマテリアルの操作が行われている。

次回以降、画像やシーンファイルなどのリソースを調べる。

iOS 11.4 で追加される ClassKit とは何か

ClassKit フレームワークは、
先の教育向けイベントで発表された Schoolwork というアプリと連携するためのフレームワークで、既存のアプリへ何らかの機能を付け加えるものではない模様。
Classroom は生徒や生徒の端末、生徒のコンテンツの管理、教師と生徒のやりとりを行なっていたが、Schoolwork は生徒へアプリを操作してを行う課題の作成、提供、進捗管理となっている。

ちなみに、翻訳的に面倒なので以降アクティビティと書いているものは、生徒が取り組む課題と同じ意味合いとしている。

ClassKit 開発者ドキュメンの最初にはこう書かれている。
「教師はあなたのアプリで割り当てられたアクティビティを元に生徒の進捗状況を表示できるようにする」

と書かれてもよくわからなので、
Apple のページ、下の方にある Schoolwork の「教育アプリケーションの力を取り入れよう。」見てみると振る舞いはわかると思う。

www.apple.com

• 教師側が課題を設定
• 課題が使用できるアプリリストからアプリを選択
• アプリで生徒に作業してほしいアクティビティをリストから選択
• 完了の日付などと共に設定が完了したら配布資料を送る

という流れで課題を設定し、Schoolwork アプリでは各生徒の進捗状況を確認できるようになっている。

以下、ドキュメンを意訳

ClassKit フレームワークの概要

https://developer.apple.com/documentation/classkit

教育用のアプリは、本やビデオなどのリソースにアクセスし、インタラクティブな視覚化、ゲーム、評価を通じて学習を促し、
ClassKit は教材を整理する方法を提供し、教師が生徒へ課題を割り当てたり進捗状況を確認することができる。

ClassKit 環境は、教師のデバイスと、iCloud を介して接続する多くの生徒のデバイスで構成されており、各デバイスは、Apple の Schoolwork アプリを通してアプリ開発者作成したアプリを実行する。
そのため ClassKit は、デバイス間のハブとして機能している。

Schoolwork アプリを使用して、教師は開発者のアプリで ClassKit から公開する割り当て可能なコンテンツを見ることができ、その内容に基づいて課題を作成し、すべての生徒の進捗状況を確認することができる。
一方、学生は、Schoolwork を使用して、アプリ内のコンテンツに直接リンクされた課題に取り組むことができる。

ClassKit は、アプリの既存のロジックやメカニズムを置き換えるものではなく、新しいユーザーインターフェイスを生成するためにも使用しない。
代わりに、ClassKit を使用して既存の構造を公開して、教師が Apple の Schoolwork アプリを使用してアプリのコンテンツに基づいて課題を作成し、
その課題応じた学生の進歩を確認できるようになっている。

ClassKit は、「Apple School Manager and Managed Apple IDs」を使用している教育機関で使用するように設計されており、 教育市場が目的のアプリである場合は、ClassKit を採用することを検討すべし。
とのこと。

ClassKit と ユーザロール について

https://developer.apple.com/documentation/classkit/about_classkit_and_user_roles

ClassKit がさまざまな種類のユーザーとどのようにやり取りするかを理解する。

概要

ClassKit を使用すると、開発者のアプリが教育エコシステムに参加できるようになり、教師が課題を作成し、生徒が進捗状況を報告することができる。

ユーザーは、Managed Apple IDs（MAID）でアプリを実行している端末にログインすることで、このエコシステムに参加することができる。
これは、Apple School Manager に登録されている学校によってユーザーに提供される特別な Apple ID で、その所有者を教師または生徒として識別され、 standard Apple ID（通常の Apple ID）を使用しているユーザーは、このエコシステムに参加することができない。

これによって開発者のアプリは、学生、教師、および管理されていないユーザーの3つの異なるクラスのユーザーが作成され、
ClassKit は、現在のユーザロールに応じて動作を変更する。

ClassKit は開発者のアプリとユーザロールを共有しない

ClassKit はアプリでユーザロールを共有せず、提供するデータの一部は、ユーザーロールごとの固有のものとなる。
たとえば、教師だけがすべての可能な割り当ての完全な状態を格納する必要があり、生徒は割り当てを移動して進行状況を記録する必要があり、MAID ではないのユーザーは、すべてのデータを記録する必要はない。

プライバシーを確保するために、ClassKit は現在のユーザロールを共有していない。
現在のユーザーが MAID を持っている場合でも、デリゲートのコールバックやエラーメッセージを含むすべての ClassKit インタラクションはユーザロールに関係なく同じように見える。

また、任意のユーザーに対して機能する1つの実装を構築こともでき、
ClassKit は、必要のないデータを効率的に無視をする。

ClassKitは、進歩状況を他者に観測されていることを警告する

生徒がアプリを実行すると、ClassKit は生徒に代わって、 生徒にコンテンツにメッセージを簡単に表示して教師と進行状況を共有すると通知をする。

以下、GreatPlays というアプリを使って Dev クラスというクラスの生徒の場合：

"Great Playsでの割り当てられたアクティビティの進捗状況は、次のクラスの教師と共有されます：Devクラス"

ClassKit を採用しているアプリの進捗を記録するときに表示される Student Progress オーバーレイのスクリーンショット。

このようなメッセージが表示されるがアプリでは特別な操作を行う必要はなく、 メッセージに示されているように、ClassKit は教師によって明示的に割り当てられたタスクについてのみ進捗を保持する。 学生の場合でも、ClassKit は明示的に要求されていない使用データは破棄される。

ClassKit は、記録しようとしたすべての進捗データを破棄するため、他のユーザー（教師と管理アカウントのないユーザー）はこの警告を受け取ることはない。

ひとまずまとめ

実装の方はあまり需要はなさそうなので割愛。
雑に説明すると、進捗が進んだらその情報を iCloud にデータを送る機能をアプリに実装するだけ。
なので、ClassKit はそんなに機能があるわけではないので、あまり難しくなく実装はできると思われる。

海外向けの教育アプリでは ClassKit の実装を行なっても良いのではというところ。

指定した場所にジオメトリを複製する SCNReplicatorNode をつくってみた in SceneKit

画像は球状にスペースシップを複製し配置したもの（ReplicatorSample3）

ジオメトリを位置情報の配列をもとに複製したり、法線情報の配列から回転させるやつで 3DCG や動画編集などであるリプリケーター。
また、複製したジオメトリに対して SCNAction 設定を一括で設定することもできる。

github.com

作成した Swift File

SCNGeometory+Vertices.swift

SCNGeometory を extension で拡張して
vertices() でジオメトリの頂点情報を SCNVector3 の配列で返し、
normals() でジオメトリの頂点情報を SCNVector3 の配列で返す。

SCNReplicatorNode.swift

位置情報の配列を元に、複製したジオメトリを配置する SCNReplicatorNode と、 テスト用に作った、線、立方体、円で位置情報の配列を返す SCNPositionVectors が含まれている。

SCNReplicatorNode では「SCNVector3 を位置情報とした配列」と「複製するジオメトリ」が最低限必要となる。

SCNReplicatorNode

SCNReplicatorNode(
    geometry: SCNGeometry, 　  // 複製するジオメトリ
    positions:[SCNVector3],    // 複製する位置情報
    normals:[SCNVector3], // 位置に対しての法線情報
    upVector:SCNVector3, // 基準のなる上方向のベクトルを決める。デフォルト値: SCNVector3(0,1,0)
    localFrontVector:SCNVector3 // 複製するジオメトリの正面方向の軸を決める。デフォルト値: SCNVector3(0,0,1)
)

normals、upVector、localFrontVector は省略可能。 upVector、localFrontVector は SCNNode の look(at:up:localFront:) の up と localFront にあたり、デフォルトでは +Z 軸方向が正面となる。

サンプル内容

ReplicatorSample1

// 複製する球のジオメトリ
let sphereGeometry = SCNSphere(radius: 0.1)
sphereGeometry.segmentCount = 8

// SCNReplicatorNode を使用して球を配置する
let replicatorNode = SCNReplicatorNode(
    geometry: sphereGeometry,
    positions: SCNPositionVectors.box(widthCount: 9, heightCount: 4, lengthCount: 9, margin: 1)
)

// SCNReplicatorNode のノードをシーンに追加する
scene.rootNode.addChildNode(replicatorNode)

SCNSphere で球のジオメトリで作成し、
SCNPositionVectors.box で、横 9 個、高さ 4 個、奥行き 9 個、間隔 1 毎に離れた立方体の位置情報に配置する。

ReplicatorSample2

// 複製する球のジオメトリ
let sphereGeometry = SCNSphere(radius: 0.01)
sphereGeometry.segmentCount = 8

// SCNReplicatorNode を使用して球を配置する
let replicatorNode = SCNReplicatorNode(
    geometry: sphereGeometry,
    positions: SCNPositionVectors.circle(divide: 120, radius: 4)
)

// SCNReplicatorNode から SCNAction を設定する
replicatorNode.replicatorAction(
    SCNAction.repeatForever(
        SCNAction.sequence([
            .scale(to: 12, duration: 6),
            .scale(to: 1, duration: 6)
        ])
    ),
    delay: 0.1
)

// SCNReplicatorNode のノードをシーンに追加する
scene.rootNode.addChildNode(replicatorNode)

SCNSphere で球のジオメトリで作成し、
SCNPositionVectors.circle で円状に 120 個の位置を設定し先ほどの球を配置。
SCNReplicatorNode の replicatorAction 関数で SCNAction を設定すると各ノードにアクションが設定される。 replicatorAction の delay は各ノードのアクション開始までの待ち時間。

ReplicatorSample3

// 複製する位置情報を球のジオメトリ
let sphereGeometry = SCNSphere(radius: 4)
sphereGeometry.segmentCount = 16
// copy() 関数を使用する。これを使わないと設定変更した値が反映されない。
let deformedShpere:SCNGeometry = sphereGeometry.copy() as! SCNGeometry 

// シーン（ship.scn）から複製するスペースシップのジオメトリノードを取得
let shipMesh = scene.rootNode.childNode(withName: "shipMesh", recursively: true)!

// SCNReplicatorNode を使用して球の位置にスペースシップを配置する
let replicatorNode = SCNReplicatorNode(
    geometry: shipMesh.geometry!,
    positions: deformedShpere.vertices(),
    normals: deformedShpere.normals()
)

// スペースシップのスケールが大きいので変更する
replicatorNode.geometryScale(0.02,0.02,0.02)

// SCNReplicatorNode のノードをシーンに追加する
scene.rootNode.addChildNode(replicatorNode)

ビルトインジオメトリの SCNSphere の頂点情報を取得し、スペースシップの配置。
SCNSphere の頂点法線方向にスペースシップを正面に向かせたいため、 SCNReplicatorNode で SCNSphere の法線情報設定している。
また、ビルトインジオメトリに関しては copy() を使用しないと設定変更した形状が返らずデフォルトの値を返すので注意。

ReplicatorSample4

複製する位置の法線情報が設定されているが、ジオメトリ単位で変えたい場合

// シーン（ship.scn）から複製するスペースシップのジオメトリノードを取得
let shipMesh = scene.rootNode.childNode(withName: "shipMesh", recursively: true)!


// 複製する位置を設定
let refPositions = [
    SCNVector3(-3, 0, 0),
    SCNVector3(-1, 0, 0),
    SCNVector3( 1, 0, 0),
    SCNVector3( 3, 0, 0),
]

// 複製する際の法線情報を +Z 軸で設定
let refNormals = [
    SCNVector3( 0, 0, 1),
    SCNVector3( 0, 0, 1),
    SCNVector3( 0, 0, 1),
    SCNVector3( 0, 0, 1),
]

// SCNReplicatorNode を使用してスペースシップを配置する
let replicatorNode = SCNReplicatorNode(
    geometry: shipMesh.geometry!,
    positions: refPositions,
    normals: refNormals,
    upVector: SCNVector3(0, 0, 1),
    localFrontVector: SCNVector3(0, 1, 0)
)

// スペースシップのスケールが大きいので変更する
replicatorNode.geometryScale(0.03,0.03,0.03)

// SCNReplicatorNode のノードをシーンに追加する
scene.rootNode.addChildNode(replicatorNode)

通常なら +Z 軸方向にスペースシップが並んでしまうが、
upVector と localFrontVector を変更することで向きを変えることができる。

画像ではジオメトリの +Y 軸方向が正面として変更されている。

ReplicatorSample5

スペースシップのジオメトリの頂点情報へスペースシップを貼り付けただけのもの

// シーン（ship.scn）から複製するスペースシップのジオメトリノードを取得
let shipMesh = scene.rootNode.childNode(withName: "shipMesh", recursively: true)!

// SCNReplicatorNode を使用してスペースシップを配置する
let replicatorNode = SCNReplicatorNode(
    geometry: shipMesh.geometry!,
    positions: shipMesh.geometry!.vertices(),
    normals: shipMesh.geometry!.normals()
)

// スペースシップのスケールが大きいので変更する
replicatorNode.geometryScale(0.02,0.02,0.02)
replicatorNode.scale = SCNVector3(0.2, 0.2, 0.2)

// add replicator node in rootNode
scene.rootNode.addChildNode(replicatorNode)

まとめ

SceneKit の機能に、ジオメトリを簡単に複製させて配置させるものがないのでつくってみた。
けど、かなりの力技。
SCNReplicatorNode はただ addChildNode しているだけなので childNodes で調べていけば複製したものの設定は全て変えられるはず。

Mac の CPU、早ければ 2020 年から Intel から自社製になるという噂

Bloomberg 曰く、Mac の CPU、早ければ 2020 年から Intel から自社製になるという話。

”この計画はまだ初期段階だが、Mac や iPhone、iPad を含むアップルの機器全てをより同調させ、切れ目なく動作させることを狙った戦略の一環となる" とのこと。

www.bloomberg.co.jp

これが本当なら Apple A チップを使うのだろうと思われ、
現状 A11 Bionic はモバイル向け Intel Core i5 を超えている状態であり、
多分、今年出ると思われる A11X Bionic や A12 はモバイル版の Core i7 を超える可能性はある。
また、グラフィックを司る GPU も A11 Bionic で自社製になったので今後の進化も期待したい。

処理速度、チップのコスト、物理的な省スペース化、低電力によるバッテリーの持ち、自社開発による OS との統合強化など、
利点が多いのため実際に自社製になるだろうと予想している。

ただ、現行の Intel チップでの業務用アプリがあるので、ユーザー側は簡単には移行できない可能性があり、昔あった Rosetta のように Intel x86 コードを Apple A チップ 用に変換する形になったら面白そう。

ひとまず、ここら辺を OS 上でどう対応してくるのか期待している。

余談

もし、自社製になるのなら、Apple の製品リリースを考えると Intel 製の iMac Pro や今年出る Mac Pro はこれが最後になる可能性もある。
プロ向けは Intel Xeon を使い続ける可能性があるのでどうかわからないが。

新しい iPad 9.7 (6th) のスペックはどのようなものか

2019年3月18日に iPad Air / iPad mini が発表され、
iPad 9.7 (6th) と価格差が少なくスペックがかなり高くなってしまいました。
以下の記事参照。

appleengine.hatenablog.com

Apple A10 Fusion ということなので、iPhone 7 / 7 Plus 同じもので 2つの高性能コアと2つの高効率コアが載っていると考えられる。

Geekbench 4 を見てみると iPhone 7 は
シングルコアで 3387 ぐらいで、
マルチコアで 5694 ぐらい。　

Macお宝鑑定団 blog の DANBO さんの実機検証でも同等な模様。

www.macotakara.jp www.macotakara.jp

最近の Apple A チップでまとめてみた

iPad 9.7 (6th) の統計が出ていないので、 以下、iPhone 7 で比較してみる。

チップ名	Single	Multi	Metal
Apple A11 Bionic (iPhone X)	4205	10120	15241
Apple A10X Fusion (iPad Pro 10.5)	3908	9304	29103
Apple A10 Fusion (iPhone 7)	3387	5694	12657
Apple A9X (iPad Pro 9.7)	2967	4951	15630

1世代目の iPad Pro より CPU 性能が高い状態になっている。 Metal の性能に関しては A10X など X がつくものは GPU の数が違うため数値が上回っている。

Android 端末との比較

チップ名	Single	Multi
Samsung Exynos 8895 Octa (Galaxy Note 8)	1961	6478
Qualcomm Snapdragon 835 (Google Pixel 2 XL)	1867	6217
Apple A10 Fusion (iPhone 7)	3387	5694
Samsung Exynos 8890 (Galaxy S7)	1550	5349
Qualcomm Snapdragon 821 (Google Pixel XL)	1625	4082

シングルコアでは圧勝。
マルチコアでは Exynos 8890 が 1.13 倍、Snapdragon 835 が約 1.09 倍と、去年出たハイエンドの Android 端末のスペックに近い状態となっている。

今年発売される端末の Snapdragon 845 でも Single Core では 3000 に届かず、Multi Core も A11 Bionic よりも劣るので、1年半ぐらいに廉価版 iPad を出す戦略は続くのではないかと思われる。

iPad 9.7 (6th) と iPad Pro 10.5 との比較

ディスプレイ

10.5 にあるもの

• 画面解像度
• 液晶面ディスプレイガラスの隙間減らすフルラミネーション
• 画面描画速度を最大 120 FPS 変更できる ProMotion
• 反射防止加工、TrueTone

フルラミネーション、ProMotion は共にプロ向きのペンの操作向け。
フルラミネーションは見た目にも変化はあるが、
そこら辺が気にならなければ Pro でなくても良いだろう。

また、ProMotion は現状ゲームや動画などでは機能があまり発揮できない。

反射防止加工や TrueTone などもあるが、
反射防止加工は室内のみで使うケースや TrueTone を切っている人もいるのでこれらは使用用途によるだろう。

カメラ

10.5 の場合、
本体外向きの iSight カメラは 4K(30fps)。
画面側の FaceTime カメラは 1080p となっている。

共に画素数が上がり、iSight の F値が 1.8、動画での手ブレ補正、オートフォーカスなどが強化されている。

iPhone での撮影の方が楽なため、使用頻度によるところ。

価格（税別）

ストレージ容量	9.7 WiFi	9.7 セルラー	10.5 WiFi	10.5 セルラー
32 GB	37,800	52,800
64 GB			69,800	84,800
128 GB	48,800	63,800
256 GB			86,800	101,800
512 GB			108,800	123,800

9.7	10.5	価格差	倍率
32GB	64GB	+32.000	約 1.84
32GB	256GB	+49,000	約 2.30
128GB	64GB	+21,000	約 1.43
128GB	256GB	+38,000	約 1.78

今年新しい Pro が出ると思われるので、今 Pro を無理して買うべきではないが、用途と予算によるのでなんとも言えない。

少なくとも絵を描くなどペンで行う作業を中心と考えるなら、Pro を買うべきだとは思っている。

まとめ

タブレットを使いたいが、ペンの機能は最低限で、機能や価格的に2世代目の iPad Pro まではいらない人向けだと思われる。

タブレット市場が冷え込んでおり、Android のタブレットで同じぐらいのスペックのものがないので、こちらを選ぶか、お金を出して Windows の 2in1 を選ぶことになるだろう。

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

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

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

なぜ気にならないか

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

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

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

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

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

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

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

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

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

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

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

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

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

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