TOP  >  responsive

Tag : responsive

2017年12月01日

レスポンシブした際のスクリーンショットが一度に撮れるサイト「z Screenshots」

webサイトのデザインをクライアントに提案する時には、PCだけでなくスマートフォンや他の端末ではどのように表示されるか、全て見せるということも少なくないもの。そんな時に役に立つのが今回紹介する、レスポンシブした際のスクリーンショットが一度に撮れるサイト「Responsive Screenshots」です。

Responsive_Screenshots01

URLを入力するだけで、一度に複数の端末のスクリーンショットうを撮ってくれる優れもの。デザイナー必見のサイトです。

詳しくは以下

(続きを読む…)

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

レスポンシブ設計をスムーズにsuruレスポンシブレイアウトをテストする為のフリーツールまとめ「7 Free Tools For Testing Responsive Layouts」

現代のWebデザインに置いて欠かせない基礎設計となっている、レスポンシブレイアウト。PCとスマートフォンでの見え方の違いを手軽にチェックしたい、そんな時の手助けとなる便利なテストツールをまとめた「7 Free Tools For Testing Responsive Layouts」を今回は紹介したいと思います。

7-free-testing-responsive-layouts1
7 Free Tools For Testing Responsive Layouts | Webdesigner Depot

使いやすい全てフリーで利用できるツールが7種ご紹介されています。その中から幾つかおすすめのツールをピックアップしてまとめましたので、是非ご覧ください。

詳しくは以下
(続きを読む…)

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

簡単な手順を踏むだけでレスポンシブ設計された状態のデータがダウンロードできるサービス「Launchaco」

今やwebサイト設計は、レスポンシブであることが当たり前の時代となりましたが、最適な構成・設計を生み出すことに日々、頭を悩ませる方も多いのではないでしょうか。そんなときに便利な「Launchaco」を今回は紹介いたします。

Launchaco-top

簡単な手順を踏むだけでレスポンシブ設計された状態のデータがダウンロードできる、web制作現場にいる方にとっては嬉しいwebツールです。

詳しくは以下

(続きを読む…)

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

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

2009年09月30日

ハイクオリティなフリーHTML/CSSテンプレート集「99 High-Quality Free (X)HTML/CSS Templates」

WEBサイトの制作をより簡単にそして精度の高いものにしてくれるテンプレート。現在様々なフリーで使えるテンプレートがリリースされており、かなりクオリティの高いもの存在します。今日はそんなハイクオリティなフリーHTML/CSSテンプレートを集めたエントリー「99 High-Quality Free (X)HTML/CSS Templates」を紹介したいと思います。

templexhtml-01
Download - Live Demo

様々なタイプの高品質なHTML/CSSが収録されていますが、今日はその中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 09:40  |  
Category: WebDesign   
2010年03月27日

美しい手書きフォント30選「30 Beautiful Handwritten Fonts」

デザインにおいて書体は重要で、フォントによってかなりデザインの印象が変わります。今日紹介する「30 Beautiful Handwritten Fonts」はフォントのなかでもアナログ感や温かみを表現できる手書き風フォントを集めたエントリーです。

handwriting01
Handwriting1800

上記のようなキレイめな筆記体のようなものからもう少しラフなくだけた手書きフォントまで、様々なフォントが集められています。

詳しくは以下

(続きを読む…)

続きを読む
posted 01:50  |  
Category: Design , Font   
tag: Design Font
2017年08月03日

Webデザインをよりクリエイティブにみせてくれる 複数写真の同時切り替えが可能なグリットスライドショー「CSS Grid Layout Slideshow」

Web上で写真を見せる定番の手法のひとつ、スライドショー。コンテンツを見せるのに利用したり、メインビジュアルに利用したり…とても活用幅が広く便利な存在です。今回ご紹介するのはそんなスライダーを、よりクリエイティブに見せてくれる変則的なスライドショー「CSS Grid Layout Slideshow」です。

gridLayout-slideshow02

グリット上に並べられた複数のイメージを、一気に切り替えることができる美しいスライドショーのフリーCSSソースです。

詳しくは以下

(続きを読む…)

続きを読む
2012年01月09日

最近リリースされたフリーアイコンセット50選「50 (Really FRESH) High Quality and Free Icon Sets」

WEB制作において、非常に便利な素材の一つアイコン。直感的に意味を示してくれる指標になったり、作りこまれたアイコンはそれだけでデザインのクオリティをアップさせてくれたりします。今日紹介するのは最近リリースされたフリーアイコンセット50セットまとめたエントリー「50 (Really FRESH) High Quality and Free Icon Sets」です。


3D Glossy Icon Set: 20 Free Icons

