Flutter

こんにちは。すーさんです。

今回は、クロスプラットフォーム開発環境の1つであるFlutter(フラッター)について触れたいと思います。

「Flutter」は、Googleが開発したクロスプラットフォームのフレームワークになります。
現在リリースされているアプリケーションにも、Flutterで作成されているアプリが多くなってきています。

続きを読む

Android Material Design 3「カラーパレット」について

Android12で「ダイナミックカラー」という機能が搭載されました。
これは、背景色に使用されている色を抽出しダイナミックカラーに対応しているアプリケーションのキーカラーや関連するカラーパレットを変更する機能です。
これによりダイナミックカラーに対応しているホームやアプリケーションが統一された色調になります。

ただし、ダイナミックカラーに対応しないアプリケーションやダイナミックカラー機能が無いAndroid11以前でも動作するアプリケーションを作成する場合、固定のカラーパレットを作成してアプリケーションに設定しておく必要があります。
Androidのデザインガイドラインには、「背景と前景(文字やボタンなど)のコントラスト比が、4.5:1以上を守ること」と記載されているため色仕様を決定するには、なかなか面倒なことになってます。

続きを読む

Android Material Design 3

もう、ご存じの方も多いと思いますが、GoogleのUI向けデザインガイドラインが「Material Design 3」として大きく変更されました。

一番話題になっているのは、「ダイナミックカラー」と呼ばれる機能です。
「ダイナミックカラー」とは、ホームやロック画面の背景画像を変更することでAndroidOSが色を抽出しアプリケーションに設定するカラーパレットが作成されます。
ユーザーは、作成された最大4パターン+基本4色から好きな色を選ぶことで、アプリケーションのアクセントとなる色を対応アプリケーションに反映します。

続きを読む

AndroidのAdaptive Icon作成方法

こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。

AndroidのアプリアイコンはOSバージョンに伴って徐々に変化してきていますが、今現在はAdaptive Icon (アダプティブランチャーアイコン) というものが主流になっています。

続きを読む

システムフォントついて

フォント

こんにちは。
フェノメナエンターテインメント デザインチームのニキです。
画面デザインを行う際、実際に表示される状態に近くなるよう意識して作成していくことが大切であると考えています。その時に意識するポイントとして、フォントをどうするかがあります。iOSやAndroid向けなどのアプリでは、ほとんどの場合に初めからOSにインストールされている「システムフォント」を使うと思います。Webサイトの場合は「システムフォント」以外にも、ネット上にあるフォントデータを呼び出して使う「Webフォント」を使用することもあります。アプリ作成の初期段階で使用するのはどのようなフォントなのかを決めて、画面デザイン時にも用いることで、デザインと実際に表示される状態とのイメージのずれを少なくすることができます。
続きを読む

スマートフォンの縦長化

こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。

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 】その他の端末すべて

スマートフォンのアスペクト比

続きを読む

このブログから情報発信しているUIデザイン専門家集団のホームページ :
フェノメナエンターテインメント株式会社