デザインを開発するという視点でお伝えするクリエイティブBLOG
アイコンは視覚的な表現を豊かにしてくれる要素の一つ。UI面を左右する大切なものだからこそ、シーンに応じて適切なものを使用していかなくてはなりません。そんな時に知っていると便利なまとめ「7000+ Material Design Icons – Ultimate Icon Roundup」をご紹介していきたいと思います。
Mini Material Free iconset Vol1 by Iftikhar Shaikh☯ – Dribbble
高品質なデザインアイコンが7000以上もまとめられており、多種多様のテイストを持っています。気になったものをいくつかピックアップしているので、下記よりご覧ください。
詳しくは以下
医療関係のデザインは、専門的な内容も多いだけに、できるだけわかりやすくユーザーに視覚的に伝えることが重要にもなってきます。そんなときに知っておくと便利なまとめ「30 Free Medical Icon Sets You Can Download」をご紹介していきたいと思います。
Vector Medic – Download Free Vector Art, Stock Graphics & Images
医療向けのアイコンに特化してさまざまな種類・テイストのものがまとめられています。以下にいくつかピックアップいたしましたので、ご覧ください。
詳しくは以下
様々な場面で見かけるアイコンは種類も豊富ですが、それぞれのインターフェイスにピッタリと合ったデザインを探すのは意外と大変なもの。そんな中今回は、コレクションしておくと便利な、カラーリングがPOPなベクターアイコンセット「Dusk UI Icons (SVG, EPS, PDF, PNG)」を紹介します。
80種類のカラフルでPOPなテイストのアイコンがセットになっており、デザインに華やかな彩どりを与えてくれそうです。
詳しくは以下
ビジネス、ライフスタイル、ソーシャルなど、アイコンにはいろいろな種類があり、常にチェックしストックしておくことでさまざまなシーンで役立ってくれます。そんな中今回紹介するのは、人物のラインアイコン「Freebie: Line-Style User Avatar Icon Set」です。
人物をテーマとしたラインアイコンで、シンプルなテイストでありながらもどこか個性を感じるデザインが特徴となっています。
詳しくは以下
最低限の情報を、シンプルなまとめた構成が魅力的なミニマルデザインに欠かせない素材として、情報要素をすっきりとまとめてくれるアイコンは非常に役立つ存在。そんな中今回ご紹介するのは、ミニマルデザインに合わせて使いたい、シンプルでハイクオリティなアイコンまとめ「11 Free High-Quality Line Icon Sets」です。
Goodies Icon Set | Best PSD Freebies
細ラインで描かれたシンプルなフリーアイコンが11種類紹介されています。その中からおすすめのアイコンを幾つかピックアップしてご紹介していきます。
詳しくは以下
Webデザイン上においてユーザインターフェースというのは非常に重要なもの。操作性がわかりにくいストレスは、ユーザーが離れていく要因の一つです。それらを解消したいときに便利なアイコンのまとめ「1700+ Free Icons for Web, iOS and Android UI Design」を今回はご紹介していきたいと思います。
シンプルなミニマルアイコンからカラフルで存在感のあるデザインアイコンまで、幅広く紹介しているまとめになっています。
詳しくは以下
さまざまな写真加工技術が凝縮されたソフト・Photoshop。しかしいろいろな機能がありすぎるがゆえ、難しい機能を使いこなせていないという方も多いのではないでしょうか？そんな中今回は、取り入れるだけで高度な写真加工を簡単に行うことができるPhotoshopアクションまとめ「Best Premium Photoshop Actions」を紹介したいと思います。
Photography Actions Bundle #1 | GraphicRiver
写真をより魅力的に表現できる、グラフィカルなものに変換できるアクションから、写真の色や雰囲気を変える加工まで、いろんな種類が紹介されています。
詳しくは以下
デザインと一口に言っても様々なデザイン感があり、求められているデザインや目的に応じて、デザインの感覚を調整し、ふさわしい形で創り上げるのがデザイナーの役目ですが、今回紹介するのはレトロな感覚を演出したい時に便利なレトロ感を演出できるphotoshopブラシを集めたエントリー「30 Free Adobe Photoshop Retro Style Brush Sets」です。
上記の他に、幾何学的なものから、イラストレーションまで、幅広いphotoshopブラシがまとめられていました。今日はその中から幾つか気になったものを紹介したいと思います。
詳しくは以下
背景など、アートワークに敷き詰める事ができるパターン。非常に便利なものですが、今回紹介するのはphotoshopで利用できるパターンを集めた「Patterns Pack 1 by PeterPlastic」を紹介したいと思います。
収録されているパターンは全部で72種類。カモフラ、カーボンファイル、アンティーク調なもの、ドクロのマークなどなど、様々なパターンが公開されています。
詳しくは以下
PCで見るWEBサイトの印象を大きく左右するアクションの一つホバーアクション。主にWEB上のユーザー導線上に配されるものだけに、小さいながらも、このアクションが心地よいかでサイトのクオリティを左右するものですが、今日紹介するのはクリエイティブなホバーアクションを実装できる「Tilt Hover Effects」です。
一般的に色が変わる、透明度が上がる、画像が切り替わるなどといったものでは無く、複数の画像がズレたり、アニメーションが加わったりマウス座標の位置で見た目が変わったりと、多彩なホバーアクションが簡単に実装できるようになっています。
詳しくは以下
CSS3で利用できるようになったFlexbox。WEBアプリやレスポンシブを想定して開発されたものですが、まだまだ現場ではそれほど普及していないのが現状です。今日紹介するのはそんなFlexboxを理解・利用するための様々なUIを簡単に利用できるCSSのFlexbox UIパターン集「Flexbox Patterns」です。
「Flexbox Patterns」は利用しやすくなるようにそれぞれのユーザーインターフェイス毎に、簡単な解説と、CSSとHTMLがセットでコピーできるようになっており、コピー＆ペーストで利用できるようになっています。
詳しくは以下
WEBデザイナーなら一度は苦しめられたことがあるIE6。はやくIE6を考えなくて良い、開発環境にならないかと思っている方も多いと思いますが、まだ現状を見る限り、完全に考えなくて良いという日はもう少し時間がかかると思います。今日紹介するのはIE6について改めて知ることができるIE6の全てをまとめた「Ultimate IE6 Cheatsheet」を紹介したいと思います。
市場シェアが現状どうなっているのか？躓きがちなDOCTYPE宣言だったり、クロスブラウザで同一の表現を楽にしてくれるcssリセット、動作可能なjavascriptのフレームワークと様々な角度からIE6についてまとめてくれています。
詳しくは以下
12月と言えばクリスマス。一大イベントともあって、クリスマスのデザインを手がけている方も多いのでは？今回ご紹介するのは、そんなクリスマスのデザイナーの強い味方となってくれる、デザイナーのためのフリーのクリスマス素材をまとめた「50 Free Christmas Templates & Resources for Designers」です。
Digital Space: Premium and Free Resources for Designers and Coders – Free
クリスマスカードや可愛らしいクリスマスイラストなど、使える素材が50種類にも渡り紹介されています。さらにその中から、おすすめの素材を幾つかピックアップ致しましたのでご覧ください。
詳しくは以下
(続きを読む…)
CSSで実現できる範囲は確実に広がってきており、様々な試みがWEB上ではプロジェクト化され公開されていますが、今回紹介するのはオープンソースライセンスで利用できるCSSリソースのまとめ「Collection of Useful Open Source CSS Resources」です。
上記の他にフレームワークから、ボタン・パーツ系まで様々なサイトがまとめられていましたので、今日はその中からピックアップして紹介したいと思います。
詳しくは以下
画像加工やCG制作になくてはならないソフトとなっているPhotoshopは、非常にたくさんの機能が備わっており、さまざまなクリエイティブを生み出すことができます。そんな中今回紹介するのが、Photoshopの効果を有効活用したテクスチャの制作チュートリアルをまとめた「40 Great Photoshop Texture Tutorials」です。
Mix&Mash: Transform a boring piece of wood
メタリックな表現や、チェックなどのファブリックを再現したテクスチャまで、さまざまなシーンを生み出すことができるチュートリアルが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
複雑な情報やデータをまとめて分かりやすく伝えるためには、イメージ図やグラフなどをうまく使って表現することが必要となってきます。今回はそんな時に役に立つアイテム、様々な場面で役に立つ便利なインフォグラフィックテンプレート「20 Cool Infographic Templates to Create Amazing Designs」の紹介です。
Free Vector Infographic Elements – Download Free Vector Art, Stock Graphics & Images
アイコンから円グラフなど様々なアイテムがまとめられたサイトです。気になったものをピックアップしましたので、チェックしてみてください。
詳しくは以下
