iOS 7 ベータ版のユーザー インターフェイスの刷新は、過去の美学からの顕著な逸脱であり、かなりの報道を集めていますが、システム アニメーションの完全な再構築も、ほとんど注目されていないにもかかわらず、同様に影響力があります。

Jony Ive の「フラット」アイコンや Helvetica Neue Ultra Thin フォントの多用など、人目を引く静的なデザインの選択が iOS 7 について最初に気づくかもしれませんが、Apple の最新 OS を美しくしているのは目に見えないものです。

アニメーションは、デザイナーが優れたユーザー エクスペリエンスを作成するために使用する、シンプルですが必要なツールです。たとえば、iOS のラバーバンディング機能 - 最近ニュースでApple が Samsung に対して現在進行中の特許紛争の一環として、2007 年に初代 iPhone が登場して以来、このオペレーティング システムの重要な資産となってきました。

このアニメーションは一見軽微で、スクロール可能なページの終わりに到達するとわずかに戻る様子を示していますが、アニメーションがなければ、ユーザーはドキュメントをナビゲートするときにシステムからのフィードバックを得ることができません。これは、OS の応答性を大きく物語っています。

その他のシステム アニメーションは、アプリ固有のものであるか、ホーム画面からアプリを編集および削除するための「ジグル モード」など、表示されることを目的としています。

iOS 7 ベータ版では、新しくて興味深いアニメーションの調整が多数追加されています。明らかなものもありますが、多くは非常に微妙なのでユーザーには決して気づかれないかもしれません。以下の例は、OS が提供する機能のサンプルにすぎません。

ロック画面

ロック画面を始めとして、すでに存在しない「スライドしてロックを解除」バーを含む、多数の変更された要素があります。 iPhone のロックを解除するにはユーザーは依然として「スライド」または右にスワイプする必要がありますが、アニメーションは小さなスライダーだけでなく画面のレイヤー全体を動かすように変更されました。 iPhone が起動すると、ロック画面も黒からフェードインします。これは良い感じです。

iPhone のロックを解除するときに、ロック画面が単一のスライダーではなくパネルとして移動するようになりました。

システム設定オプションとしてロック画面からアクセスできるようになった通知センターは、iOS 6 のときと同じように下にスライドします。ただし、表示される半透明のパネルには物理的な追加があり、画面の下部に「ドスン」と音がします。落下から跳ね返るかのように画面が跳ね返ります。

この動きは、通常のラバーバンドによるバウンスバックほど「弾力性」はありませんが、大きさは同様で、ゆっくりとしたスワイプよりも高速なプルダウンの方がより大きなバウンスが得られます。この特定のアニメーションは、以前の iOS バージョンとはまったく異なる「感触」を提供します。バウンスの物理的性質はより硬く、重量感と構造の感覚をパネルに伝えます。

画面の反対側から上にスワイプすると、新しいコントロール センターが表示され、ウィンドウが時計のすぐ下まで滑ってから、非常に「ゴムバンドのような」動きでわずかに後退します。このパネルも OS のどこからでもアクセスでき、動きの大きさに依存しません。つまり、スワイプの速さや遅さに関係なく、同じ程度で跳ね返されます。

コントロール センターの上部と通知センターの下部に、小さなアニメーション ラインがあります。各パネルが停止しているとき、線は窓が開いているか閉じているかに応じて上または下を指す山形の形状になります。パネルが動くと直線になります。

たとえば、ロック画面では、画面の上部と下部に 2 つの山形が表示され、プルダウンまたはアップにスワイプして通知センターまたはコントロール センターを開くようにユーザーを促します。デバイスのロックが解除されると、山形がディスプレイの端に隠れます。

左から: 半透明の通知センター パネル、動作中のコントロール センター ペイン、アップのコントロール センター ペイン。

ホーム画面

ホーム画面ビューに入ると、ユーザーは別の劇的なアニメーションに遭遇します。アプリのアイコンがディスプレイの上から配置されたように見え、ドックが画面の下から上に滑っていきます。 iOS 6 では、アイコンがより 2 次元的に画面の端から急降下します。

クリックするとGIFが表示されます。

iOS 7 が WWDC 2013 でデモされたとき、いわゆる「パララックス」ホーム画面ビューについて言及がありました。このアニメーションは、他の追加機能とは異なり、iPhone の内部センサーを使用してユーザーがデバイスを保持している位置を特定し、軸を外れた動きに合わせて背景を移動します。結果は興味深いもので、アイコンが壁紙の上に浮かんでいるように見えます。

視差ビューは完全に不要ではありますが、あまり邪魔にならずに、ホーム画面にある程度の活気を与えます。この効果は、Google の Android で見られる効果に似ており、アイコン ページ間を移動するときに背景をわずかに移動します。

視差ビューに加えて、Apple はアプリまたはアプリ フォルダーを開いたときにアクティブになる「ズーム」アニメーションを追加しました。アプリの場合、機能は単純です。ユーザーがアイコンを押すと、OS がアプリに直接ドリルダウンするように見えるズームインをアニメーション化します。ここで注意すべき重要な点は、選択したアイコンがページ上の他のすべてのアイコンとともに拡大され、最終ビューは開いたアプリで終わるということです。対照的に、iOS 6 の同じアクションでは、アプリ ウィンドウが画面の中央から拡大するときにアイコンが邪魔にならないようにスライドします。

