iOS 7のフラットUIデザインガイドライン（日本語訳有り）

UIデザイン
2013.10.07
by

みなさん、こんにちは。ディレクターの柴宮です。

世間ではiOS 7からUIがフラットデザインに統一されて話題になってますね！（主に批判…w
iOSの責任者がスコット・フォストール氏からジョナサン・アイブ氏に変わったことにより、スキュアモーフィックデザイン（現実世界の物理的なものを模倣したデザイン）からフラットデザインにシフトしたと言われています。
ジョナサン・アイブ氏がUSA Todayのインタビューに答えているようです。
http://approfan.net/ios/jony-ive-explains-why-he-decided-to-gut-skeuomorphism/

なお、アイブさん曰く

人々がタッチスクリーンにすでに慣れて、十分使いこなしているため、物理的なボタンを模倣するようなことはもう必要ないと考えた。

その是非はまあともかくそう決まってしまったのであれば、プラットフォームのデザインに合わせていくのがデベロッパーとしては良さそうですよね。（アプリによるとは思いますが、デフォルトのコンポーネントも一新されてますし）
今回は、すでに伝説となっているAppleのヒューマンインターフェイスガイドラインが刷新されてますので、読み解いていきましょう。
と思ったら、日本語訳がまだない…（いつも半年遅れぐらいで公開されますね）というわけで調べてみたら、日本語訳を作成してくれている方がいらっしゃいました。

今話題のフラットデザイン「iOS7UIデザインガイドライン」を日本語訳してDLできるようにしてみた！ | APPLI-ANYALYZE!（アプリアニャライズ）
http://appli-anyalyze.apptrigger.me/ios7_gideline/

※ページ一番下からDLできます

ただ、全編とまではいかず「レイアウトと外観」のみのようなので、さらっと見てみましょう。

iOS7 は以下の事項を具体的に表現しています：

服従(Deference) UI はユーザによるコンテンツの理解や、すべき操作方法を分かりやすくするが、コンテンツとUI が並列関係になることはない。

明快(Clarity) テキストはあらゆるサイズで読みやすく、アイコンは精密で明快、装飾は目立たせすぎずに適切、そして機能性を重視したデザインである。

層化(Depth) ヴィジュアルレイヤ（層化UI）とそのリアルな動きがユーザの満足と理解を高める。

まあ、言わんとしてることはわからなくもないですね（どっちや… 他に名言集のように大事なことを言ってるようですので箇条書きで…適当じゃないですよ！
多分、アプリアニャライズさんの公式翻訳資料を見た方がわかりやすいです。まあ、サマリーってことで。

コンテンツが最重要

画面全体を利用する

システムフォントを使用する

境界線のないボタンを使用する

リアルなビジュアル表現を考え直す

半透明のUIを後ろの内容で暗示させる

より明瞭に

多くの余白を使用して下さい

UIの色をシンプルにする

奥行きをつくる

とまあ、iOSのUIデザインガイドラインというよりは、いかにしてわかりやすいフラットデザインを作るのかみたいな感じがしないでもn…
ちなみに、ぼくフラットデザインどうでもいい派（なんてあるかな…？）なんですが、fladdict先生がフラットデザインに言及しておられましたのでちょっとご紹介。

開発者必見！5秒でわかるフラットデザインまとめ
http://fladdict.net/blog/2013/05/flat-design.html

どこ押せばいいか謎

フラットデザインどうでもいい派あらため、どこ押せばいいか謎派にします。
自分のiPhoneもiOS 7にアップデートしてみたんですが、どこ押せばいいか謎なんですよね〜。慣れなのか、フラットデザインがそういうものなのか…

これ持論なんですが、新しいもの（スイス系のリバイバルで、言われてるほど新しくない。おい…）が持つ価値って新しいってことだけだと思うんですよね。先行者メリットってもちろんあると思いますが、そのデザイン（ここで言えば。または機能など）が本質的にユーザーにとってメリットがあるか、まあなければそのうち廃れてくと思うんですよね。
ほら、昔から多少形を変えても残ってるものってあるじゃないですか？！（誰…
Android 4.X系もWindows 8もフラットデザインですが、それがスマートフォンのUIに適しているかどうかって今、すぐに、断片的な機能ではわからないんじゃないのかなー？って思ってます。（どこ押せばいいか謎のままだと危ういですが…w

ただ、文脈なく「フラットデザインやで！（ﾄﾞﾔｯ」とか断片的な機能を取り上げて「iOSは死んだ」みたいな感じにはなんとなく違和感を感じます。
というわけで、公式ガイドライン（もちろん英語！）も用意されてますので、違和感を感じることは勉強せねば！ということですね。
軽く見ているだけでも勉強になります。（どなたか、日本語訳をお願いします…）

iOS 7 Design Resources
UI、デザインパーツをまとめておられます。
https://developer.apple.com/library/ios/design/index.html#//apple_ref/doc/uid/TP40013289

Updating the UI
iOS 7になってどこが変わったのか？詳しく説明しておられます。
https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/TransitionGuide/AppearanceCustomization.html#//apple_ref/doc/uid/TP40013174-CH15-SW1

UI Design Basics
これがUIデザインの基本やー！と。
https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/index.html#//apple_ref/doc/uid/TP40006556-CH66-SW1

個人的には、パズドラで下の丸を動かそうとするとコントロールセンターがニュイっと出てくるのなんとかしてもらえませんかね…？（フラットデザイン関係ない