TOP  >  インターフェイス

Tag : インターフェイス

2013年11月12日

プロダクトのモックアップを手軽に再現!Photoshopのアクション集「Free download: 100 PSD mock-ups」

商品の作成やプロダクトを作る際、その完成模型となるモックアップの存在はプレゼンテーションを優位に運ぶことができ、製品化を進めていく場面においては重要なツールとなります。今回紹介するのはそんなモックアップを手軽に作れるPhotoshopアクションのまとめ「Free download: 100 PSD mock-ups」です。

fd100pmu_1

どれもとてもリアルで、まるで実製品を撮ったかのような高品質なモックアップが、カバー写真など、必要な画像を揃えるだけで簡単に作成することができます。

(続きを読む…)

続きを読む
このエントリーをはてなブックマークに追加
2013年11月05日

フラットデザインを実現するフリーUIデザインPSD「The Flat Design UI Pack」

Windowsのメトロデザインや、UIが一新されたiOSなど、最近はフラットデザインが色々な所で取り入れられてきており主流になりつつありますが、今日紹介するのは流行のフラットデザインを実現するフリーUIデザインPSD「The Flat Design UI Pack」です。

ftfduip

シンプルさの中にある柔らかさから万人受けしそうなデザイン。さまざまなパーツが用意されていて、制作に十分なサイズで、さらに編集可能なPSDで提供されています。

(続きを読む…)

続きを読む
posted 09:00  |  
Category: Design , Photoshop   
このエントリーをはてなブックマークに追加
2013年11月01日

iPhone5sを中心としたAppleデバイスの高品質なPSD素材「A Handy Collection Of iPhone 5s PSD Templates」

iPhone5sは発売以後、指紋認証機能や新色の追加など相変わらず話題を振りまいているApple製品。docomoからも発売されたことで、今後のiPhoneアプリやそれに伴うWEBサイトの開発や制作も増えてくるのではないでしょうか?今回紹介するのは制作やモックアップに便利なiPhone5sを中心とした美しいAppleデバイスの高品質なPSD素材「A Handy Collection Of iPhone 5s PSD Templates」です。

ahcoi5pt_0
Dribbble – Gold iPhone 5S PSD by Ryan Ford

リアリティ溢れるものやシンプルにまとめたもの、ワイヤーのイラストなど、多種多様なPSD素材が揃っています。中でも気になったものをピックアップしましたので、下記よりご覧ください。

(続きを読む…)

続きを読む
posted 09:00  |  
Category: Design , Photoshop   
このエントリーをはてなブックマークに追加
2013年10月23日

web・アプリケーション開発に使えるフリーUIデザインのまとめ「18 Useful Free UI Kits for Designers」

Webサービスやアプリケーションの開発においてUIデザインは必ず付いてまわるもの。けれど、0から作っていてはどうしても時間が掛かってしまうことが多いと思います。今回はそんな時に是非使ってほしい、フリーのUIデザインのまとめ「18 Useful Free UI Kits for Designers」を紹介したいと思います。

18ufukfd_0
Dribbble – #flatlyfe UI Kit [FREEBIE] by Dylan Opet

シンプルなものやリッチデザインなものまで、さまざまなテイストや利用シーンを想定したUIデザインが揃っています。中でも気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:00  |  
Category: Design   
このエントリーをはてなブックマークに追加
2013年02月18日

PSDファイルのWEBインターフェイス素材集「15 Free and Useful Web User Interface PSDs」

WEBを制作する際、photoshopを利用して制作しているという方も多いと思います。今日紹介するのはphotoshopで利用できるPSDファイルのWEBインターフェイス素材集「15 Free and Useful Web User Interface PSDs」です。


Transparent UI Kit

ある程度ユーザーインターフェイスの基本となるものがセットになっており、同じテイストで様々な素材を利用する事が可能です。全部で15の素材セットがまとめられていますが、今日はその中から気になったものをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 11:02  |  
Category: Design , Photoshop   
このエントリーをはてなブックマークに追加
2012年12月08日

2012年のベストフリーPSD「Best Free UI PSDs of 2012」

