デザインを開発するという視点でお伝えするクリエイティブBLOG
WEBデザインを円滑にしてくれるアイコンセット。様々なテーマでアイコンセットが日々公開され、クリエイターの制作活動の一助となっていますが、今日紹介するのはWEBデザイン自体をテーマにしたフリーのアイコンセット「100 Web Design Icons 」です。
このアイコンセットはWEBデザインでよく見かける、ワイヤーフレームやビデオプレイヤー、解析画面、スマートフォンなどのUIなどなど、WEBデザインをテーマにしたアイコンが全部で100個収録されています。アイコンの一覧が公開されていましたので以下からご覧ください。
詳しくは以下
自身の分身として表示されるアバター。皆様は何を設定されているでしょうか？ソーシャルメディアが広く利用され様々な種類がある今アバターもデザインダミーとして制作しなくては行けないなんてことも増えてきたと思います。今日紹介するのはフォーマルからアニマルまでフリーで利用できるベクターアバター「Avatar vector collection」です。
「Avatar vector collection」はベクターで制作された全54種類ものアバターがまとまっており配布されているものです。人間が42種類、動物が12種類収録されています。収録されている全アバターは以下からご覧ください。
詳しくは以下
WEBサイト制作において重要なアイコン。あまり面積を取ること無く、端的に直感的にわかりやすく表現できるアイコンはスマートフォンが中心となったWEB制作現場ではますます重要な存在となっている気がします。それだけにぴったり表現されたアイコンというのはクリエイティブや最終的な使い勝手に大きな影響を与えます。今日紹介するのは、少し変わったデザインと学びを表現したアイコンセット「Creativity & Learning Icon Set 」です。
このCreativity & Learning Icon Setは鉛筆だったり虫眼鏡、顕微鏡、三角フラスコ、顕微鏡で見た世界など全部で30のアイコンがまとめられています。
詳しくは以下
文字のストロークの端にある小さな飾りがあるセリフ体フォント。セリフが無い書体と比べると、特徴的な印象が強いのですが、今日紹介するのはキレイ目からPOPまであらゆるセリフ書体を集めた「43 Free Serif Fonts to Dream of」というエントリー。
Butler – FREE FONT on Behance
Licence: Free for private and commercial use
Format: OTF
様々なタッチのセリフフォントが集められており、ライセンスやフォーマットも合わせて明記されています。今日はその中でも気になったフォントを幾つかピックアップしたいと思います。
詳しくは以下
解像度が多様化してきてWEB制作の一つの主流となっているレスポンシブデザイン。多くの場合解像度によって画像を出し分けたり、フォントサイズを可変したりと解像度ごとの処理をしていると思います。今日紹介するのはそんなレスポンシブデザインの精度をより高める、レスポンシブに利用できるフリーアイコンセット「Responsive Office Icons」です。
こちらのアイコンは16px、30px、40px、80pxと4段階で制作されており、さらに素晴らしいのが、単純に大きさを変えているだけでは無くて、大きさによって作りこみ度合いを変え視認性を確保しています。
詳しくは以下
ロゴやバッジなどを制作する際にとても便利なフリーテンプレート素材は多数配布されていますが、たくさんの中からどれを選んでよいか迷ってしまうことも。今回はそんな時に参考にしたい、ヴィンテージ調のロゴデザイン作成に活用できる「15 Free Vintage Logo Template Collections」を紹介したいと思います。
Freebie: 5 Vector Insignias | Every-Tuesday
アンティークな雰囲気を感じることができるロゴテンプレート、いろいろな種類がセットでダウンロードできるようになっています。
詳しくは以下
一口にアイコンといっても、フラットタイプや立体感のあるリアルなタイプなど、いろいろなテイストのものが存在していますが、今回紹介するのは、アウトラインデザインのフリーアイコンセットまとめ「1000+ Free Outline Stroke Icons For Designers」です。
（Dribbble – Free Icon Set by Catalin Fertu）
ラインで描き出されたアイコンセット、いろいろな種類が紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
小気味の良いアニメーションはWEBデザインのアクセントとなり、よりクオリティを高めてくれますが、今回紹介するのはローディングアニメなどに利用できるシンプルなCSSスニペット「SpinKit」です。
このアニメーション画像などは一切利用せずには全てCSSで書かれており、HTMLとCSSを書くだけ簡単に実装することが可能です。
詳しくは以下
国内でも、便利なフレームワークとして一時期から、一気に広まり、様々なWEBサイトで活用されているグリッドレイアウト。今回紹介するのはグリッドをベースにしたWordpressテーマを集めたエントリー。「30 Grid-Based WordPress Themes」です。
スタンダードなものから、組み換えが可能なマルチカラムのものまで、様々なテーマが公開されています。今回はその中から幾つか気になったテーマを紹介したいと思います。
詳しくは以下
モックアップ素材は多く普及しており、使用している方も多いはず。デザイナーにとって重宝できるモックアップ素材ですが、解像度を気にしなくてはならなかったり、新機種が発表されたタイミングなど、中身の入れ替えが面倒な時も。そんなシーンで役立つ、CSSのみを使用してつくられた「Devices.css」を紹介していきたいと思います。
機種も多く収録されており、知っておくと便利に活用することができそうです。
詳しくは以下
デザインをする際に欠かせない素材の一つにもなっているフォント。使い勝手の良いシンプルなタイプ、フォントだけで個性を演出できるものなどいろいろなタイプが存在していますが、今回はデザイン性の高い最新のフリーフォント集「New Free Fonts for 2016」を紹介したいと思います。
デザインに使用するだけで、クオリティを高めることができるフォントが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
デザインに質感や温かみを与えてくれる木目素材。様々なデザインで重宝する素材の一つで、それだけにテクスチャとしてもかなりの数が配布されていますが、今日紹介するのはベクター素材で利用できるリアルな木目テクスチャ「20 Free Vector Pallet Wood Textures」です。
節があるものから、フローリングのようなものまで全部で20のベクターテクスチャが公開されていました。収録されている木目は以下からご覧ください。
詳しくは以下
季節はもうすっかり夏で毎日暑い日が続いていますが、今日紹介するテクスチャは夏らしい季節感を与えてくれるテクスチャ「25 High-Res Beach & Sand Texture Shots (Part 1)」です。
タイヤの後が付いたもの、粗いものからさらさらした感じがするものまで、様々なビーチや砂のテクスチャがまとめられています。実際収録されている画像のサンプルが公開されていましたので下記に貼付けておきます。
詳しくは以下
国内でも人気のコミュニケーションサービスTwitter。今も続々と様々な周辺サービスがリリースされています。話題になっている事も有りTwitterを利用していると言う方も増えてきているのではないでしょうか！?
Twitter単体だけの利用ではなくTwitterとWEBやBLOGを連携していると言う方も多いと思います。今日紹介するのはそんな方にオススメなフリーで使えるTwitterアイコンを集めたエントリ「400+ Beautiful Twitter Icons for your Website」です。
詳しくは以下
WEBで表示されるテキストは、各々のユーザーのフォント環境に左右されるため、システムフォントなどが基本となっていますが、@font-face は、Web ページを製作者がWeb フォントを指定し、フォントを提供。ユーザのコンピュータにインストールしているフォントの数に依存しないテキスト表示が可能な技術ですが、今日紹介するのはそんな@fontfaceで使えるフリーフォント25「25 Free Fonts Perfect for @fontface (Revived)」です。
Dekar Download Page →Freeware License
いくつかのフリーフォントがまとめられていますが、今日はその中から幾つか気になったものをピックアップして紹介したいと思います。
詳しくは以下
今までコメント欄のデザイン集や日付表示のデザイン集をなど部分的なデザイン集を「コメント部分のデザイン集「30 Must See Comment Designs」」や「日付表示のデザイン集と素材集「Gallery Of Date Stamps And Calendars」」と取り上げてきましたが、今日紹介するのもそんな部分的なデザインをひたすら集めたデザイン集「Web Form Design: Modern Solutions and Creative Ideas」です。
こちらのデザイン集はWEB上のフォームのデザインをひたすら紹介するエントリーです。機能的なものなのでなかなかこだわって作る機会が無いのですが、実に様々なフォームデザインが紹介されています。今日は紹介されている中から気になるものもをいくつか紹介したいと思います。
詳しくは以下
