デザインを開発するという視点でお伝えするクリエイティブBLOG
現在、主流となっているフラット系のwebデザイン。シンプルなだけに、色使いや全体のバランス、サイト全体の構成などが、とても重要な要素となってきます。今回はそんなフラット系デザインを制作する際の参考にしたいwebまとめサイト「Flat UI Design」を紹介したいと思います。
現在公開されている海外のwebサイトの中で、フラットデザインを取り入れたものが多数まとめられています。気になったサイトをピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
インターネット上で、画像や動画、記事などを手軽にブッキングできるサービスとして利用している方も多い「Tumblr」は、豊富なテーマの中から自分のサイトイメージにぴったりなテーマを手軽に選べるというのも、嬉しいポイントの一つではないでしょうか？今回はそんなTumblrテーマの中から特にスタイリッシュな雰囲気のテーマをまとめた「25+ Cool Tumblr Themes – Want A Stylish Tumblog?」を紹介したいと思います。
Blogging – Mason – A Masonry Inspired Tumblr Theme | ThemeForest
シンプルなテーマはもちろん、Tumblrの仕様に合わせて選びやすいテーマが多数紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
究極なシンプルをテーマにデザインされるミニマルデザインサイト。要素が限られるだけに、バランスやどんな要素やグラフィックを取り入れるのかがとても重要になってくる、ある意味難しい種類のデザインでもあります。今回はそんなミニマルサイトをデザインする際に是非参考にしたいインスピレーション30「30 Beautiful Minimalist Web Designs」を紹介したいと思います。
シンプルかつクオリティの高さを感じさせるデザイン事例30種がまとめられています。
詳しくは以下
自身で制作した作品をまとめて掲載し紹介するポートフォリオサイトは、掲載する作品だけでなく、ベースとなるサイトのデザインにもこだわりたいものです。今回はそんな時に役立つ、デザイン性の高いポートフォリオサイトのインスピレーション集「200 Portfolio Sites for Web Design Inspiration」を紹介したいと思います。
作品をより良く見せてくれるデザインのポートフォリオサイトデザイン例が多数紹介されています。気になったものをピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
webデザインを一から制作し、完成までたどり着くためのには、多くの時間が必要。しかし納期が短いといった状況も少なからずあるため、できるだけ効率良く、それでいて高いクオリティのものをアップさせたいものです。今回はそんな時に便利なテンプレート「20 High-Quality Free PSD Templates」を紹介したいと思います。
（GraphicsFuel.com | Cafe & restaurant website PSD template）
レイアウトやテイストなど、イメージしているデザインに近いものを選べば、制作の作業スピードを上げながら、思い通りのwebサイトを作り上げることができそうです。いくつか気になるものをピックアップしてみましたので、下記よりご覧下さい。
黒や茶色などのダークな色合いは、暗い印象を与えてしまうのではないかと懸念される方も多いと思います。今回は、ダークな配色を使いながら、美しさを感じられるwebデザインをまとめた「30 Beautiful Dark Web Designs for Inspiration」を紹介したいと思います。
（Dark Web Designs for Inspiration 15）
色の使い方にこだわった、デザイン性の高いサイトばかりが紹介されています。中でも気になったものをいくつくかピックアップしましたので、下記よりご覧ください。
詳しくは以下
デザインをして行く中で、ちょっとしたアクセントを付けたい時に便利なのが、装飾形のベクターデータ。今回紹介するのは飾りに使えるベクターデータを集めたまとめエントリー「Vector Butterflies and Floral Ornaments」です。
様々な種類のベクターデータのいくつかのセットで分けられ、まとめてダウンロードできるようになっています。
詳しくは以下
デザイン上で非常に重要な役割を持つテキスト。内容やフォント選びも重要ですが、イメージに合った加工が必要な場合もでてくると思います。しかしなかなかイメージどおりの表現をどうやって作ったらよいか？技術的な面で苦労してしまうことも多いもの。今回はそんな時参考にしたいチュートリアルまとめ「50 Best Text Effect Tutorials」を紹介したいと思います。
Create a Glowing Liquid Text with Water Splash Effect in Photoshop – PSD Vault
テキストをグラフィカルかつより魅力的に見せてくれる、ハイセンスなチュートリアルがまとめられています。
詳しくは以下
デザインにレトロ感を演出したい時は、ヴィンテージテイストのフォントを取り入れることでより雰囲気を強く表現できると思います。そんな中今回紹介するのは、ヴィンテージ調のデザインフォントまとめ「30 Vintage Fonts Perfect for Retro Style Design」です。
Caslon Antique font by Alan Carr – FontSpace
ヴィンテージな質感のデザインフォントがまとめられています。中でも気になったものをピックアップしましたので、下記より御覧ください。
詳しくは以下
さまざまな種類がフリーでダウンロードできるようになっているアイコン。種類も豊富で、いろんなデザインに使用できるとあって、重宝する素材の一つではないでしょうか？そんな中今回紹介するのは、シンプルテイストのデザインにぴったりなアウトラインアイコンセット「260+ Free Outline Icons For Designers」です。
アウトラインタイプのアイコンが260種揃った、便利に利用できるアイコンセットとなっています。
詳しくは以下
手書きフォント、文字には整ったラインを持ち、キレイに作られたフォントには無い魅力があります。今日紹介するのはアナログ感溢れる手書きフォントを集めたエントリー「 10 sketchy fonts for web designers 」です。
エントリーには全部で10個の手書きフォントが紹介されていますが、今日はその中から特に気になったフォントをいくつかピックアップして紹介したいと思います。
詳しくは以下
デザイン制作で使用するテクスチャの中でも特に利用する機会の多い、木をモチーフにしたテクスチャ。毎回同じようなタイプを選んでしまい、デザインがワンパターン化しがちな方も多いのでは？今回はそんなシーンに是非利用したい、木のさまざまな質感を表現できるテクスチャまとめ「30 High Quality Painted Wood Texture for your Nature-Related Designs」を紹介したいと思います。
（Cracked Yellow Painted Wood by ~texturejunky on deviantART）
定番として利用できるタイプから、個性的でアレンジを加えたい時におすすめなものまで、たくさんの種類はまとめられています。気になったものをピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
現在のタスクがどれだけ進行しているかを視覚的に表示してくれるプログレスバー。webサイトの読み込みやダウンロード状況などを知る際には欠かすことができない存在となっています。今回はそんなプログレスバーのフリーで使用できるものを集めた「26 Free Progress Bar Interface PSDs」を紹介したいと思います。
Eye Candy Percentage Bar PSD Freebie | The Finished Box
デザイン演出がされていないことが多いプログレスバーをグラフィカルに表現したpsd素材がまとめられています。
詳しくは以下
Photoshopを利用することで、リアルであったり、自分ではなかなか描き出せないようなグラフィック表現も実現させることができます。そんな中今回紹介するのは、ハイクオリティなグラフィック描写を表現できるphotoshopチュートリアルまとめ「26 New Photoshop Tutorials to Improving Your Photoshop Skills」です。
Create This Dark Matte Landscape Composite in Photoshop – Photoshop Tutorials
まるで映画のポスターのようにリアリティのある表現から写真加工まで、さまざまな種類のチュートリアルが紹介されています。
詳しくは以下
使いやすさや分かりやすさが重要なWebサイトはデザインだけではなく、一つひとつのアクションにもこだわって作られています。そんな中今回は、ユニークなアニメーションアンダーライン「10 Unique Animated Underline Text Effects with CSS」を紹介したいと思います。
アンダーラインといってもその種類は様々。さまざまなアニメーションパターンがまとめられています。いくつか紹介されている中から気になったものをピックアップしてみました。
詳しくは以下
背景と一口に言ってもWEBサイトだったり、パワー歩員のだったり、ブログだったりと使い道は様々ですが、今日紹介する「Free Backgrounds and Textures」背景画像やテクスチャの背景を様々な方法で探すことができるWEBサイトです。
登録されている背景はジャンル別、色別、人気別、タグクラウドなどで分類されていて、細かく分類されていますので非常に探しやすくなっています。もちろんサイト内検索もあります。
詳しくは以下