サイトを制作する上で、便利な素材PSD。photoshopで扱えるファイルで、細かなカスタマイズも可能で、扱いやすいファイル形式は制作者としてはありがたい形式ですが、今日紹介するのは、2012年に公開されたフリーPSDを集めたエントリー「Best Free UI PSDs of 2012」を紹介したいと思います。


Mini glyphs (12 px)

ベーシックなアイコン素材から、ローディング用のプログレスバーなど、制作に利用できそうな様々な素材がまとめられています。今回はその中から特に気になったPSD素材を紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 08:34  |  
Category: WebDesign   
このエントリーをはてなブックマークに追加

過去の記事からランダムで表示

2015年10月30日

リボンをテーマにしたデザインフリーフォントまとめ「Free Ribbon Fonts Designers Would Love to Have」

いろいろなデザインのフォントが配布されており、非常に個性的なものも豊富にインターネット上では配布されています。そんな中今回紹介するのは、リボンをテーマにしたデザインフリーフォントまとめ「Free Ribbon Fonts Designers Would Love to Have」です。

ribbonfont1
Lost Type Co-op | Ribbon

かわいらしいイメージのリボンのビジュアルを活用して作られたフリーフォントがまとめられ、紹介されています。気になったものをピックアップしましたので、下記より御覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:00  |  
Category: Font   
2010年05月31日

WEBレイアウトを便利にしてくれるフレームワーク関連のWEBサービスやツール集「Liquid, Fluid and Elastic Layout Templates, Tools and Frameworks」

WEBでコーディングをしていくときにとても便利なフレームワーク。上手く使えばデザインからのコーディングが劇的に早くなります。有名なものもあり、いくつか実務に使っていると言うWEBデザイナーさんも多いかと思います。今日紹介するのはWEBレイアウトを便利にしてくれるフレームワークをつくるWEBサービスやツールを集めた「Liquid, Fluid and Elastic Layout Templates, Tools and Frameworks」というエントリー。

liquid_layout_01
Tiny Fluid Grid

グリッドを自由にカスタマイズして作れるWEBサービスから、テンプレートまで様々なレイアウトに便利なものがまとめられています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 11:59  |  
Category: WebDesign   
2011年09月26日

クリエイティブ性の高いフォームデザイン集「30 Inspiring Examples of Contact Forms」

毎日無数のwebサイトが立ち上がっており、自由な発想から生まれるさまざまなデザインが注目を集めています。そんな中今回は、サイトとユーザーの直接的な繋がりとなる問い合わせフォームのデザインに力を入れているサイトを集めた「30 Inspiring Examples of Contact Forms」を紹介したいと思います。

手書き感のあるフォームデザインから、さまざまなアイテムをモチーフにしたフォームデザインまで、たくさんの種類が紹介されています。中でも気になったののをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
2009年11月28日

WEBのモックデザインを作る時、便利な素材集「A Collection of Useful Web Design Wireframing Resources」

WEBデザインのモックを制作する時に、クライアントにもっとアップ時の雰囲気を分かってもらう時に必要なのがブラウザ枠などをはじめとしたインターフェイスのデザインです。今日紹介する「A Collection of Useful Web Design Wireframing Resources」はそんなインターフェイスの素材をあつめたモックデザインを作る時、便利な素材集です。

wirefram01
Photoshop Browser Templates from joel laumans

上記は解像度別のブラウザのpsdデータ。PSDで制作を進めている方には便利な素材だと思います。その他にも様々なデータがまとめられていましたので、下記に貼付けておきます。

詳しくは以下

(続きを読む…)

続きを読む
posted 03:32  |  
Category: Design , Photoshop , vector   
2013年10月05日

ハイクオリティなフリー素材を集めた「The Best Freebies for Designers(September 2013)」

素材ストックとしてたくさん持っておくととても便利なフリー素材。種類も豊富にあるとさらにデザインの幅が広がるのではないでしょうか?今回はそんなシーンにおすすめの、ハイクオリティなフリー素材を集めた「The Best Freebies for Designers(September 2013)」を紹介したいと思います。

free_201309_1
Free Blueprint Wireframe PSD Kit on Behance

