デザインを開発するという視点でお伝えするクリエイティブBLOG
WEBデザインならではのエフェクトは、私たちの目を楽しませてくれたり、あっと驚かせてくれたりします。今回ご紹介する「WebGL Distortion Hover Effects | Codrops」は、WEBの中でもよく目にするホバーアクションのエフェクト集になります。
歪みの効果を与え、滑らかに動くスタイリッシュなホバーアクションです。
詳しくは以下
予約フォームや等で、weｂサイトで日付の選択を行う機会は意外に多いもの。だからこそ、ユーザーの使いやすさを意識したUIの工夫が必要となってきます。そんな中、今回ご紹介する「10 Free Open Source Date Picker Plugins」は、日付選択のプラグインが集められたまとめです。
使いやすさや、見やすいデザインが考慮された日付ピッカーのプラグインがまとめられています。
詳しくは以下
Web技術は日々めまぐるしく進化しており、一日経てばどこかで新しいものが生まれている世界。忙しい毎日の中で新しいものを追いインプットし続けることはとても大変ですが、そんな時だからこそ是非参考にしたいまとめ「Fresh Resource for Web Developers – April 2017」を今回は紹介したいと思います。
mini.css – Minimal, responsive, style-agnostic CSS framework
役に立つアプリケーションからデザインパターンの参考まで、非常に便利なツールの数々が紹介されています。いくつか気になったものをピックアップいたしましたので、下記よりご覧下さい。
詳しくは以下
国内で一般的なWEBページの構造を思い浮かべるとしたら皆さんはどんなものを思い浮かべるでしょうか？スタンダードな例として、ページが複数ページがあってそれをグローバルナビゲーションでまとめているといった作りがあります。今日紹介する「41 Sleek Single Page Websites」は先ほどあげたスタンダードな例ではなくて、すべてのコンテンツを１枚のページに集約したWEBの構成をとっているWEBページを集めたエントリーです。
まとめているからと言って、コンテンツが充実していないという訳ではなく、機能的には問題ない形で１ページに落とし込んでいます。今回はいくつか収録されているもののなかから気になったものをいくつかピックアップして紹介したいと思います。
詳しくは以下
花柄やドット、幾何学図形などの画面を華やかに見せてくれるパターン素材は、デザインのワンポイントやアクセントなど利用する場面も多いもの。今回ご紹介するのは、そんなデザインに大活躍のパターン素材をまとめた、幾何学模様パターン素材まとめ「10 Free Geometric Pattern Swatches in AI, PAT & PNG Format」です。
シームレスな幾何学模様素材が10種類も揃う、大変使いやすいパターン素材セットです。
詳しくは以下
(続きを読む…)
現在主流となっているフラットテイストのデザイン。その流行に合わせて、配布される素材も対応したデザインのものが非常にたくさん見られます。そんな中今回紹介するのは、主流のフラットデザインに対応したアート系ツールのベクターアイコンセット「Flat Vector Art Tools Icon Set」です。
アート系の作業で使用する道具等がアイコン化されており、セットでダウンロードできるようになっています。
詳しくは以下
制作にとても便利な紙の表現。無機質なデザインに質感や暖かみを与えてくれます。便利だけあって、背景素材は多数公開されていて、クオリティの高いテクスチャも多いのですが、今回紹介するのは紙の表現を可能にするphotoshopブラシを集めたエントリー「A Collection of Photoshop Paper Brushes for Your Next Design」を紹介したいと思います。
破れだったり、表面の質感だったりと様々な紙を表現んするブラシセットが集められています。テクスチャでは実現できなかった部分もブラシであれば自分で加工していけるので色々と表現の幅も広がるかと思います。今日はその中からいくつかきになったものをピックアップして紹介したいと思います。
詳しくは以下
Photoshopを使った写真加工は、いろいろな素材やパーツを組み合わせることで、無限の表現を可能にしてくれます。そんな中今日は、Photoshopの合成で創り出す空想世界チュートリアル集「30 Breathtaking Surreal Photoshop Tutorials」を紹介したいと思います。
（Create a Surreal Turtle Image – Photoshop Tutorial – Pxleyes.com）
幻想的な雰囲気のビジュアルをどのように表現したのか、詳しく解説されています。写真加工の技術はもちろん、組み合わせた写真同士のなじませ方、光の入れ方など、勉強になるものばかりです。
詳しくは以下
文字を美しくグラフィカルに表現するタイポグラフィを上手に表現する手段は、デザイナーであれば高めておきたいもの。今回ご紹介するのは、そんなタイポグラフィを制作する際に参考になる作品をまとめた「34 Remarkable Lettering and Typography Designs for Inspiration」です。
Good Lettering and Typography Designs | Typography | Graphic Design Junction
サイトではインスピレーションを得るのに役立つ、最新のハイクオリティなタイポグラフィが34作品紹介されています。更にその中からおすすめの作品を幾つかピックアップしましたのでご覧ください。
詳しくは以下
(続きを読む…)
エコや環境系のイメージ、または優しい自然のイメージなどを彷彿させる葉。今日紹介するのは無料で利用できる葉のテクスチャを集めたセット「10 High-Quality Free Leaf Textures」です。
テクスチャセットはFlickrで公開されていましたので、下記に収録されているテクスチャのスライドショーを貼付けておきます。
詳しくは以下
ネットサーフィンをしていると、表現力の優れたサイトに立ち寄ることが多くなると思います。それは表現力に優れたサイトは、クリエイティブ性やユーザビリティへの配慮が行き届いており、過ごしやすい空間になっているからではないでしょうか？そこで今回は、シンプルな表現の中に優れたwebサイトの特徴が詰まっているwebサイトデザインまとめ「Best Minimal Web Design I Recently Bookmarked」を紹介したいと思います。
Minimal-Web-Design-Inspiration
シンプルな構成の中に、行き届いた細部へのこだわりを感じるwebサイトが多数紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
webデザインを制作する際に素材として頻繁に利用されるアイコン。種類豊富にストックしておくことで、表現の幅がぐんと広がります。そんな中今回は、フラットなベクターアイコンセットをまとめた「Free PSD Icons: 26 Sets Of Flat Vector Icons for Designers」を紹介したいと思います。
（Free Flat Icons Pack on Behance）
定番として使えるタイプから、ちょっと個性的なテーマのものまで、さまざまなアイコンセットが紹介されています。
詳しくは以下
インターネットやスマートフォン・タブレットなどの各種媒体のデザインにおいて、欠かすことのできない存在となっているアイコン。限られたスペースであっても、イラストによって手軽に意味を表現できる存在として重宝されています。そんな中今回紹介するのは、web・モバイルサイト制作に活躍するアイコンセットをまとめた「30 Free Web and Mobile Icon Sets from 2014」です。
（Download 100 Free Line-Style Icons | Elegant Themes Blog）
たくさんの種類のアイコンが紹介されており、ストックしておくことで便利に利用することができるようになっています。
詳しくは以下
