TOP  >  レスポンシブ

Tag : レスポンシブ

2013年02月23日

レスポンシブ時代のビューポートチェックWEBサービス「Responsive.is」

現在では様々な端末がリリースされ、その全てで最適な表示をさせるためにレスポンシブなWEBサイトが求められていますが、端末ごとのチェックはとても面倒なもの。今日紹介するレスポンシブ時代のビューポートチェックWEBサービス「Responsive.is」は、WEB上で様々なビューポートをシュミレートしてくれるものとなっています。

PC、タブレット縦、タブレット横、スマートフォン縦、スマートフォン横と様々なビューポートが確認でき、全体のどの部分を表示しているのかも分かるようになっています。下記は様々なビューポートで同一のサイトを表示したものとなります。

詳しくは以下

(さらに…)

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

レスポンシブな料金テーブル「Responsive Pricing Tables Using」

WEBサイトで料金について言及するページは、有料で提供するWEBサービスではよく見かけますが、今日紹介するのは、端末を選ばない、レスポンシブな料金テーブル「Responsive Pricing Tables Using」です。

上記のように、こちらは基本4カラムの料金テーブルとなっていて、ウィンドウ幅によって、横幅が縮まったり、組変わったりとレスポンシブなつくりになっています。実際の組み替え例は以下からどうぞ。

詳しきは以下

(さらに…)

続きを読む
このエントリーをはてなブックマークに追加

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

2016年06月09日

イラストレーターをもっと活用できる 最新のチュートリアル15選「15 New Adobe Illustrator Tutorials」

さまざまなグラフィック表現を可能にする、adobeのソフト・イラストレーター。デザイナー必須のソフトであり、ほとんどのデザインシーンで利用されています。今回はそんなイラストレーターをもっと活用できる、最新のチュートリアル15選「15 New Adobe Illustrator Tutorials」を紹介したいと思います。

tutorial_illustrator0609_1
How to Create a Simple Geometrical Pattern in Adobe Illustrator

イラストレーターを使ってできる描写技術が15種掲載されています。気になったものをピックアップしましたので、以下よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Design   
2016年09月28日

WEBの表現をもっと豊かにしてくれるアニメーションまとめ「36 Brilliant User Interface Animations」

WEB上のユーザーインターフェイスの中で行われるちょっとしたアニメーションに驚きと感動をするということがたまにありますが、インターフェイスに即したアニメーションはWEBをより良いものにしてくれます。今日紹介するのはWEBの表現をもっと豊かにしてくれるアニメーションまとめ「36 Brilliant User Interface Animations」です。

dancing_icon
Menu open / tick / close

全部で36ものアニメーションが原文ではまとめられていましたが、今日はその中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 08:30  |  
Category: WebDesign   
2011年08月15日

デザイン性の高いPSDデザイン集「25 High Quality Free PSD Files」

グラフィカルでリアルなデザインの制作に欠かせないソフトといえばphotoshopですが、クオリティの高いものを仕上げるには時間を要することが多いかと思います。そこで今回は、制作時間の短縮にもつながる、PSD形式で制作されたさまざまなデザインを集めた「25 High Quality Free PSD Files」を紹介したいと思います。


MeegoFurn. Landing Page PSD | elemis | raw materials for design

webサイトデザインに利用するさまざまなパーツデザインから、飛行機やマウスなどのCGパーツまで、さまざまなPSD素材が紹介されています。中でも気になったものをピックアップしましたので、下記からご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 08:36  |  
Category: Design , Photoshop   
2010年02月08日

グローバルナビゲーションのショーケース「A Showcase of Website Navigations with Serious Click Appeal」

WEBサイトのなかでも最も重要で、ユーザーが利用するナビゲーション、グローバルナビゲーション。今日紹介するのはそんなグローバルナビゲーションのショーケース「A Showcase of Website Navigations with Serious Click Appeal」です。

synthview01
SYNTHVIEW

海外のサイトにはなりますが、様々なナビゲーションが集められています。今日はその中から気になったものをいくつか紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 03:50  |  
Category: Design , WebDesign   
2015年11月23日

デザイン性・使いやすさが考慮されたフォームデザインサンプル「20 Awesome Form Designs Visitors Want To Fill Out」

