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

Webサイト、スマホアプリの制作・開発に携わるすべての人に役立つ、200種類以上の有料・無料のデザインツールを紹介します。 定番ツールから最近リリースされた注目のツールまで、便利なツールが揃っています。 Awesome Design Tools -GitHub 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 アクセシビリティのツール アニメーションのツール AR（拡張現実）のツール コラボレーションのツール カラーピッカーのツール デザインのフィードバックツール デザインのハンドオフツール デザインパターンとインスピレーションのツール デザインシステムのツール デザインをコードにするツール エクスペリエンスのモニタリングツール フォントのツール スクリーンショットのツール アイコンのツール イラストのツール 情報アーキテクチャの

商用でも無料で利用できる1,000種類のアイコンが3つのスタイル、そしてPhotoshoop用・Adobe XD用・Sketch用・Figma用・inVision用、そしてSVGまで完備されたMaterial Icons Libraryを紹介します。 一度にすべてのアイテムがダウンロードできるので、備えておくと便利だと思います。 Material Icons Library ラインセスはApache License Version 2.0で、個人でも商用でも無料で利用できます。 アイコンはMaterial Designを踏襲しており、全部で1,000種類のアイテムが揃っています。スタイルは角丸・アウトライン、ツートーンの3種類。合計すると、3,000種類以上になります。 アイコンの特徴 フォーマットは、Photoshop, Adobe XD, Sketch, Figma, inVision

ウェブデザインやフリーペーパーといった物理的なデザインをする際には、人に訴える力を持つ「見やすい」色の組み合わせを見つけ出すことはかなり重要です。背景色と文字色の組み合わせが「アリ」なのか「ナシ」なのかを一目でわかるようにする「Accessible Brand Colors」を使えば、悩みがちな色の組み合わせを直感的にさくっと決められそうだったので、実際に使ってみました。 Accessible Brand Colors by Use All Five https://abc.useallfive.com/ 上記URLにアクセス後、画面右上の「＋」をクリック。 カラーピッカーが現れるので…… 色相や明暗を調整して「Add hex」をクリック。カラーコードを指定することも可能です。 するとこんな感じで1色目が決定。同様に下側の「＋」もクリック。 色を選択して「Add hex」をクリックします。

無料で利用できるベクター素材は、制作時間のかかりそうなイラストやパーツなどを手軽に利用できる、グラフィックデザインでも重宝するアイテムです。 今回は、さまざまなシーンで利用可能な、高品質なベクター素材を無料ダウンロードできるサイト22個を国内、海外編に分けてご紹介します。 ベクター素材のクオリティが高いのはもちろん、商用利用にも対応したフリー素材が数多く公開されています。制作時間が短縮したいというときにいかがでしょう。 デザイン力で勝負する！ベクター素材を無料ダウンロードできるWebサイト厳選22個まとめ 海外編（全12サイト） unDraw デザイン性の高さだけでなく、豊富なジャンルを網羅したスタイリッシュなベクターイラストを多数公開しています。すべてのイラストのタッチが統一されているので使いやすく、その場で配色を変更、確認することも可能。 Humaaans 着せ替え人形感覚で、人間のイ

難しいことをしなくてもイラストは描けます そもそもデザイナーじゃないんで、絵を描くのは難しいんじゃないかなと思っていたり、デザインはするけど、イラストを描くのはきびしい。illustratorでイラストを描いてみたいけど、なんだか難しそう。adobeCCを契約していてPhotoshopは使ってるけど、illustratorはちょっと、ハードルが高そう。と思っていませんか？ そういう人はコンピュータの力を使いましょう。illustratorなら、手書きのように何度も描いたりする必要はありません。どんどん直して調整すればいいんです。昔、習字であとから筆入れして、形を整える裏技使いましたよね？やり直しがきくんです。 illustratorには、ペンで描くような「ペンツール」がありますが、絵心がない人には、一番のハードルになるポイントでしょう。慣れるととても便利なツールなんですが、かなり癖がありま

