デザインを開発するという視点でお伝えするクリエイティブBLOG
Photoshopの加工技術はどんどんと進化を続けており、そのPhotohopで作られたPSD素材も、ハイクオリティなものが多数配布されるようになっています。そんな中今回は、さまざまな種類のフリーPSDファイルをまとめた「27 New Useful Free Photoshop PSD Files for Amazing UI/UX」を紹介したいと思います。
Bricks – 38 Psd Cards for Flowcharts by Volodymyr Kurbatov – Dribbble
UIやアイコン、テンプレートなど、非常にたくさんのPSD素材がまとめられています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
自分の手で書いたようなアナログテイストな質感が演出できるハンドドローイングフォント。デザインに抜け感などを出したい時にも活用されます。そんな中今回は、フリー配布のハンドドローイングフォント20選「20 Beautiful and Free Hand-Drawn Fonts」を紹介したいと思います。
Thirsty Dog free typeface on Behance
一口にハンドドローイングフォントといっても、いろいろなテイストのものが揃っています。気になったものをピックアップしましたので下記よりご覧ください。
詳しくは以下
制作物に加えることで質感やクオリティを与えてくれるテクスチャ素材。その中でも定番なのがグランジテクスチャ。風合いやアナログ感など制作物のクオリティをグッと引き上げてくれます。今日紹介するのはベクターで利用できるグランジテクスチャ「Free Vector Grunge Textures」です。
このグランジ素材は全部で木製、メタルなどなどのテクスチャがセットになっています。収録されているテクスチャは以下からご覧ください。
詳しくは以下
WEBサイトの大きなカテゴリの一つEコマース。国内でも多くのECサイトが立ち上がり、販売していますが、そこで必要なユーザーインターフェイスはまた情報を伝えるだけのWEBサイトとは異なります。今日紹介するのはECサイトのユーザーインターフェイスを豊かにしてくれるECサイトのためのフラット&ストロークアイコンセット「The Flat & Stroke eCommerce Icon Set」です。
全部で50種類ものアイコンがセットとなっており、2色で表現されたものと、線のみで描かれた2種類のアイコンが収録されています。
詳しくは以下
WEBデザインのトレンドの推移は早く、年々あらたなトレンドが生まれては消えていきますが、今日紹介するのはUIデザインのベースにできるシンプルなUIフリーサンプル「Ease UI Component Free Sample」です。
非常にシンプルでスタイリッシュなデザインでブログ、メディア、フォーム、Eコマース、ベースパーツなどなど様々なユーザーインターフェースのパーツが収録されています。
詳しくは以下
ECサイトからプロダクトランディングページまで物を売るためには様々なページが必要ですが、その中から決済画面、プライスページ、プロダクトページ、ストアページと大きくカテゴライズしてデザインを収集している、物を売るために参考になるWEBデザイン集を今回紹介したいと思います。
それぞれのカテゴリに特化して、デザインが集められており、スクリーンショットもフッターまでで取得しているため、サイト上でも全てを参照することが可能です。
詳しくは以下
webデザインの素材の定番・アイコン。小さなイラストでありながら、機能や意味を簡単にビジュアルで表現できるため、非常に重宝されています。今回はそんなアイコンの最新まとめ「40+ Fresh and Flat Icon Sets for May 2014」を紹介したいと思います。
（75 Slim Weather and Climate Icons – GraphicLoads）
ベーシックなものはもちろん、ちょっと変わったものまで、いろいろな種類が揃っています。気になったものをピックアップしましたので下記よりご覧ください。
詳しくは以下
アイコンには、主流のフラットデザインから、立体感のあるリアルなテイストまで、さまざまなデザインのものが存在していますが、今回紹介するのは、デザイン性の高い種類が揃ったアイコンセットまとめ「38 Fresh and Modern Icon Sets」です。
いろいろなテイストで制作された、多彩なテーマのアイコンが揃っています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
進化し続けるWEBの表現。最近はアニメーションで見せるWEBも非常に多くなってきました。今回紹介するのは、軽量で表現力の高いHTML5 Canvasで表現するアニメーション背景「Ambient Canvas Backgrounds」です。
基本的にはjavascrptで制御しており、座標やカラーなどを簡単に調整できるようになっています。全部で5つのアニメーションがセットされていますがいくつか気になったものを紹介したいと思います。
詳しくは以下
WEB制作には欠かすことができない、アイコン。デザインのクオリティアップ。ユーザーインターフェースの向上など、様々な効果を与えてくれます。今日紹介するのは、シンプルでピクトグラムライクなフリーアイコンセット「Icons8」です。
収録されているアイコンは全部で153個「KITCHHEN Set 」、「Coins」「Transport Set」などなどジャンルを問わず収められています。収録されているアイコンがまとめられていますのでWEB制作だけにはとどまらない使い方ができそうです。
詳しくは以下
さまざまな種類のフォントが日々リリースされていますが、。今回紹介するのはクリエイティブなフリーフォント集「40 Beautiful Free Fonts For Creating Attractive Typography Headlines」というエントリー。
全部で４０のフォントがまとめられていましたが、その中からシンプルで使いやすいタイプのフォントを中心にいくつピックアップして紹介したいと思います。
詳しくは以下
フリーのテーマを利用することで、1からの構築作業時間を短縮できるとともに、さまざまな機能などを同時に手に入れることができます。仕事の種類によって使い分けるととても便利です。今回はそんなシーンに利用したい、11種のHTML5&wordpressフリーテーマ集「11 Free Fresh HTML5 & Responsive WordPress Themes」を紹介したいと思います。
WordPress › Radcliffe « Free WordPress Themes
フリーで利用できる、比較的シンプルな構造のテーマが11種、厳選され紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
WEBに動きをつけたり、制御したりとWEB上ではなにかと便利なjavascript。ライブラリやプラグインも充実していて、それを利用した様々なテクニックが公開されていますが、今日紹介するのはjavascriptは一切使わず、CSSのみで、様々な表現に挑戦しているTipsを集めたエントリー「30 Pure CSS Alternatives to Javascript」です。
30 Pure CSS Alternatives to Javascript
スライダーやライトボックスをはじめ、javascriptを使って行われているような事をCSSのみで再現しています。全部で30のプロジェクトがまとめられていますが、今日はその中からいくつか気になったものを紹介したいと思います。
詳しくは以下
photoshopを使った立体的で光沢感のあるボタンのチュートリアル「Creating A Glossy 3D Button」を紹介したいと思います。
ただ単に少し立体にしたと言う程度ではなく、光沢という質感もしっかりと表現されていて、クオリティの高いボタンになっています。
詳しくは以下
photoshopで背景を作り込む時に便利なパターン素材。キャンパスのサイズに応じてパターンを展開できるかなり便利なものです。今日紹介するのはレトロ、幻想的、シンプルなどといった、様々テイストのphotoshopパターンを集めたエントリー「200+ free beautiful Photoshop patterns」を紹介したいと思います。
今日は今までDesigndevelopで紹介した事が無いもののなかからいくつかピックアップして紹介したいと思います。
詳しくは以下から
デザインが施された内容のメールは、通常のメールよりも目を惹き、内容への注目度を高めてくれる効果があると思います。そこで今回紹介するのは、HTMLメールのデザインテンプレート集「Free HTML Newsletter Templates」です。
（100+ free HTML email templates | Campaign Monitor）
さまざまなテイストのテンプレートが多数収録されており、好みや目的に合わせて使い分けることができそうです。中でも気になったタイプのテンプレートをピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