フォルダーの場合はもう少し複雑です。 iOS 7 ベータ版では、単にフォルダーを拡大して静止位置からホーミングするのではなく、フォルダーとそのすぐ後ろにある壁紙の帯の両方のズーム動作をアニメーション化します。このアニメーションは非常に巧妙で、アプリフォルダーが画面全体を占めることはほとんどなく、壁紙の大部分が表示されたままになります。 iOS では、背景をわずかにズームインしても、アイコンが空中に浮かんでいるかのような錯覚を壊すことはありません。

クリックするとGIFが表示されます。

新しいマルチタスク ビューでは、物理学が多用されています。アプリのプレビュー ペインで左または右にスワイプすると、ゆっくりとした鈍い動きがトリガーされますが、スクラブの下にあるアイコンで同じことを行うと、ユーザーの親指とほぼ 1 対 1 の比率でより速く動きます。この視点ではアプリ ペインは等距離ですが、アイコンは大きさに従って追跡するため、素早いフリックで間のスペースが広がります。

また、音楽に見られるスペースを埋めるアニメーションもあり、アプリを画面の上部に向かってスワイプして手動で終了するとアクティブになります。

マルチタスクビュー。アプリのプレビュー ペインに対するアイコンの間隔に注意してください。

ただし、このシステムにはいくつかの癖があり、そのうちの 1 つは天気などの特定のアプリをマルチタスク ビューで実行し続けることを可能にします。 Appleがこの「機能」を維持するつもりかどうかは不明だが、すでに貴重なCPU、メモリ、バッテリーのリソースにさらなる負担をかけることになる。

アプリ固有のアニメーション

何年もの嘆願の後、Apple はついに Clock のファーストパーティ アプリのラインナップに別の「アクティブ」アイコンを追加しました。 iOS 7 では、時計アプリのアイコンが正確な時間を反映し、動く秒針も表示されるようになりました。カレンダー アイコンのフォントとスタイルも変更されていますが、日付間の遷移は同じままです。

Apple のアプリ内アニメーションに関しては、Weather がおそらく最もよく考えられており、豊富な効果を使用して、ユーザーが選択した都市の気象パターンの変化を反映しています。

友人が入力中であることを示すアニメーション化された省略記号など、メッセージに小さな調整が加えられました。また、メッセージ送信時のアクションも新しくなり、その上の会話にテキストを「スロー」します。会話をスクロールすると吹き出しが浮かんでいて、ぶつかり合っているように見えるようになりました。これにより、ホーム画面などの OS の他の場所で見られるように、アプリに活気と立体性がもたらされます。

左から: アニメーション化された受信メッセージのバブル、テキスト ボックスからの送信メッセージ、スクロール メッセージ。

ほとんどの場合、ベータ版は iOS 6 よりも機敏に感じられ、アプリ内のページやメニューは目的を持って素早くスライドします。場合によっては、ポップアップ コンテキスト メニューにアニメーションが適用されませんが、公開前に変更される可能性があります。

言及する価値があるのは、iOS 7 のアプリがアセットの削除を処理する方法です。たとえば、写真アプリでは、写真を削除すると、次の写真が 1 スペース分左にスライドしますが、複数の写真をランダムにゴミ箱に入れると、削除して埋めるタイプのアニメーションが表示されます。

サムネイルの再配置に関する別の解釈は、ミュージック アプリでも見られます。このアプリでは、刷新された横向きビューに出入りするときにフェードアウトを使用して、アルバム カバーの順序を保ちます。画面上の完全なサムネイルが 8 個から 15 個、さらに 28 個に増えても、ミュージック アプリではアルファベット順が維持されます。ただし、最大の 28 枚のアルバム画面の事前定義されたマップのようなスナップショットを単純に拡大および縮小するのではなく、カバーが動的に再調整されます。

進行中の作業

Apple が iOS 7 の開発を継続していることは明らかであり、この秋に OS が一般公開されるまでに、上記のアニメーションの少なくとも一部が変更される予定です。

しかし、全体的には、追加と微調整により空間の感覚が生み出され、ベータ版全体に見られる「フラットな」図像に直接対抗するものと期待されるデザイン言語となっています。いくつかの点では、特に場違いに見えるポップアップ メニューの場合には、その考えが当てはまります。ただし、ほとんどの場合、フラットなデザインは iOS 7 という多軸の世界に非常に適しています。

アイコンや書体自体が奥行きを模倣しようとしている場合、UI は乱雑で魅力のないものになる可能性があります。アニメーションはユーザー エクスペリエンスを支配しませんが、シンプルさの中にすでに大胆なグラフィックをシームレスに操作します。それがこのシステムの透明性を高め、効果的なものにしているのです。

iOS 7 の効果を実際に確認したい場合は、Apple のサンプルをご覧ください。Webサイト

Apple の最新のモバイル オペレーティング システムの詳細については、次を参照してください。AppleInsiderの進行中の Inside iOS 7 シリーズ:

Apple の新しい App Store はアプリの更新と発見を簡素化します

新しいシステムコントロールで Siri がさらに賢くなる

Apple、iTunes RadioでPandoraに注意を喚起

Apple、新しい写真アプリで写真の整理を自動化