iOS
ダークモードのカラーコントラスト
こんにちは。
フェノメナエンターテインメント、デザインチームのマイケルです。
今回は「ダークモードにおける適切なコントラスト比の値」を探ります。
下図は、左右両方ともW3Cの規定にある レベルAAA(コントラスト比7:1以上)をクリアしています。
「iOS15」で何が変わるのか
こんにちは。
フェノメナエンターテインメント デザインチームのニキです。
日本時間の2021年6月8日午前2時に行われた、Appleの開発者向けカンファレンス「WWDC21」で「iPhone」や「iPad」や「mac」などの各OSのアップデートが発表されました。その中でも話題の中心になりやすい、「iPhone」のOSである「iOS」のアップデート全体としての印象は、デザインの方向性が大きく変わるようなアップデートではなく、「使いやすい環境を整えていく」ような印象でした。
次期iOSのバージョンは「iOS15」となりますが、対応端末は「iOS14」と同様で切り捨てられる端末はないため、「iPhone 6s」や「iPhone SE(第1世代)」も引き続きアップデート対象となるようです。
また、「iOS15」は2021年秋にリリース予定なのでそれまで使えないです。そのため、本記事は体験談としてではなく、発表された中で「使いやすくなりそう」と思った内容をいくつかピックアップしようと思います。
デザイナーのためのリソースカタログ Designpedia
こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。
弊社がスポンサーという位置付けで Designpedia というサイトを公開しています。
“デザイナーのためのリソースカタログ” と銘打って、主にUX・UIデザインデザインにまつわる記事や書籍を掲載しているサイトです。
システムフォントついて
こんにちは。
フェノメナエンターテインメント デザインチームのニキです。
画面デザインを行う際、実際に表示される状態に近くなるよう意識して作成していくことが大切であると考えています。その時に意識するポイントとして、フォントをどうするかがあります。iOSやAndroid向けなどのアプリでは、ほとんどの場合に初めからOSにインストールされている「システムフォント」を使うと思います。Webサイトの場合は「システムフォント」以外にも、ネット上にあるフォントデータを呼び出して使う「Webフォント」を使用することもあります。アプリ作成の初期段階で使用するのはどのようなフォントなのかを決めて、画面デザイン時にも用いることで、デザインと実際に表示される状態とのイメージのずれを少なくすることができます。
続きを読む
iOS13から登場のダークモード
こんにちは。
フェノメナエンターテインメント デザインチームのニキです。
フェノメナのブログでiOS系をネタとして書くことが多い私なので、少し時間は経ちましたが「iOS13」から登場した「ダークモード」について今回書こうと思います。
「iOS」も2019年の大型アップデート・「iOS13」で「ダークモード」対応をしました。
スマートフォンの縦長化
こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。
iPhone Xの登場でスマートフォン画面の縦長化が始まり、去年からはAndroidも追従しつつあります。例えばNTTドコモのラインナップを見ると、以下のようになっています。(2019.09.27時点)
【 21:9 】Xperia 1
【 19.5:9 】AQUOS R3 / Huawei P30 Pro
【 19:9 】Galaxy S10 / S10+ / AQUOS R2
【 18.7:9 】Huawei P20 Pro
【 18:9 】その他の端末すべて
ダークモードはもうすぐ当たり前?
こんにちは。
フェノメナエンタテインメントデザインチームのニキです。
「ダークモード」という言葉が今までよりも聞く機会が増ふえてきたと思いますが、もうそろそろダークモードは当たり前になるかもしれません。
ちなみに、windowsやmacOSでは、設定でダークモードに切り替えられるようになったのを知っていましたか?
同じようにスマートフォンでも切り替わるようになるのはそう遠くない話になりそうです。
Appleが推奨するアイコンの表現
こんにちは。
フェノメナエンターテインメント デザインチームのニキです。
今回は初めに、iOSでのアイコンに関する軽いクイズから入ろうと思います。
アプリを使っているとタブバーなどに配置されているアイコンをタップすると、アクティブ時・非アクティブ時での見た目が切り替わりますよね?
ここでクイズです!
アクティブ時・非アクティブ時での見た目を切り替える表現として、Appleが発行している【Human Interface Guidelines】で推奨しているのはどちらでしょう?
【A】:アクティブ時は塗り・非アクティブ時は線のテイストに変わる
【B】:アクティブ時も非アクティブ時も塗りで色の変化のみで表現する
決まりましたか?正解は…
このブログから情報発信しているUIデザイン専門家集団のホームページ :
フェノメナエンターテインメント株式会社