デザインを開発するという視点でお伝えするクリエイティブBLOG
iPhoneに関わるプロダクトのプレゼンテーションには欠かせないモックアップ。次々と新しいバージョンが出ているにも関わらず、古いモックアップを使用していると、魅力も半減してしまうのではないでしょうか。そんな中今回ご紹介する「40+ Free iPhone 7 / 6S / 6 Mockups & Graphic Design Resources」は、最新機種でまとめられており、プロダクトの魅力を引き上げてくれるモックアップまとめです。
iPhone 7 Case Mockup by Radowan Nakif Rehan – Dribbble
40個ほど、最新機種を中心としたモックアップ素材が揃っています。気になるものをいくつかピックアップしていますので、下記よりご覧下さい。
詳しくは以下
デザインの提案をする際に役に立つのがモックアップ。不確実なものを実際のイメージに近い形で表現しながらデザインを確認できるので、イメージが明確になり、プレゼンテーションの手法としてはとても便利です。今回紹介するのは、レスポンシブデザインをプレゼンテーションするのに便利なモックアップ「15+ Mockups to Showcase Your Responsive Web Designs」です。
Showcase Website Header Mockup | MockupWorld
実際のPCにはめたものワイヤーフレーム上のものなど、様々な段階・用途に合わせて使用できるモックアップまとめられています。今回ははいくつか気になったものをピックアップしましたので以下からご覧ください。
詳しくは以下
ブランドイメージとして様々なシーンに展開されるロゴ。クライアントにデザインを見せる際には、ロゴがどういう風に展開されていくのかを伝えるための手段の一つとしてモックアップに反映されてプレゼンテーションする場合があります。今回はそんな場面で役に立つロゴデザインのモックアップまとめ「20 Free PSD Templates To Mockup Your Logo Designs」をご紹介したいと思います。
Embroidered Logo MockUp | GraphicBurger
全部で20ものバリエーション豊かなモックアップがまとめられておりますが、その中から気になるものをいくつかピックアップ致しましたので下記よりご覧ください。
詳しくは以下
デザインの反映をよりリアルに見せることができるモックアップは、とても重要な役割を果たしてくれます。データ上で見ているだけではイメージしづらいものを形にしてくれる、そんなフリーのモックアップテンプレート集「Free PSD Mockup Templates (30 Fresh Mock-ups)」を今回は紹介します。
Corporate Identity Mockup – free psd on Behance
30種類のさまさまなアイテムのモックアップが集約されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
Webデザインを行う際は、レスポンシブによる見栄えやUI設計への考慮など、さまざまな箇所に気を配らなくてはなりません。UIは日々進化しており、ユーザーが快適な使用ができるようにきちんと追いついていきたいもの。そんな方におすすめの、最新のUIキットなどがまとめられた「12 Freebies & Goodies For Web Designers」を今回は紹介します。
モックアップやWordPressのテンプレート、フォントなどがまとめられています。気になったものをいくつかピックアップしているので、下記よりご覧ください。
詳しくは以下
優れたUIデザインをスピーディ制作することがほとんどの場合望まれますが、中には時間がなくて制作できないことも。そんな時に多種多様のデザインテンプレートが手元にあれば非常に便利です。今回はそんなシーンで参考にしたい、探す手間をなくすことに役立つ最新UIデザインまとめ「New Web & Graphic Design Freebies : 28 Resources」を紹介します。
Free E-Commerce Apps – part 05 by Haxon – Dribbble
アイコンからフォント、モックアップまで幅広くまとめられています。気になったものをいくつかピックアップいたしましたので、下記よりご覧ください。
詳しくは以下
デザインに添えるイラストは、雰囲気を柔らかく華やかにしてくれたりと、何かと役に立つ存在。いざという時に活用できるストックとして持っておくと非常に便利です。そんな中今回ご紹介するのは、120点以上ものイラストがセットになった「Romantic Dreams Free Vectors」です。
ペンようなタッチで描かれた、柔らかい雰囲気のイラストが魅力的な素材セットです。
詳しくは以下
(さらに…)
アイコンをインターネット上で探すと、非常に膨大な量が検索されると思います。それゆえにどれを使用したら良いのか迷ってしまうこともあるのでは？今回はそんなときに参考にしたい、多目的なフリーアイコンまとめ「20 Free, Multi-Purpose Iconsets You Should Bookmark」を紹介したいと思います。
100 Free iOS Vector Icons. SKETCH, AI, PNG, SVG files.
定番として利用できそうなアイコンが豊富に揃っているので、ストックしておけばいろいろなシーンで活用できそうです。
詳しくは以下
今までDesigndevelopでは数々のフリーアイコン集、もしくはフリーアイコンを配布するサイトを紹介してきましたが、今日紹介する「iconPot – totally free icons」はWEBサイト上で利用でき商用利用、個人利用問わず利用でき、なおかつ著者のクレジット、リンクバックが必要ではないiconを集めたアイコンサイトです。
Splashy Icons
web dev icons in PNG format (16×16)
現在いくつかのアイコンセットが公開されていますので、いくつか紹介したいと思います。
詳しくは以下
WEBのデザインには欠かせないアイコン。シンプルなものでも、いざ制作となるとそれなりに時間を取られてしまいます。今日紹介するのは、無料で利用できるシンプルなアイコン350個セット「350 pixel Perfect Icons」。
上位のように350個ものアイコンがセットとなっており、あらゆる用途が想定されており、cスタンダードなものから、使いどころあるの？といったマニアックなものまで、様々なアイコンが収録されています。
詳しくは以下
前回WordPressの「WordPressの管理画面のUIを改善してくれるプラグイン「Admin Dropdown Menu」」で管理画面の表示を変更してくれるプラグインを紹介しましたが、今回はWordPressのログイン画面を変更する方法を紹介したいと思います。
変更と言ってもデザインが劇的に変わる物では無く、上記画像のようにカラーバリエーション程度ですが、少しは気分転換になるかと思います。
基本的には「Change Color of Your WordPress Login ~ Webmaster Heaven」からファイルをダウンロードしてWordpressをインストールしたディレクトリにある”wp-admin”フォルダの”images”フォルダへ”login-bkg-tile.gif”と”login-bkg-bottom.gif”をアップロード（ディフォルトのログイン画面をとっておきたい人はバックアップを取ろう。）するだけでWordpressのログイン画面の色を変える事ができます。
色は全部で6色ありますのでお好みで使ってみてください。ログイン画面を変えただけで何かが起きるとは言えませんが、もしかすると気分一新でブログに対する新しいモチベーションが湧いてくるかもしれません。
webサイトやスマートフォン・タブレットサイトなどを制作するのに便利に利用できるUIキット。いろいろな種類がダウンロードできるようになっており、活用されている方も多いのではないでしょうか？そんな中今回は、フラットテイストなフリーUIキットが多数揃った「30 Free and Flat UI Kits」を紹介したいと思います。
Al Khabar – Free UI Kit For News [free psd]
主流のフラットデザインを取り入れたUIキットの、さまざまな種類がまとめられています。
詳しくは以下
流行の最先端を行くデザインだけでなく、時にはテーマに合わせてどこか懐かしさが漂うテイストで制作することもあるかと思います。今回はそんなシーンでおおいに活用できる、レトロテイストなデザインのブラシまとめ「21 Sets Of Free Retro Brushes For Photoshop」を紹介します。
一世代前の時代を彷彿とさせる、レトロな雰囲気のブラシが21種まとめられています。気になったものをピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
webのトレンドとして今主流となっているフラットデザイン。ベースに合わせて、素材もフラットタイプのものが多く流通しています。そんな中今回紹介するのは、ベクター形式で便利に利用できる、フリーフラットアイコン「15 Sets of Vector / Flat PSD Icons – Free Download」です。
（Dribbble – Flat Icons / PSD by Yiğit Pınarbaşı）
定番として利用できそうなものから、ちょっと変わったテーマのものまで、15種のアイコンセットが紹介されています。
詳しくは以下
前回「代表的な12のCSSレイアウトテンプレートを配布する「Nice and Free CSS Templates」」という記事でCSSで作られた基本のセットともなるテンプレート集をお伝えしましたが、今回紹介する「100 Percent Pure CSS Layouts」もそんなベースのレイアウトになりうるテンプレートを集めたCSSテンプレート集です。
名前の通り100パーセントCSSだけで作った、デザインはいっさい無しでレイアウトだけ区切っているテンプレートをひたすら集めています。
詳しくは以下
デザインのクオリティを高めるためには、奥行きを感じさせるデザイン制作を心がけることが重要です。そんな中今回紹介するのが、手軽にデザインにニュアンスをつけられる、光の表現がきれいなPhotoshopブラシをまとめた「30 Free Dazzling Photoshop Bokeh Brushes」です。
（Bokeh Brushes by ~thethiirdshift on deviantART）
デザインにふわっとした幻想的な雰囲気を演出できるさまざまなブラシが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
