デザインを開発するという視点でお伝えするクリエイティブBLOG
テクスチャの中でも布素材は、定番として幅広く活用できるジャンルとしてかなり重宝されています。そんな中今回紹介するのは、リネン素材のテクスチャ「30 Linen Textures for Photoshop Layering」です。
（Fabric linen by *jaqx-textures on deviantART）
シンプルなタイプはもちろん、質感に特徴のあるものや柄が入ったデザイン性のあるものまで、たくさんのリネン素材テクスチャがまとめられています。気になったものをピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
グラフィックを制作する際には、イラストや写真だけでなく、デザインに盛り込むテキストを加工しデザインする事も多いかと思います。しかしテキストは素材として最初からデザインがされている訳ではなく、加工のアイデアが生まれないと悩む事も多いはず。そこで今回は、クリエイティブなテキストデザインのチュートリアルを紹介した「25 Photoshop Text Tutorials」を紹介したいと思います。
テキストをさまざまな形で加工したデザイン例が25種類公開されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
webサイトを制作する際に頻繁に使用するアイコンですが、一からデザインするには大変な手間と時間がかかってしまうと思います。そこで今回紹介するのは、手書き感とユーモアで親しみやすさを感じるアイコンセット「Steedicons」です。
手書きの素朴な雰囲気の中に、細部へのこだわりを感じるアイコンが数多く展開。300以上のアイコンセット［29ドル］の他に、フリーで利用できるアイコンも一部公開されています。
詳しくは以下
webデザインを手がける際に必要となる要素の一つ「カラーリング」。メインとなる背景部分などは、デザインの雰囲気を左右する重要な部分でもあるため、色選びには特に慎重になるのではないでしょうか。そんな中今回は、パープルを使用したwebデザイン事例「Examples of Purple in Web Design」を紹介したいと思います。
（tapmates）
落ち着いた・大人っぽい印象のパープルを上手く使い、洗練されたwebサイトを創り上げています。中でも特に気になった事例をピックアップしましたので、以下よりご覧ください。
詳しくは以下
webサイトを制作する際、全体的なデザインの決定も重要ですが、サイト内を自由に動くための動線をしっかりと設計することが、ユーザーを引きつける為にも必要ではないでしょうか？そこで今回は、それぞれのページのドアとなるボタンのデザインに重要な7つの要素を解説した「Common elements used in interface button design」を紹介したいと思います。
（Dribbble – Upload button by kailoon）
的確な解説、さらに実制作に役立つチュートリアも紹介されているので、すぐにボタン作りに活かすことができそうです。
詳しくは以下
ネットサーフィンをしていると、表現力の優れたサイトに立ち寄ることが多くなると思います。それは表現力に優れたサイトは、クリエイティブ性やユーザビリティへの配慮が行き届いており、過ごしやすい空間になっているからではないでしょうか？そこで今回は、シンプルな表現の中に優れたwebサイトの特徴が詰まっているwebサイトデザインまとめ「Best Minimal Web Design I Recently Bookmarked」を紹介したいと思います。
Minimal-Web-Design-Inspiration
シンプルな構成の中に、行き届いた細部へのこだわりを感じるwebサイトが多数紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
高機能なサイトを作りたいけど、一からプログラムを組むのはちょっと…という方に向けて、今回は2013年で人気をあつめたプラグインを50種集めたエントリー「50 Most Useful jQuery Plugins from 2013」を紹介したいと思います。
Salvattore — A jQuery Masonry alternative with CSS-driven configuration
レスポンシブサイトに向けたものを中心に、様々なジャンルのプラグインが紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
Jresponsive
レスポンシブなグリッドレイアウトが実現できるプラグイン。ウインドウサイズに合わせて要素の幅を縮小したり、１行あたりの表示数を変更することができます。
FlowType.JS — Responsive web typography at its finest: font-size and line-height based on element width.
ウインドウサイズに合わせて自動的にfont-sizeとline-heightを調整してくれるプラグイン。１行あたりの文字数を調整できるので、読み易いコンテンツに出来そうです。
jQuery Selectric
htmlのselectボックスを装飾してくれるプラグイン。選択時にプログラムを実行できたりもするようで、高機能なselectボックスを実装したい時に重宝しそうです。
こうしてポピュラーなプラグインを一堂に集めると、2013年のWebの動向が見えてきますね。ここで紹介されているものを導入するだけでも、最新のトレンドに近づけていくことができるのではないでしょうか。
先日発表・リリースされたiPhone6。従来のiPhoneよりもサイズが大きくなるなど、新しい進化を遂げています。そんな中今回は、すでに多数公開されているiPhone6用モックアップ素材まとめ「50 Free iPhone 6 and iPhone 6 Plus Mockups (PSD, AI & Sketch)」を紹介したいと思います。
[FREEBIE] iPhone6 Flat Mockup by Rasvob on deviantART
リリースから間もないにも関わらず、いろいろな種類のモックアップがリリースされています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
webサイトを制作する際、全体的なデザインの決定も重要ですが、サイト内を自由に動くための動線をしっかりと設計することが、ユーザーを引きつける為にも必要ではないでしょうか？そこで今回は、それぞれのページのドアとなるボタンのデザインに重要な7つの要素を解説した「Common elements used in interface button design」を紹介したいと思います。
（Dribbble – Upload button by kailoon）
的確な解説、さらに実制作に役立つチュートリアも紹介されているので、すぐにボタン作りに活かすことができそうです。
詳しくは以下
写真を利用する時、撮影されたまま利用するという事はソフトウェアが発達してきた現在まずありませんが、今日紹介するのはレタッチソフトでは無く、CSSで実現するイメージフェクト「20 Image Effects With CSS」です。
水彩風から、黒板に書いた風のエッジを検出したものエアブラシで書いたものなどなど、全部で20ものエフェクトがCSSで指定するだけで簡単にエフェクトを利用することが可能です。
詳しくは以下
webサイトの制作時に、フリーで使用できるHTMLテンプレートがあると非常に作業効率がよくなり、さらに手軽にデザインクオリティも高めることができます。今回はそんなフリーHTMLテンプレート集「20 Fresh & Free HTML Templates」を紹介したいと思います。
シンプルテイストなデザインを中心に、現在のwebトレンドをしっかりと抑えたデザイン性のあるテンプレートがまとめられています。
詳しくは以下
立体的で少し光沢感のあるクオリティの高いアイコンの素材をベクターデータで公開しているのが今回紹介する「90 Free Vector Icons Set」です。こちらは前回「車のベクター素材の決定版！6000車種のベクターデータを収録した「6000 vector Cars」」と言う記事で紹介した、車の立面図のベクターデータを制作した方と同じ制作者さんです。
90 Free Vector Icons Setから一部抜粋
アイコンイメージは「工事中」「カレンダー」「虫眼鏡」などなどWEBやIT系に使えそうな物を中心に90種類物アイコンセットがフリーで公開されています。
詳しくは以下
photoshop CA5が発売されてから間もなく一年が経ちますが、新機能をフル活用できていないとお悩みの方も多いのではないでしょうか？そこで今回はphotoshopCS5の機能を駆使したチュートリアルまとめ「20 Photoshop CS5 Tutorials」を紹介したいと思います。
（Quick HDR Effect Photoshop CS5 Tutorial）
写真加工技術から新たな3D機能まで、さまざまなチュートリアルが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
webデザインの必須アイテムであるアイコンは、フリーでもさまざまな展開がされており、利用されている方も多いと思います。そんな中今回紹介するのは、クオリティが高く、画像サイズにも余裕のあるアイコンセットをまとめた「40 Big and Highly Detailed Free Icon Sets to Improve Your Designs」です。
立体感のある手の込んだアイコンが豊富に紹介されています。中でも特に気になったものをピックアップしてみましたので、以下よりご覧ください。
詳しくは以下
デザインアイコンには非常にさまざまな種類が存在しており、利用するデザインに合わせて選定することが必要となってきます。そんな中今回紹介するのは、レトロテイストのデザインアイコンセット「36 Retro Multimedia Icons」です。
レトロなデザインにぴったりマッチするデザインアイコンが36種セットになってダウンロードできるようになっています。
詳しくは以下
アイコンは意味を伝えるために欠かせないアイテムです。説明文ではなくイラストを用いることで理解もしやすくなるので、Webサイトなどでは多く使われています。そんな中今回は、150種類以上の可愛らしいベクターアイコンがセットになった「150+ Free Vector Icons for Web, iOS and Android Apps UI Desgin」です。
150種類以上の豊富なアイコンが3パターンのカラー展開された、汎用性の高いアイテムです。
詳しくは以下