シンプルなものから、立体的なもの、一点物などなど様々なアイコンセットがまとめられています。今日はその中から幾つか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 06:51  |  
Category: Design , Photoshop   
2017年04月09日

使えるビジネス向けPSDモックアップまとめ「2016 Revisited: Best Free Corporate Identity Packages, Business Cards and CVs」

企業のイメージを支えるブランディング。適切なデザインを取り入れることで、会社をより良い方向へと導いてくれます。今回はそんな企業向けブランディングデザインの制作時に活用できるモックアップをまとめた「2016 Revisited: Best Free Corporate Identity Packages, Business Cards and CVs」をご紹介します。

Realistic-Stationary-Branding-Identity-MockupLight-Anthony-Boyd
Anthony Boyd | Realistic Stationary Branding & Identity Mockup

名刺から書類、手帳などビジネスに関わるベストなモックアップがまとめられています。気になったものをピックアップしていますので、以下よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
2014年09月19日

フラットテイストなフリーUIキットが多数揃った「30 Free and Flat UI Kits」

webサイトやスマートフォン・タブレットサイトなどを制作するのに便利に利用できるUIキット。いろいろな種類がダウンロードできるようになっており、活用されている方も多いのではないでしょうか?そんな中今回は、フラットテイストなフリーUIキットが多数揃った「30 Free and Flat UI Kits」を紹介したいと思います。

ui0919_1
Al Khabar – Free UI Kit For News [free psd]

主流のフラットデザインを取り入れたUIキットの、さまざまな種類がまとめられています。

詳しくは以下

(続きを読む…)

続きを読む
posted 12:18  |  
Category: Design   
2013年12月04日

スクロールに合わせて次々とコンテンツを読み込むjQueryプラグインのまとめ

ページ遷移を可能な限り少なくして、シームレスに気持ちよく情報を見せようといったWebサイトを、最近よく見かけるようになりました。しかしそのようなサイトを構築したいと思っても、経験が無ければハードルは高いもの。そこで今回は、そのような機能を手軽に実装できるjQueryのプラグインをまとめたエントリー「12 jQuery Infinite Scroll Plugins and Tutorials」を紹介したいと思います。

12jispat_0
Mark Holton | Web Application Development

スクロールに合わせて新たなコンテンツを読み込む機能を中心に、12種類のプラグインがまとめられています。中でも気になったものをピックアップしましたので、下記よりご覧ください。

(続きを読む…)

続きを読む
posted 09:00  |  
Category: javascript , WebDesign   
2011年04月29日

さまざまな蝶を表現できるphotoshopブラシまとめ「A Collection of Free Butterfly Photoshop Brushes」

やっと春らしさを感じるようになってきて、デザイン上でも春らしい華やかさを表現する場面が増えているのではないでしょうか?女性らしさや華やかさを表現する際に良く用いられる「蝶」ですが、実際に描こうとすると多くの時間と手間が必要になり、デザイン制作に時間かかってしまいます。そこで今回は、手軽に利用できる蝶のphotoshopブラシをまとめた「A Collection of Free Butterfly Photoshop Brushes」を紹介したいと思います。


.:Butterfly Brushes:. EDIT by ~SaharaKnoblauch on deviantART

実写に近いブラシから美しい線画のブラシまで、こだわりのブラシが多数紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:57  |  
Category: Design , Photoshop   
2016年08月26日

javascriptとCSSで写真にフィルタ効果を与えるライブラリ「Philter」

Instagramなどを始め写真共有アプリでは気軽に写真に豊富なフィルタがかけられ多くの方が利用しており、フィルタによって創られた色味や風合いは写真のクオリティを大きく向上させてくれます。今日紹介するのはjavascriptとCSSで写真にフィルタ効果を与えるライブラリ「Philter」です。

pf_01

パラメーターを調整するだけWEB上で表示された写真にフィルタと同じような効果をかけることが可能です。

詳しくは以下

(続きを読む…)

続きを読む
posted 09:41  |  
Category: javascript , WebDesign   
2007年12月26日

シンプルなphotoshopカスタムパターン素材集「wwwusic Simple Patterns」

WEBサイトを構築する時にphotoshopを使っている方にはオススメなデザインパターン集が今回紹介するシンプルなphotoshopカスタムパターン素材「wwwusic Simple Patterns」です。どんなデザインにもあうシンプルで汎用性の高いパターン素材がフリーで公開されています。

シンプルなphotoshopパターン素材

使い方は様々ですがシンプルなだけに既存のデザインや、オリジナルのデザインなんかと組み合わせても上手く使えるかと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 03:54  |  
Category: Design , Photoshop   

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

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

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

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

関連サイト

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