Android 6.0(Marshmallow)の標準フォントに関する注意
こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。
以前、Android 5.x までの内容として、標準フォントについて 記事を書きました。
その時点での標準フォントは Roboto、日本語を表示する際は モトヤフォント というフォントが採用されていたのですが、Android 6.0(Marshmallow) からは、日本語フォントが変更されています。
design
UIデザインの仕事を行うのに必要なスキル
お久しぶりです、デザイナーのオガワです。
入社したてのときに、デザイナーの先輩から仕事をする上で必要なスキル一覧をもらいました。その中からUIデザインの仕事を行うのに必要なスキルを紹介します。
レイアウトの知識
様々な形や色、バランスを見て、まとまり感のあるレイアウトにすることが大切です。これを平面構成といいます。美術系の予備校でたくさん練習するアレはとても大事なんですね。
レイアウトについて分かりやすいスライドシェアがありました。広告についてのレイアウトですが、画面作成でも参考になる箇所がたくさんあります。
色彩構成、カラーユニバーサル
平面構成ともリンクしますが、画面内でバランスよく色を配置することも大切です。 続きを読む
モノづくりをする側の立場から、ＵＩの意義を考えておく
フェノメナエンターテインメントの「とし」です。
スマホに限らず様々な製品にはどんな形にしろ取扱説明書やマニュアルがあります。なぜでしょう。 取扱説明書を読まないと使えないことが少なくないからなんでしょうね。
考えてみたら、金づちやハサミ、包丁にはそんなものは付いていません。
スマホからちょっと離れて、家電製品のことをイメージしながら考えてみてください。
これを読んでくださっている方はＵＩデザインを仕事にしている方で、モノづくりに関わっている方だと考えてお話を進めます。
Android テーマ「Material」での色設定１
フェノメナエンターテインメントの「おっちゃん」です。
今回は、Androidアプリケーションを開発する際のスタイル色の設定について書きたいと思います。
テーマ「Material」からいろいろな部分の色を一括して指定できるようになりました。
基本的な設定色は、Android Designにも記載されていますが以下のパラメータです。
colorPrimary ———— アクションバーの背景色
colorPrimaryDark ——— ステータスバーの背景色
navigationBarColor —— ナビゲーションバーの背景色
windowBackground ——– アプリケーションボディの背景色
textColorPrimary ——— アクションバーのタイトル文字色
colorAccent ————– コントロールの基本色
これらのパラメーターをスタイルに設定することでアプリケーションの基本色を一括で指定できます。
<< style.xmlへの設定例 >>
| <style name=”AppThemeML” parent=”@android:style/Theme.Material.Light”> <item name=”android:colorPrimary”>#bdbdbd</item> <item name=”android:colorPrimaryDark”>#757575</item> <item name=”android:navigationBarColor”>#000000</item> <item name=”android:windowBackground”>#eeeeee</item> <item name=”android:textColorPrimary”>#000000</item> <item name=”android:colorAccent”>#009385</item> </style> |
図1基本的なパラメータ
アイコンモチーフの選び方
こんにちは、デザイン担当のオガワです。
今日は私がアイコンのモチーフを考えるときに気をつけていることを紹介します。
アイコンはユーザーが直感的に理解するための手助けです。モチーフには既によく使われているものや、ユーザーが繰り返し見て覚えやすいものを選びます。ゴミ箱やメール、設定アイコンはよく使用されているモチーフがあるため、なるべくそのモチーフを使用します。
アイコンに関する便利なサイトを弊社デザイナーの山男先輩に教えてもらいました。
[Photoshop] テキストレイヤーの透明度はおかしい？
こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。
画面デザインを行う際など、Photoshopを使用する機会は多いと思います。
僕もほとんどの場合、最終的な画面デザインはPhotoshopで完成させています。
今回はそんなPhotoshopについて、テキストに関する意外な落とし穴を紹介します。
ピクトグラムアイコン作成の基本
こんにちは、デザイン担当のオガワです。
入社当時は作成したピクトグラムアイコンを先輩に見せても「テイストが合っていない」とよく言われ、クオリティを上げることにとても時間がかかっていました。それでも何度も繰り返し作成しているうちに、作成前にいくつかのことを決めれば作業が早くなることが分かってきました。
現在、私がピクトグラムアイコンを作成する前に確認していることです。
作成するサイズを統一
アイコン一つずつに同じ大きさの正方形のベースを用意し、その中に納まるように作成していきます。そうすることで並べたときの全体的なサイズ感のバラつきがなくなります。
ベタ塗りか線か
アイコンをベタ塗りで表現するか、線で表現するかを統一します。色の面積の違いで印象が大きく変わります。
Androidの標準フォントに関する注意
「Android 標準フォント」で検索するとこの記事が上位に表示されますが、より新しい内容の記事が投稿されているため、そちらへのリンクを貼っておきます。
→ Android 6.0(Marshmallow)の標準フォントに関する注意
こんにちは。
フェノメナエンターテインメント デザイン担当の山男です。
Android 4.0以降、Androidの標準フォントは Roboto が採用されています。
また、日本語を表示する際は モトヤフォント というフォントが採用されています。(Android 3.x以前は、それぞれ Droid Sans と Droid Sans Japanese)
このブログから情報発信しているUIデザイン専門家集団のホームページ :
フェノメナエンターテインメント株式会社