タグ

ブックマーク / note.mu (3)

  • この記事の元の本編は削除しました。|樫田光 | Hikaru Kashida|note

    これは何かGoogleの Material Design Guideline - Data Visualization  がとても良くまとまっていたので、自分なりに和訳・編集してまとめたものです。 ※ 注意事項 こちらはあくまで、もとのドキュメントを参考に筆者が和訳・編集したものになります。原文の完全な和訳ではなく、抜粋の範囲や、英=>和の際の意訳を筆者が恣意的に行っています。 筆者の意訳・編集による曲解や元のドキュメントでのオリジナルの文意が気になる方は原文を読むことを強くおすすめします。 和訳の公開の可否についてはGoogle社に直接問い合わせています。1 / 原理原則(Principles) データの可視化は、複雑で内容の多い情報をグラフィカルな形式で表現するコミュニケーション手段である。 可視化の結果、データを比較しストーリーを伝えることが容易になり、データの利用者の意思決定の助け

    この記事の元の本編は削除しました。|樫田光 | Hikaru Kashida|note
  • ブサイクなUIデザインを劇的に改善するための10のチェックリスト|Taiki IKEDA|note

    お久しぶりです、イケダです。UIデザインをする上で、これらを意識するだけでビジュアルの質が劇的に向上するというチェックリストを作ってみました。UIデザインの参考にしてください。 左右の余白は揃っているか 左右の余白をしっかり揃えることは最も初歩的で、カンタンに実践できるTipsです。あまりに初歩的すぎて悪い例を探すのに苦労しましたが、MoneyF●rwardさんが題材として非常に優秀でした。左右の余白は14~20ptの間で揃えるのが定石です(迷ったら16ptにしておこう)。どうしても左右の余白を持て余してしまうという場合は右の改善例のように中央揃えに逃げるのも手です。 フォントの大きさは正しいか fontサイズはまず、「読ませるテキストの大きさ」を決めてから、それを基準に組み立てていきます。読ませる文字、webでいう<p>タグは14~16ptに設定し、その文字とのバランスを見て<head>

    ブサイクなUIデザインを劇的に改善するための10のチェックリスト|Taiki IKEDA|note
    Akineko
    Akineko 2019/06/04
  • 配色はセンスじゃない、UIデザインで色をかんたんにキメるメソッド|Taiki IKEDA|note

    今日は先日勝手にリデザインしたPolipoliのデザインを使って、UIデザインを行う時に僕が普段どのように色を選択しているのかをとても正直に書いていこうと思います。僕がこれから記す方法に則って色を選べば、誰でもナウでヤングなアプリを作ることができます。 はじめるよ レイアウトに関してはイニシエよりご先祖様がお築きになられたルールに則って並べればオワ、オワリです。さっそくこのPolipoliベッチュー、タタキケンサキエディションに色をつけていきます。 1. メインカラーを選ぼうまずはじめにメインとなるカラーを決めます。Polipoliのテーマカラーはピンクなのでブラウザの検索欄に「pink flat ui design」と打ち込みます。イメージに近い色が出てきたらスポイトで吸い取りましょう。著作権にはくれぐれも注意してください責任は負いません。 Polipoliに関しては最初からメインカラー

    配色はセンスじゃない、UIデザインで色をかんたんにキメるメソッド|Taiki IKEDA|note
  • 1