デザインを開発するという視点でお伝えするクリエイティブBLOG
日々進化するデザイン。常に最新のものを情報としても、そして素材でも取得しておきたいもの。そんな中今回紹介するのは、最新のトレンドが随所に反映されたフリーUIキット「H1 / Free Mobile UI Kit for Sketch & Photoshop」です。
デュオトーンやフレッシュなカラーリングが特徴の、非常にクリエイティブ性のあるスマートフォン向けのUIキットとなっています。
詳しくは以下
スマートフォンの幅広い普及によって、UIや動作周りもスマートフォンに最適化されるようになってきました。そんな中今回ご紹介するのは、スマートフォン向けのフォトスライダーの作り方を紹介する「SmartPhoto.js」です。
スマートフォンで大きな写真を楽しめるフォトスライダーで、横スライドタイプのスマートフォンからの閲覧に最適化したギャラリーを簡単に作ることが出来ます。
詳しくは以下
(さらに…)
デザインの成果物を、より良く見せることができるモックアップ。その中でもApple製品のモックアップは普及率の高さから非常に重宝します。そんな中今回ご紹介するのは、フリーで利用できるApple製品モックアップ「8 Free Apple Devices Mockups」です。
8 Free Apple Devices Mockups – Free Design Resources
クリーンな白を基調とした、どんなデザインでも利用しやすいモックアップが8パターンまとめられています。
詳しくは以下
今やスマートフォンアプリにおいて欠かせないアイコンのひとつである、ジェスチャーアイコン。新規ユーザーに使い方を伝えていく上で重要なファクターになっています。今回ご紹介するのはジェスチャーアイコンが15個もまとめられた「15 Free Gesture and Interaction Icon Sets for Mobile App Designers」になります。
100+ Touch Gestures Icons — download free icons by PixelBuddha
このまとめではひとつのアイコンセットに最大100種類収録されているものもあります。いくつか気になったものをピックアップしましたので、以下からご覧ください。
詳しくは以下
インターネット上でフリーで配布されているUIキットは、制作時間の短縮はもちろん、手軽にクオリティを高めることができる便利な素材。今回はそんなUIキットをまとめた「35+ Free UI Kits for Web Designers」を紹介したいと思います。
（Dribbble – Iphone Gold Ui Kit +Free PSD by Tintins）
webやスマートフォンなどに対応したUIキットがたくさん紹介されています。
詳しくは以下
スマートフォンの登場によって今までにない直感的な操作方法が一般的になってきましたが、「ピンチ」や「フリック」と言われてどんな操作方法かすぐに想像がつくという人もいれば、まだなれていなく想像できないという方もいらっしゃると思います。今回紹介するのはそんなスマートフォンの操作を視覚的に伝えることができる、60個のアイコンパック「Flat Gesture Icons Pack」です。
想定される操作のほとんどが収録されていて、これ１つあればどんなシーンでもカバーすることができそうです。
制作に便利なフリーフォント。様々なタイプのフォントが日々公開されていますが、今日紹介するのは比較的最近公開された新しいフリーフォントの中からクオリティの高いフォントを厳選したエントリー「22 Fresh High-Quality Fonts for Your Designs」を紹介したいと思います。
様々なタイプのフォントがまとめられていますが、今日はその中からいくつか気になったものを紹介したいと思います。
詳しくは以下
デザインの媒体問わずに、デザインの中でも重要な要素の一つ、フォント。使うフォント一つで、デザインの全体のイメージにも強く影響を与えます。今日紹介するのはWEBからグラフィックまで様々なシーンで利用出来る最新フリーフォントをまとめた「65 Beautiful Free Fonts for Web and Graphic Designers」。
固めの書体から、柔らかいものまで様々な書体が紹介されています。全部で65個のフォントがまとめられておいますが、今日はその中からDesigndevelopで紹介したことが無いものもピックアップして紹介したいと思います。
詳しくは以下
WEBデザイン制作の必須アイテムとなっているアイコンは、ユーザーにコンテンツをより分かりやすく利用してもらうために、クオリティも高めていきたいもの。そこで今回紹介するのが、比較的最近発表されたクオリティの高いアイコンをまとめた「50 Fresh Icon Sets For Developers And Designers」です。
iCrea by ~draseart on deviantART
シンプルなアイコンから、ディティールにこだわったアイコンまで、さまざまなアイコンが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
テクスチャの中でも、特によく利用する種類として挙げられる紙素材。いろいろな場面で便利に活用することができます。今回はそんな紙テクスチャをまとめた「A Collection Of Awesome And Free Paper Bag Textures」を紹介したいと思います。
Whitewashed Paper Bag by FelixMendoza on DeviantArt
ブラウンカラーをベースとした紙がテーマのテクスチャ素材が紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
スマートフォンデザインのモックアップ、web制作の企画・設計などを行う時、一からパーツのデザインを行っていると時間と手間がかかってしまうもの。今回はそんなシーンに活躍してくれるPSD UIキット「Web and Mobile UI Kits with PSD Files for Designers」を紹介したいと思います。
（Dribbble – Flat UI kit /.PSD Freebie/ by George Vasyagin）
さまざまな箇所に使える多彩な種類のPSDファイルが多数紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
文字のストロークの端にある小さな飾りがあるセリフ体フォント。セリフが無い書体と比べると、特徴的な印象が強いのですが、今日紹介するのはキレイ目からPOPまであらゆるセリフ書体を集めた「43 Free Serif Fonts to Dream of」というエントリー。
Butler – FREE FONT on Behance
Licence: Free for private and commercial use
Format: OTF
様々なタッチのセリフフォントが集められており、ライセンスやフォーマットも合わせて明記されています。今日はその中でも気になったフォントを幾つかピックアップしたいと思います。
詳しくは以下
web制作に欠かせない素材として定番化しているアイコンは、インターネット上でフリーでダウンロードでき、制作しているデザインに合ったものをいろいろと選べるようになっています。そんな中今回紹介するのは、サークル状のフリーアイコンフォント「Iconia」です。
丸みを帯びた可愛らしい印象のアイコンセットが、フォント形式で表示できる便利なアイコンフォントとなっています。
詳しくは以下
今や、多くのwebサイトやグラフィック、アプリケーションのUIはフラットなデザインがメイン。無駄を省いたシンプルな見た目が、使いやすさや見やすさにも大きく影響しているようです。そんな中今回は、フラットテイストなグラフィックフリー素材まとめ「35 Free Flat Graphics and Web Elements for Designers」を紹介したいと思います。
Flat Workspace Illustrations by GraphBerry – Dribbble
フラットな質感であり、さらに高いクオリティやデザイン性を感じさせてくれる素材が揃っています。幾つか気になるものをピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
webサイトを制作する際に頻繁に使用するアイコンですが、一からデザインするには大変な手間と時間がかかってしまうと思います。そこで今回紹介するのは、手書き感とユーモアで親しみやすさを感じるアイコンセット「Steedicons」です。
手書きの素朴な雰囲気の中に、細部へのこだわりを感じるアイコンが数多く展開。300以上のアイコンセット［29ドル］の他に、フリーで利用できるアイコンも一部公開されています。
詳しくは以下
webサイトを制作する際、全体的なデザインの決定も重要ですが、サイト内を自由に動くための動線をしっかりと設計することが、ユーザーを引きつける為にも必要ではないでしょうか？そこで今回は、それぞれのページのドアとなるボタンのデザインに重要な7つの要素を解説した「Common elements used in interface button design」を紹介したいと思います。
（Dribbble – Upload button by kailoon）
的確な解説、さらに実制作に役立つチュートリアも紹介されているので、すぐにボタン作りに活かすことができそうです。
詳しくは以下