街で見かける「あの文字」はフォントじゃないかもしれない？　フォントと書体の“あるある”勘違い：デジタルネイティブのためのフォントとデザイン（1/3 ページ） 新連載：デジタルネイティブのためのフォントとデザイン スマートフォンやSNSの普及で、誰もが気軽に情報を発信できるようになった今、「どう発信するか」を考える上で、欠かせないのがフォントやデザインです。「最近ここのフォント変わったな」「このロゴどうやってデザインしたんだろう」と、身近な文字が気になっている人も多いのではないでしょうか。 この連載では、街角やビジネスの現場など身のまわりにある文字をきっかけに、奥深いフォントとデザインの世界をご案内します。いつも使っているスマートフォンやデジタルカメラを片手に、ひとときの「フォントの旅」を楽しんでみませんか。 菊池美範（きくち よしのり） 1980年代末からパーソナルコンピュータをデザインワ

人物・動物・植物をはじめ、デジタル機器、建物、家具など、日常で見かける標準的なさまざまなスペースとサイズを図版化したDimensions.Guideを紹介します。 人物だけでも、老若男女の立ち・座り・寝・歩き・運動、そして正面・側面・上面が揃っており、イラストやデザインの参考資料になると思います。 Dimensions.Guide Dimensions.Guideではさまざまな図版が揃っています。 例えば、25-45歳の女性が歩いている時のサイズ。 平均身長は1.63mに設定されており、カジュアルな服装で歩いている横向きです。 Walking Female Side 素材はすべて商用でも無料で利用できます、クレジットは特に必要ありません。ただし、素材そのものを再配布・再販売することは禁止です。詳しくはライセンスページをご覧ください。 legal ダウンロードできる素材のフォーマットは、3種

スマホのアプリのように、ビジネス資料においても「シンプルで分かりやすく」デザインするニーズは高まっていると感じる。そこで、パワーポイント用のデザインテンプレートを多数提供しているサイトを紹介したい。 https://business.tutsplus.com/series/microsoft-powerpoint-templates-ultimate-guide-to-the-best-ppt--cms-1075 これは、Enavatotuts+というコーディングやデザインのTipsがまとめられたサイトの中の記事で、パワーポイントの様々なテーマのテンプレートが「圧倒されるほど」たくさん紹介されている。 以下このまとめページから良さそうなものをピックアップしてみる。 この記事ではデザインファームなどで使われそうな、クールなデザインの優れたテンプレートが17+個紹介されている。 https:/

個人でも商用でも無料利用できる、日本語のフリーフォント727種類を紹介します。 Webデザイン、アプリ、動画、紙のデザインをはじめ、クライアントのプロジェクトでも販売する同人誌まで、幅広く利用できる無料フォントが満載です！ 前年の647からフリーフォントが50種類くらい増えています！ ※サイト閉鎖などでかなりのフォントが減っています。気になったフォントはダウンロードできるうちにダウンロードしておくことをお勧めします。 本記事は定期的に、全フォントを確認して、更新しております。 初紹介のフォントから既存フォントも改めてリンク・ライセンスを確認しています（※情報はこの記事の執筆時のもの）。ライセンスはWebデザインだけでなく、同人誌や印刷物などでの利用も確認しました。 更新情報 2024/6/4: フォントを10種類追加 2024/2/20: フォントを11種類追加 2023/12/26: フ

そろそろ2018年も終わりを迎え、2019年がやって来ようとしています。この1年でWebデザインのトレンドにも様々な変化がありましたが、2019年はどのようなWebデザインの手法が流行するのでしょうか？ 最新のWebデザインのトレンドを取り入れることによって、Webサイトを魅力的に見せることができたり、使いやすいWebサイトを提供することができるなど、様々なメリットが生まれます。 今回は、2019年に流行するWebデザインの最新トレンドを一気にご紹介していきたいと思います。 2029年のWebデザイントレンドに関する記事を公開しました！最新情報を知りたい方はこちらをご覧ください。 2022年に流行するWebデザインの最新トレンド10個まとめ 2021年のミニマリズムを中心としたトレンドが注目されていましたが、2022年は鮮やかで、奇抜で、記憶に強く残るようなデザインを中心としたトレンドが注

