デザインを開発するという視点でお伝えするクリエイティブBLOG
デザイナーにとってテンプレート・モックアップは非常にありがたい存在。デザイナー以外でもディレクションに関わる人であれば完成イメージとして、これらを使用する機会もあるのではないでしょうか。そんな人たちにおすすめできるまとめ「30 Fresh Freebies for Web & Graphic Designers」を今回はご紹介していきます。
Mobile Chat App Design – free download by Claudio Parisi – Dribbble
トレンド感のあるシンプルかつフラットなデザインで表現された完成度の高いテンプレート・モックアップ。下記にいくつかピックアップしているので、チェックしてみてください。
詳しく見る
グラデーションカラーを取り入れたデザインは、現在の主流トレンドの一つとなっていますが、思うような色合いを作りだすのはなかなか難しいもの。そんな時に参考にしたい「ColorSpace」を今回は紹介したいと思います。
美しいグラデーションを簡単に生成することができるwebジェネレーターです。
詳しくは以下
デザイナーは時にリアルなグラフィックを求められることもありますが、いちから作るのは時間も手間もかかるもの。今回はそんな時に、こんなグラフィックコレクションがあったら助かる、といったアイテムがまとまった、フリーグラフィック素材まとめ「A Worth Checking Out Collection Of Free Graphics Files for Designers」の紹介です。
Free PSD : Creative Horizontal CV Resume Template PSD by PSD Freebies – Dribbble
リアルなグラフィックのアイテムはモックアップにも使用できる優れもの。気になったものをいくつかピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
デザインのトレンドの一つであるポリゴングラフィックですが、一から作り上げるのは少々手間がかかるもの。今回ご紹介するのは、そんなポリゴングラフィックをもっと手軽に使いたい…！と言う方におすすめなポリゴングラフィックで動物たちを描いた素材集「Polygonal Animals Set」です。
Polygonal Animals Set — download free vectors by PixelBuddha
美しく丁寧に仕上げられたポリゴングラフィックが全部で20種類揃ったダウンロードフリーの素材集です。
詳しくは以下
(さらに…)
数字などのデータをビジュアルで表現したい時に使用するグラフやチャートはとても便利なグラフィック。いろいろなシーンで活躍してくれますが、今回はそんなグラフやチャートのベクターグラフィックコレクション「Vector Graph & Chart Collection」を紹介したいと思います。
Free Collection of 36 Vector Graphs & Charts
白黒タイプ、またカラータイプの2種類のグラフ・チャートのベクター形式の素材がフリーでダウンロードできるようになっています。
詳しくは以下
デザインのモチーフとして様々なシーンで活躍してくれる地図、地域を表す実質的な使い方以外にもイメージ的に用いることもできる便利なモチーフ。今日紹介するの実用的で、使えそうな地図のベクターデータを集めたエントリー「Extremely Useful Geography Vectors: Maps and Globes」です。
全部で9つのタイプの地図のベクターデータが集められていましたが、今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
アニメの中で使われているフォントは独特な物が多く、印象に残っている物もいくつかあります。そんなアニメの中のフォントを再現した数字フォント「TimeLeap」を紹介したいと思います。
このフォントは劇場版アニメーション「時をかける少女」の時計のカウントの数字を模したものです。
詳しくは以下
昔ながらの雰囲気や、アンティークな雰囲気を演出するデザインを好む方も多いと思いますが、各時代を象徴するデザインテイストを表現するのは、素材探しなどに手間もかかります。そんな中今回紹介するのが、さまざまなデザインテイストに利用しやすい、比較的最近発表されたレトロフォントをまとめた「A New Collection of Retro Fonts」です。
ビンテージな雰囲気のフォントから、時代を象徴するテイストのフォントまで、さまざまなフォントが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
デザイン制作の際に、色合いにニュアンスを出すために使用されるグラデーション。きれいな色の組み合わせが成功するとデザインが一気に魅力的なものに変化することも。今回はそんなシーンで役立てたい、グラデーションを楽しみながらコード取得もできるサイト「uiGradients」を紹介したいと思います。
ひたすらグラデーションを閲覧するといった非常にシンプルなサイトですが、色の濃淡のコード取得ができるなど実用的にも活用できるサイトとなっています。
詳しくは以下
マウスオーバーすると、色が変わったり、様々なアクションが走ったりと、WEBデザインでは多用されるホバーエフェクト。簡単に透明度だけ変えたり、色を変えたりというシンプルなものも良いのですが、一工夫されたホバーエフェクトは上手に使えばサイトの質を向上させてくれます。今日紹介するのはリッチなホバーエフェクトを実現するCSSセット「IMAGE HOVER EFFECTS」です。
画像が拡大されたり、フィルタが掛かったような表現になったり、全部で16ものホバーエフェクトを簡単に実装することが可能です。
詳しくは以下
写真や動画を気軽にシェアしたり、テキストを投稿できるTumblrは、手軽にブログを始められる人気のサービス。フリーのテーマを使えば、既存のブログサービスよりもおしゃれでデザイン性の高いブログを手軽に始めることが可能です。今回ご紹介するのは、そんなブログに最適なおしゃれなフリーのTumblrテーマをまとめた「20+ Best Free Tumblr Themes For Powerful Blogging in 2017」です。
20+ Best Free Tumblr Themes For Powerful Blogging in 2017
ブログのデザインにもこだわりたいと言う方にぴったりな、ハイクオリティなTumblrテーマが20種類まとめられています。その中から幾つか、気に入ったものをピックアップしましたのでご覧ください。
詳しくは以下
HTMLに装飾を加えるためのCSSは、2011年頃から登場したCSS3によって表現力が劇的に向上。しかし、新しい機能や表現方法をフル活用できていないという方もいらっしゃるのではないでしょうか？そんな中今回紹介するのが、CSS3で立体的なボタンを表現するチュートリアルをまとめた「40 CSS3 Animated Button Tutorials And Experiments」です。
（CSS Buttons with Pseudo-elements | Codrops）
シンプルなボタンはもちろん、デザインソフトでの制作でも時間がかかりそうなリアリティのあるボタンまで、多彩なCSSデザインが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
WEBサイトを制作する際とても便利なのがテンプレート。はじめからある程度組まれていますので、そのまま使う事もできますし、作りだけは引き継いでデザインのカスタマイズも可能です。様々なテンプレートが国内外展開していますが、今日紹介するのはクリエイティブで美しいフリーCSSWEBテンプレート9選「9 Beautiful Free CSS Web Templates」を紹介したいと思います。
Portfolio Template 1 download – demo
ポートフォリオから、ポータルサイト系、コーポレートサイトまで様々なジャンルのクリエイティブなCSSWEBテンプレートが公開されています。今日はその中から気になったものをいくつか紹介したいと思います。
詳しくは以下
