デザインを開発するという視点でお伝えするクリエイティブBLOG
自身のプロフィールやポートフォリオを作成する際に、顔写真を使用することがあると思いますが、中にはちょっと抵抗がある方もいらっしゃるはず。今回はそんな時に活躍してくれそうなカスタムできるイラストジェネレーター「Gentleman Character Generator」を紹介いたします。
さまざまなパーツを組み合わせて、オリジナルの男性の似顔絵を作り上げることができます。
詳しくは以下
グラデーションカラーを取り入れたデザインは、現在の主流トレンドの一つとなっていますが、思うような色合いを作りだすのはなかなか難しいもの。そんな時に参考にしたい「ColorSpace」を今回は紹介したいと思います。
美しいグラデーションを簡単に生成することができるwebジェネレーターです。
詳しくは以下
tableタグやDIVタグを利用して制作するテーブル組、それほど難しい仕組みでは無いのですが、いざ手書きをすると時間を取られたりします。今日紹介するのはHTMLテーブルが直感的に簡単に生成できるWEBジェネレーター「DIV TABLE」です。
利用方法は非常に簡単で、tableタグで生成するかDIVタグで生成するかを選んで、あとはBorder、width、Cell Paddignを設定して、あとは欲しいテーブルサイズを選択すればタグが生成されます。
詳しくは以下
さまざまな種類のソーシャルメディアサービスが存在しており、専用のデザインを制作することも非常に多いかと思います。それぞれのサービスでサイズが違っているため、毎回調べるのが面倒・・そんな時に活躍してくれるwebサービス「Landscape」を今回は紹介します。
ソーシャルメディアのカバーデザイン等を、各SNSの各所サイズに簡単に加工し生成することができる、非常に便利な写真トリミングジェネレーターです。
詳しくは以下
スマートフォンアプリなどのアイコンは、UIの中で目に留まる・またデザイン的に魅力的で分かりやすくすることがとても重要。いつもデザインに苦戦されているというデザイナーの方は少なくないのではないでしょうか？そんな中今回紹介するのは、アプリアイコンを手軽かつハイクオリティに仕上げることができるジェネレーター「App Icon Generator」です。
用意されたベースを組み合わせていくことで、簡単にデザイン性のあるアプリアイコンを作り上げることができます。
詳しくは以下
グラデーションを作り出すのは、簡単なように見えて意外に難しいもの。絶妙な色合いをイメージ通りに表現したい、今回はそんな時に便利なwebジェネレーター「Blend」を紹介したいと思います。
2色のベースカラーを使ってグラデーションを生成できる、シンプルでありながらも使い勝手の良さが魅力のwebサービスとなっています。
詳しくは以下
次世代のコードとして、すでに利用している所も徐々に増えてきたCSS3。従来のCSSと比べて格段に表現できる幅が広がっており、今までどうしても画像を利用したり、FLASHで表現していた部分がCSSのみで実現できるようになっています。今日紹介するのはそんなCSS3を使ったナビゲーション集「15 CSS3 Navigation and Menu Tutorials and Techniques」を紹介したいと思います。
jQuery Style Vertical Menu with CSS3 – No Javascript
様々な表現のCSS3ナビゲーションがまとめられています。今日はその中からいくつか気になったものを紹介したいと思います。
詳しくは以下
WEBで文字にちょっとした変化をつけようと思うと、なかなかHTMLとCSSだけでは難しくて、どうしても画像にしたりFLASHにしたりとしなければいけない場合が多いかと思います。多くの場合は問題はないのですが、利便性などを考慮した場合、テキストのまま処理ができたほうが良かったりもします。今日紹介するのはjQueryで文字に対してかけられる様々なエフェクトを集めたエントリー「20+ Easy to Use jQuery Text Effects and Animations 」です。
グラデーション、影、アニメーションなどなど様々なエフェクトが公開されています。全部で20個のエフェクトが公開されていますが、今日はその中からいくつか気になった物を紹介したいと思います。
詳しくは以下
エラー・許可・着信などなど、優れたユーザーインターフェイスは視覚だけではなくて、直感的にわかりやすい音があり、表示されるユーザーインターフェイスに組み合わせることで、ユーザーがどのようなことをしたかの理解を早めてくれます。今日紹介するのはそんなユーザーインターフェイスの音を、様々なサービス別に集めたWEBサイト「UI Sounds」です。
今までユーザーインターフェイスをまとめて紹介するサイトは多数ありましたが、こうして音に注目したサイトは珍しいと思います。
詳しくは以下
どんどんと新しい素材が登場しており、常にインターネットでチェックされているデザイナーの方も多いかと思います。今回はそんな方におすすめのまとめ「13 Free And Fresh Icons In PSD For Web Designers」を紹介します。
最新のフリーPSD・アイコンがピックアップされており、どれも魅力的なものばかり。気になったものをまずは以下よりご覧ください。
詳しくは以下
架空の動物ドラゴン、また蛇やトカゲなどの爬虫類には、まるでうろこのような皮膚で体が覆われているといった特徴があります。今回はそんな皮膚を表現できるPhotoshopブラシを集めた「A Collection Of Free Scale Brushes For Photoshop」を紹介したいと思います。
Dragon Scale custom brush by KeithSeymour on DeviantArt
ボコボコと美しく並ぶ皮膚の表情を簡単に描き出すことができるブラシが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
アイコンにもさまざまなテイストがあると思いますが、リアルで質感のあるタイプはアイコンとしてだけでなく、グラフィックビジュアルの一部として利用できることも。今回はそんなシーンで活用できる、ハイクオリティなpsdフォーマットのフリーアイコンセット集「15 Fresh & High Quality Free Icon Sets In PSD Format」を紹介したいと思います。
Digital camera icon (PSD) | PSDGraphics
まるで本物のような質感のアイコンが、厳選された数ではありますが、ピックアップされ紹介されています。気になったものを以下よりご覧ください。
詳しくは以下
サイトを構築する際のグラフィカルインターフェイスとして活躍するアイコン。今までDesigndevelopでは様々なフリーアイコンを紹介してきましたが、今回紹介するのは1000種類以上のアイコンを収録したフリーアイコンセット「Fugue Icons」です。
アイコンのデザイン感は統一されて制作されていますので統一して使えばデザインのクオリティは高まるかと思います。コレだけの数が揃っていて種類も豊富なので、どんなサイトでも対応できるはずです。
詳しくは以下
プライスタグやブランドタグをモチーフとした素材、またスペックなどを記載する表は、特にオンラインショップなどのデザイン時に役立ってくれます。そんな中今回は、Photoshopを利用して製作された表現力の豊かなタグと表の素材をまとめた「45 High-Quality and Free Pricing Tags and Tables in PSD」を紹介したいと思います。
素材感を楽しめるクオリティの高いタグと表の素材が、豊富に紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
フォントはデザインに強い影響を与える重要なもの。特にシンプルなデザインにおいては、フォントを変えるだけで雰囲気が大きく異なります。そんな中今回は、Web上に公開されているフリーフォントの中から50個を厳選したまとめ「50 FREE FONTS」を紹介したいと思います。
（Dribbble – Moonshiner: New Free Typeface by Mattox Shuler）
フラットなものからベーシックなもの、印象的なフォントまで、さまざまなシーンに合わせられるクオリティの高い欧文フォントが数多く紹介されています。
詳しくは以下
スマートフォンのメニューデザインの定番と言っても過言ではないハンバーガーボタン。当たり前のように利用されていますが、今回はそんなハンバーガーボタンに関して分析をした考察「Analyzing the Hamburger Menu in Web Design」をご紹介したいと思います。
メニューアイコンとしてなくてはならない存在になっていますが、その反面でハンバーガーボタンのデメリットを考え提唱している、奥深い考察です。
詳しくは以下