様々なもののデジタル化が進む中で、デザイナーの役割も大きく変化し始めている。 特にインターネットを介したサービスにおいては「design, Design, DESIGNの違いを知っていますか?」でも紹介されている通り、世界中の不特定多数のユーザーを念頭にデザインしなければならない時代になってきている。 それは同時に、受け取り側の趣味嗜好や価値観を十分理解した上で、プロダクトやメッセージングを考える必要があるということでもある。デザインコミュニケーションとして、単純に言葉を翻訳しただけでは不十分なのである。 目で表情を伝える日本人、口で表情を伝える欧米人日本と欧米では絵文字の表現方法が大きく異なる。特に日本では「目」を主な表現として利用しているのに対し、欧米では主に「口」の形の違いで感情を伝えている。 この違いの原因の一つが日常生活における人々の生活習慣の違いだろう。 ご存知の通り、花粉症の

最近資料デザインを「現代的」にしたいなと思っていて、フラットデザインのテンプレートを購入して研究したりしてます。そこで重要となるのが「アイコン」で、うまく使うだけで資料がぐっと見やすくなります。いろいろとググってみると良いものがたくさんあるので、今回はそれをご紹介。 まずはこちら。 Googleが提供していてそのサービスでよく使われているMaterial Icon 942種類をパワポですぐ使えるようにコンバートしてくれています。たくさんのカテゴリーごとに網羅的にアイコンが揃っているのですごく使えそうです。さっそくダウンロードしました。 また、同じ方がFont Awesomeのアイコン369種類を同様にパワポ向けにコンバートしてくれています。 親しみやすいデザインが多いので、さまざまなタイプのパワポ資料に活用できそうです。いいですね。 次はこちら。 これは海外のデザインスタジオが作成している

日本語のフリーフォントを利用してデザインする際などに「クールなデザインにしたい」「かっこいいフォントを使いたい！」という場面があるかと思います。 ただ、英語のかっこいいフォントはすぐに見つかるのに、日本語になるとすぐに見つけられないということがあります。 そこで今回は、デザイン性が高くてかっこいい日本語フリーフォントをフォントのタイプに分けてご紹介していきます。 商用利用可能なものから、漢字を含んだもの、カタカナのみのかっこいいフォントまで幅広く用意してみましたのでご覧ください。 かっこいいゴシックフォント 鉄瓶ゴシック 鉄瓶（てつびん）ゴシックは、フォントな自由さんが公開している角ゴシックフォントです。 「源ノ角ゴシック」を改変して制作されており、極太の文字かつごつごつとした質感がかっこいいフォントです。 商用：OK ひらがな：◯ カタカナ：◯ 漢字：◯ ▷ 鉄瓶ゴシック スマートフォン

明治大学の渡邊恵太先生の研究室共同研究成果発表展 『IoT時代のインタラクションデザイン』に行ってきました。 渡邊先生の著書の「融けるデザイン」を拝読して自分自身のものの見方、デザインの考え方が変わったこともあり、今回の研究室初の研究成果の展示会に行くのを楽しみにしていました。 ここでは見てきた作品の一部を紹介します。 『WorldConnector』 触覚を映像と一緒に再生する装置。 棒を握ると映像に合わせて棒に伝わる触覚が再生されます。 市販のカメラで映像と音（振動）を収録し、振動スピーカーと棒についたプロジェクターで映像を再生。 映像に合わせて自分も棒を動かすとよりリッチな触覚が返ってきました。 身近な機器を使って新しい体験を生み出していました。

レーザーカッターや3Dプリンタなどの、コンピュータと接続されたデジタル工作機械によって、3DCGなどのデジタルデータを木材、アクリルなどのさまざまな素材から切り出し、成形する技術。デジタル工作機械そのものは1980年代から製造業のレヴェルではすでに存在しており、工場には「CNC（Computerized Numerical Control＝コンピュータ数値制御）」と呼ばれる工作物を加工する際の工具の位置や送り速度などを電子的に指令・制御する機械が設置されていた。1990年代後半からは技術進歩によってこうした工作機械の小型化・コンパクト化が可能となり、机の上に置けるまでのサイズとなった。こうした製造体制は「デスクトップ・ファブリケーション」とも呼ばれ、「デスクトップ・ミュージック（DTM）」や「デスクトップ・パブリッシング（DTP）」などと同様に、従来の製造業から離れた、ものづくりの個人化ま