humaaansMix-&-match illustrations of people with a design library
humaaansMix-&-match illustrations of people with a design library
2019/04/18に株式会社gumi様で行ったデザイン講義のスライドです。 デザインとは何か?デザイナーは何を考えてデザインを作っているのか? という話から、実際にデザインを評価・検討するための言葉を紹介しています。 この 作品 は クリエイティブ・コモンズ 表示 - 改変禁止 4.0 国際 ライセンスの下に提供されています。 第二回「UIデザインをはじめよう」はこちら https://speakerdeck.com/kinakobooster/uidezainwohazimeyou 第三回「今日からできるUXデザイン」はこちら https://speakerdeck.com/kinakobooster/jin-ri-karadekiruuxdezain ※訪問講座のご案内※ あなたの会社に話しに行きます。料金表はこちら https://xemono.life/#/workwith/co
ユーザー体験が商品やサービスの成功を左右すると言われはじめてから数年がたった。世界中の大部分の人たちがスマホを使い、ミレニアル世代を中心にモノを所有することへの興味が下がり、体験をデザインすることが一つのデザイナーの仕事として成立している。 こんな時代にあって、UXデザインはどのような変化を見せてきているのであろうか。2017年を振り返り、UXデザインを取り巻くトレンドをまとめてみた。 1.「使いやすさ」は基本中の基本にユーザー体験を設計する上でもっとも基本となるのが「使いやすさ」。心地よい体験を提供するには、まずは基本的な使いやすさの品質がカバーされている必要がある。専門的に言う所のユーザビリティ。UXの品質評価をする際に使われるUXピラミッド理論においても、下記の通り根底から3つの部分は使いやすさをカバーする要素になる。 Task – 目的達成可能 (レベル1-3)Task – 目的達
スライドやポスターなどの資料作成において一番重要なものは「内容」です。しかし、それに並ぶくらい「デザイン・レイアウト」も重要となります。見づらいデザインのせいで、せっかく長時間かけて仕上げた資料が台無し...なんてことも十分にあり得ます。 あなたは読み手に優しい「見やすい資料」を作れているでしょうか? 今回は、全ての人が知っておくべき見やすい資料をつくるための9つの黄金テクニックを紹介します。これから紹介することは資料作成だけでなく、Webデザインにも応用できるはずです。ブログやサイトを運営している方もぜひ参考にしてみてください。 スポンサードリンク 目線の動きを意識したZNの法則 矢印や番号を使うと尚良し 強弱をつけて読みやすくする 適度な余白・行間を持たせる 見えない線を常に意識する 彩度の高すぎる色彩は使わない 色が持つ意味を考えて使う 色が持つイメージの例 極端な大きさの文字を使っ
数字がたんたんと並ぶエクセル表ってとっつきにくいですよね。見やすくするには「テーブル機能」が便利です。例えば、表に縞模様をつけて見やすくしたり、データバーを使ってセルに横棒グラフを表示できたりします。今回は、見やすい資料作りに必須な表のレイアウトワザを紹介します。 エクセルの表を見やすくするレイアウトワザ①表に縞模様を付ける表に縞模様を付けるには、テーブル機能を使います。レイアウトを残したままテーブル機能を解除するには、「範囲に変換」を使います。 ↑表を選択します ↑「ホーム」タブ → 「テーブルとして書式設定」ボタンをクリックし、メニューからスタイルを選択します 「テーブルとして書式設定」画面が表示されます。 ↑内容を確認し、「OK」ボタンをクリックします テーブルのスタイルが設定されます。 ↑テーブル機能が設定され、フィルターボタンが表示されます フィルターボタンなどのテーブル機能を解
2016年も毎年と同じように、デザインについて新しいことを学んできました。今回は、ウェブからグラフィックやロゴデザインまで、デザイン全般に関する2017年のトレンドを掘り下げてみていきましょう。 デザイントレンドはメディアやテクノロジー、ファッション業界、そして最近では「使いやすさ」を追求するユーザビリティーなどに影響を受けています。トレンドは徐々に細かく枝分かれし、いつの間にか同じように消えていきます。 基本的にデザイントレンドの寿命は1〜2年。2017年のデザインは、2016年のトレンドを引き継いだものとなり、雰囲気もここ数年よく利用され、親しまれているものと言えるでしょう。Google マテリアルデザインの影響力は今年も強く、対応にはいくつかの変更が必要になります。 Adobe が2017年デザイントレンドを発表!確認しておきたいポイントとは? 2017年のWebデザインはどうなる?
【追記】この記事をきっかけに、名著「ノンデザイナーズ・デザインブック」の20周年記念特典eBookの制作に協力させていただきました。詳しくはこちらを御覧ください。 ノンデザイナーズ・デザインブック20周年記念の特典に寄稿しました デザイナーである・なしに関わらず、仕事の中で伝えたいことを「図」で説明する機会は多々あります。提案書で事業内容を説明することもあるでしょうし、具体的な数値をグラフで説明することもあるでしょう。そんな中でこんな指摘を受けたことはありませんか? ・最終的に何を言いたいのか結論が見えないよ。 ・関係性が複雑すぎて理解しずらいんだけど。 ・要素が多すぎて全てを把握するのが大変。 ・何をどこから見れば良いの? ・結局一番言いたいことはなんなの? ・文字サイズがたくさんありすぎてまとまりがないね。 ・安っぽいチラシみたいでダサイなぁ。 ・全体的にバランスが偏ってて不安定。 ・
海外のクリエイティブチーム「freepik.com」とのコラボで、ビジターのみなさんに日頃の感謝を込めて、コリス限定の素材を配布します。 freepik.comは、海外のウェブ制作系ブログSmashing MagazineやSix RevisionsやWeb Designer Depotでもお馴染みで、そのブログだけのオリジナルの素材を配布するコラボをしています。日本ではコリスが初!今回はその第三弾です。 第一弾:コリスのビジターのアンケートを元にしたアイコン150種類 第二弾:1,400種類の汎用的に利用できるアイコンセット 今回のテーマは「Business & Social Network」。 ビジネスとソーシャルネットワークをテーマにしたインフォグラフィック用のベクター素材で、プレゼンや企画書、ウェブページでも紙でも無料で利用できます。 ダウンロードできる素材は10種類、その中から5
UIコンポーネント素材は、ウェブサイトやモバイルアプリを作成するときなど、ドラッグ&ドロップの直感的でシンプルな作業のみで、サイトデザインを完成させることができます。それぞれの素材は、プロデザイナーがピクセル単位にこだわり作成し、トレンドのデザインや配色などを採用しているので、高品質なデザインも特長です。 今回は、最近公開されたデザイン性の高い、無料UIコンポーネント素材をまとめてご紹介します。今後のデザイン制作に活用してみてはいかがでしょう。PhotoshopとSketchで編集できる、アイテムを中心にまとめています。 詳細は以下から。 美しい配色、デザインの参考にしたい!すごい無料UIコンポーネント素材まとめ Awesome Kit iPhoneモバイルとiPadタブレット端末向けのプロトタイプを作成するときに活用したい素材で、合計100種類のテンプレートが用意されています。組み合わせ
企画書や提案書を、読み手に気持ち良く理解してもらうためには「内容」はもちろん大切ですが「見た目」の綺麗さも重要な要素の1つです。 デザインに少しこだわった企画書が作れるだけで、周りの資料とは一味違ったものになるでしょう。そこで今回は、企画書の見た目をよくする際に無料で使える「インフォグラフィック」作成ツール・アイコン素材検索サイトをご紹介します。 インフォグラフィック(infographics)とは そもそもインフォグラフィックとは、情報・客観的なデータを整理し、視覚的に表現したものを指します。 ただ単に数値やデータを無機質に羅列させるだけでもよいのですが、他の人に情報をわかりやすく伝え、企画書を見る人の理解を深める手段の1つとして”インフォグラフィック”が利用されます。 オンライン上でデータを入力するだけで、簡単にインフォグラフィックを作成できるWebツールを4つご紹介します。 info
2016年 01月 21日 グラフィカルに伝えるインフォグラフィックの勉強に最適なデザイン参考サイト20個とツールサイトのご紹介 カテゴリ: デザイン タグ:インフォグラフィック 情報を伝えるのに、文章では伝わりづらいことが多々あります。そんな時に必要とされるのがデザインの役割なのですが、中でも人が普段あまりみないような情報、専門性の高い情報などは、一層伝わりづらく、文章や数字を並べただけでそれを理解するには非常に敷居が高くなってしまいます。 そんなとき、グラフやビジュアルを使ってうまく情報を見せて伝えるのがインフォグラフィックという手法です。 目次 インフォグラフィックを作ることのメリット インフォグラフィックの参考に インフォグラフィックを作ることが出来るサービス インフォグラフィックを作ることのメリット インフォグラフィックを作ることのメリットは、上記で書いたとおり、伝えやすさにあり
海外ニュースメディアThe GuardianやWiredなどでライターを務めるDavid McCandlessさんは、膨大な情報を解析し分かりやすく提示するデータジャーナリストやインフォメーション・デザイナーでもあります。そんなMcCandlessさんが運営しているアイデア・問題・知識・情報などを視覚化することを目的としたサイトが「Information is Beautiful」です。 Information is BeautifulではKantarをスポンサーに、インフォグラフィックやデータビジュアライゼーション関連の優れたものを表彰しようという企画「Kantar Information is Beautiful Awards 2015」を行っています。 Winners: Kantar Information is Beautiful Awards 2015 | Information
フラットデザインとは2012年ごろに広まったWebデザインのスタイルである。それは広く今も利用されているが、過度な利用は深刻なユーザビリティ上の問題を引き起こしかねない。フラットデザインによって発生するユーザビリティ上の最大の課題の1つに、クリック可能な要素のシグニファイア不足がある。フラットデザイン2.0は、それに対する優れた解決策を提供してくれる可能性がある。 Flat Design: Its Origins, Its Problems, and Why Flat 2.0 Is Better for Users by Kate Meyer on September 27, 2015 日本語版2015年11月2日公開 フラットデザインは人気のあるデザインスタイルで、Webページのグラフィック要素に、光沢感や立体感という視覚効果を利用しないもののことである。それは多くのデザイナーからWeb
高機能なCMSが続々とリリースされている今、特別な技術がなくてもホームページやランディングページを作成できる環境が整ってきました。 Web制作会社やデザイナー等の専門職の方に頼らずにWebページを制作される方も増えてきていると思いますが、制作時につまづきやすいのが「配色」の選定です。 配色はページ全体の印象を決めますが、作成者のセンスに左右されるため、デザイナーのように配色の知識が無い方は何かと時間をとられてしまいます。 今回は、配色に自信の無い方でも最新のホームページのような配色ができる無料のカラーパレットをご紹介します。 あらかじめ配色が決まっているもの、自分で配色を調整できるものなど様々なパレットがあるので、目的に沿って使い分けてみましょう。 マーケ思考のデザイナーは強い! 提案型デザイナーのススメ リード獲得が重視される「広告・LP・サービスサイト」などに携わるデザイナーの皆様に向
大きなトラブルとなった五輪のロゴ類似問題。素人目にはそっくりになロゴに対し、審査員をはじめ多くのデザイナー達が「まったく違う」と反論していたのが印象的でした。しかし、不透明かつ説明不足の審査委員会もあいまって、残念ながらこれらの発言は身内を守るものと解釈されてしまいました。また画像の盗用問題により、本来なら行われるべきだった、冷静な議論などは完全に失われてしまいました。 なぜデザイナーと世間において、これほど大きな認識の違いが生まれたのでしょうか?本稿では、デザイナーと世間の間にある「類似性のギャップ」に関しできる限りわかりやすく説明します。最大公約数的な意見としては、このような感じではないかと思います。 全体の構成としては、まず類似性は鑑賞者の文化背景に依存することを説明します。その上で、前提知識として、デザインの本質や、文字を用いたデザインの類似性についての基礎知識を解説します。その後
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く