サイトのコンテンツとして必要な場合が多いコンタクトフォームなどの送信ページ。シンプルに構成されていることが多いですが、時にはデザイン性を重視したり、より使いやすさが求められる場合もあるのではないでしょうか?今回はそんな時に参考にしたいフォームデザインサンプル「20 Awesome Form Designs Visitors Want To Fill Out」を紹介したいと思います。

form1123_1
Dobidos, sanitari salvaspazio con bidet incorportato | Contatti.

デザイン性・使いやすさが考慮された、いろいろなタイプのフォームデザインがまとめられています。

詳しくは以下

(さらに…)

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

wordpressでの構築の参考にしたいフリーテーマ「Top 10: Free WordPress Themes of December 2015」

さまざまなタイプのサイト構築に活用できるwordpress。更新が簡単にできるなどの利点も含め非常に便利な存在です。そんな中今回紹介するのは、wordpressでの構築の参考にしたいフリーテーマ「Top 10: Free WordPress Themes of December 2015」です。

wordpress1224_3
WordPress › Kotha « Free WordPress Themes

新しくピックアップされたwordpressのフリーテーマが紹介されています。気になったものをピックアップしましたので、下記より御覧ください。

詳しくは以下

(さらに…)

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

グリッドレイアウトのwebデザイン集「40+ Great Examples of Grid Style in Web design」

グリッドラインを活かしレイアウトされたwebデザイン、すでに定番の形となりさまざまなシーンで展開されていますが、そんな中今回はグリッドレイアウトのwebデザイン集「40+ Great Examples of Grid Style in Web design」を紹介したいと思います。


TasteSpotting | a community driven visual potluck

定番のものから、デザイン性を重視しさらに個性を強調したタイプなど、同じグリッドレイアウトの中でにいろんなタイプのデザインが紹介されています。気になったサイトを以下にまとめてみました。

(さらに…)

続きを読む
posted 10:14  |  
Category: Design   
2008年04月03日

【FreeFont】女性の手書き風ひらがなフォント「アイコ」と「はるか」

綺麗な設計されつくされた書体も美しく、読みやすく良いのですが、やはり人間の温かみを感じられる手書きも独特の魅力があります。今日紹介するのは手書き風のひらがなフォント「アイコ」と「はるか」です。

aikoharuka.gif

めちゃくちゃやわらかく、くだけた感じではなく、適度な手書き感を残しながらも、手書きの良さがわかるそんなフォントだと思います。どちらかというと「アイコ」の方が堅い感じを受けます。

詳しくは以下

(さらに…)

続きを読む
posted 12:34  |  
Category: Design , Font   
tag: Design Font
2012年07月11日

古い新聞ばかりを集めたテクスチャまとめ「30 Old Looking Sets of Newspaper Texture」

オシャレな雑貨店やプレゼントのラッピングなどで見かける新聞を利用した包装は、幅広い世代の方に受け入れられています。そんな雰囲気をデザインでも演出できたら嬉しいですよね。そこで今回紹介するのが、古い新聞ばかりを集めたテクスチャまとめ「30 Old Looking Sets of Newspaper Texture」です。


headline may 1915 by ~lebstock on deviantART

アンティークな雰囲気漂う、新聞紙をモチーフにしたテクスチャが多数紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 11:55  |  
Category: Design   
2016年02月03日

スモールビジネスのサイト制作に最適なフリーwordpressテーマ集「12 Free Small Business WordPress Themes」

少数精鋭でありながらも、質の高いサービス提供を行っていくスモールビジネスというスタイルが今定着しつつある中、アピールするためのwebサイト制作も必須となってきています。今回はそんなシーンに最適なフリーwordpressテーマ集「12 Free Small Business WordPress Themes」を紹介したいと思います。

wordpress0203_1
Ravel WordPress Theme

情報を的確に、シンプルに伝えることができるテーマが揃っており、どれも取り入れてみたくなるものばかり。きになったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

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

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

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

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

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

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに!をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。

【ご注意】「Designworks」の旧ホームページドメインを利用したWEBサイトにご注意ください
Template deisgn by iDEACLOUD inc.
トップに戻る