アイコン、フリーpsd、パターン、フォントといった多彩な種類がまとめられているので、さまざまな状況で活用することができます。

詳しくは以下

(続きを読む…)

続きを読む
posted 04:52  |  
Category: Design   
2016年08月02日

レスポンシブで小気味の良いアニメーションが特徴的なモーダル「IZIMODAL」

WEBサイトでも頻繁に利用されるモーダルウィンドウ。詳しく情報を表示したり、アラート的に利用したり、コンタクトフォームなどで利用したりなど様々な使い方が可能ですが、今回紹介するのはレスポンシブで小気味の良いアニメーションが特徴的なモーダル「IZIMODAL」です。

izimodal1

モーダルウィンドウとしての機能は一般的なものですが、モーダル内のオブジェクトが細かく動作しクオリティが高い印象を与えてくれるモーダルウィンドウです。

詳しくは以下

(続きを読む…)

続きを読む
posted 09:50  |  
Category: javascript , WebDesign   
2015年10月23日

ハイセンスさを感じられるフリーフォントまとめ「Freshest Free Fonts for Designers」

デザインのクオリティを高めるために、フォント選びはとても重要な工程。今回はそんなシーンで利用したい、ハイセンスさを感じられるフリーフォントまとめ「Freshest Free Fonts for Designers」を紹介したいと思います。

font1022_1
Bellico Typeface + Bonus Vectors – download free fonts by PixelBuddha

洗練かつデザイン性を感じられる最新のフォントがピックアップされ、紹介されています。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:00  |  
Category: Font   
2010年12月25日

手書きのタイポグラフィアート集「Beautiful Hand Drawn Typography」

デザインのジャンルとして人気の高い”タイポグラフィ”、その表現方法にもさまざまなものが存在しますが、今回紹介するのは手書きのタイポグラフィアート集「Beautiful Hand Drawn Typography」です。


DiR on the Behance Network

多彩な表現方法で描かれたタイポグラフィアート作品が数多く紹介されており、デザインをする際のアイデアソースとしておおいに活用できそうです。気になったものをいくつかピックアップしてみましたので下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 04:08  |  
Category: Design   
2009年10月10日

photoshopのテクニック集「95+ Great Photoshop Tutorials to Learn Awesome Photo Manipulation Tricks」

グラフィックデザインやクリエイティブの現場にとって欠かす事ができない、画像編集ソフトphotoshop。かなり高機能でそのテクニックを突き詰めれば様々な表現がかのです。今日紹介するのはそんなphotoshopのテクニックを集めたエントリー「95+ Great Photoshop Tutorials to Learn Awesome Photo Manipulation Tricks」。

dragon-01
How to Design a Dramatic Winged Dragon with Photoshop

映画のワンシーンのようなビジュアルをphotoshopを使って作り上げるテクニックが公開されています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 03:08  |  
Category: Design , Photoshop   
2017年04月16日

モバイルデザイン用の20個のiPhoneモックアップ「20 Free Photorealistic iPhone Mockups for Your Mobile Designs」

スマートフォンを取り入れたモックアップにはいろいろな種類が存在しており、すでに取り入れて活用されている方も多いのではないでしょうか。そんな中今回は、ぜひストックに加えておきたい、デザイン性の高いiPhone用モックアップを集めた「20 Free Photorealistic iPhone Mockups for Your Mobile Designs」を紹介します。

iphone-mockup01
Red iPhone on Desk Mockup | MockupWorld

さまざまなシーンやグラフィックにiPhoneが配置されたモックアップが20種紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:00  |  
Category: Design   

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

デザインを開発するという視点からデザイン、WEBデザインに役立つ情報をお伝えします。

ご意見、ご感想、連絡事項があればFacebookページよりお願いたします。

※当サイトのに掲載されている一部画像、スクリ-ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればFacebookページからご連絡ください。即刻削除いたします。
※本ブログの「プライバシーポリシー」です。

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに!をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。
VR・ウェアラブル・センシングなど様々な技術が一般化され、手に届く範囲で製品化が進んでいます。VR MEDIAは拡張する現実から未来を探るBLOGです。
Template deisgn by iDEACLOUD inc.
トップに戻る