TOP  >  WEBデザイン

Tag : WEBデザイン

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   
このエントリーをはてなブックマークに追加
2016年09月27日

物を売るために参考になるWEBデザイン集

ECサイトからプロダクトランディングページまで物を売るためには様々なページが必要ですが、その中から決済画面、プライスページ、プロダクトページ、ストアページと大きくカテゴライズしてデザインを収集している、物を売るために参考になるWEBデザイン集を今回紹介したいと思います。

ec_web01

それぞれのカテゴリに特化して、デザインが集められており、スクリーンショットもフッターまでで取得しているため、サイト上でも全てを参照することが可能です。

詳しくは以下

(さらに…)

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

CSSで実現するフィルタジェネレーター「CSSFILTERS.co」

写真加工は現在様々なアプリケーションに搭載されており、もはや写真とは切手は切れない関係にありますが、今回紹介するのはWEB上でも動作する写真加工フィルタを生成できるCSSで実現するフィルタジェネレーター「CSSFILTERS.co」です。

cssfilter_01

このサービスでは、予め登録されたフィルタもしくは、パラメーターを指定して任意の画像にフィルタをかけるとと共に、WEB上で実現するためのコードも出力してくれるというものです。

詳しくは以下

(さらに…)

続きを読む
posted 11:58  |  
Category: WebDesign , WebService   
このエントリーをはてなブックマークに追加
2016年09月03日

キャンプ・アウトドアをイメージしたアイコンセット「Camping Free Line Icon Set」

キャンプ・アウトドアなどは、国内でもグランピングという新しい概念もでてきて、さらに注目を浴びているレジャーの一つですが、今回紹介するのはキャンプ・アウトドアをイメージしたアイコンセット「Camping Free Line Icon Set」です。

Camping-Free-Line-Icon-Set-prev01

方位磁石、リュック、オノやマッチなどなど、通常のWEB制作のアイコンセットには無いユニークなアイコンが集められています。

詳しくは以下

(さらに…)

続きを読む
posted 01:56  |  
Category: Design , vector , WebDesign   
このエントリーをはてなブックマークに追加
2016年08月29日

ミニマルでベクターで扱えるフリーアイコンセット「1800 Free Minimal Icons」

デザインやインターフェイスを作りこむ上で重要なアイコン。シンプルなアイコンはどんなデザインにもマッチし制作現場においては非常に重宝します。今回紹介するのはミニマルでベクターで扱えるフリーアイコンセット「1800 Free Minimal Icons」です。

free1800

制作にかなり配慮して制作されたアイコンセットのようで、普通のアイコンセットには無い細かい配慮がなされた上で配布されています。

詳しくは以下

(さらに…)

続きを読む
posted 09:30  |  
Category: Design , vector   
このエントリーをはてなブックマークに追加
2016年08月25日

【商用可】食べ物・飲み物アイコンセットの決定版「100 Colored Food & Drink Icons」

一般的なピクトグラム的なアイコンセットはよく見かけますが、特定の分野で多くのアイコンが収録されたアイコンセットはなかなか無く、合ったとしてもなかなか全てを網羅しているというものは少ないと思います。今日紹介するのは100個の食べ物をアイコン化したアイコンセット「100 Colored Food & Drink Icons」です。

100food01

野菜、魚介、チーズ、香辛料、果物などなど様々な食物をモチーフにアイコンが制作されています。収録アイコンは以下からご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 11:42  |  
Category: Design , vector   
このエントリーをはてなブックマークに追加

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

2011年10月23日

様々なホバー表現を可能にしてくれるjQueryプラグイン「Hoverizr」

WEBではインターフェース的にもデザイン的にも欠かすことができない、マウスオーバーした時のホバー処理。ちょっとしたギミックですが、全体のクオリティに影響する部分だと思います。今日紹介するのはわずか2.5KBと非常に軽量ながら、様々なホバー表現を可能にしてくれるjQueryプラグイン「Hoverizr」。

このプラグインではcanvasを利用して、白黒からカラーだったり、ぼかしからぼかしを取ったりと通常のホバー表現とは一味違った表現を簡単に可能にしてくれます。

詳しくは以下

(さらに…)

続きを読む
posted 09:29  |  
Category: WebDesign   
2013年05月26日

微細な汚れや味を表現するブラシコレクション「A Collection Of 100+ Subtle Brush Sets」

デザインのクオリティは細部に宿るといいますが、ちょっとした粒子や、色味の違いで大きくクオリティが変わったりします。今日紹介するのは、微細な汚れや味を表現するブラシコレクション「A Collection Of 100+ Subtle Brush Sets」です。


Hi-Res Subtle Grunge Vector Textures

粒子を表現したものから、刷り傷やランダムな粒子など様々なブラシセットがまとめられています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Design , Photoshop   
2015年03月10日

デザイン背景などに利用できる パターンチュートリアル11種「11 Pattern Tutorials For Your Next Designs」

背景素材として活躍してくれるパターン。すでに完成されているものはもちろん便利ですが、時には自分で作ったものを使用したい時もあるのではないでしょうか?今回はそんな時に参考にしたい、パターンチュートリアル11種「11 Pattern Tutorials For Your Next Designs」を紹介したいと思います。

pattern0
How to Create a Bright Geometric Circle Pattern in Adobe Illustrator – Tuts+ Design & Illustration Tutorial

11種類のパターンを作成できる手法が、分かりやすく紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Design   
2017年08月21日

高品質でクリエイティブ性の高いフォトショップアクションまとめ「New Amazing Photoshop Actions for Photographers & Designers」

複雑な作業でも、Photoshopのアクション機能に記憶しておけば何度でも使用することができ、時間短縮へ繋がる上に均一なクオリティを生み出すことができ非常に便利。そんな中今回は、デザイナーに向けたクリエイティブなデザイン性を持つハイクオリティなアクション機能がまとめられた「New Amazing Photoshop Actions for Photographers & Designers」を紹介します。

Photoshop_Actions_top
Comic Book Photoshop Action by SOHdesign | GraphicRiver

どれも高品質かつユニークな画像演出が光るアクション機能ばかり。中から気になったものをいくつかピックアップ致しましたので以下よりご覧下さい。

詳しくは以下

(さらに…)

続きを読む
posted 09:00  |  
Category: Design , Photoshop   
2011年06月08日

便利で使いやすいベクターPhotoshopブラシ集「250+ Useful Vector Photoshop Brushes」

デザインを作成する際には、さまざまなデザイン用ソフトを利用します。中でも使用頻度の高いPhotoshopは、ラインのきれいなベクター画像を素材として描くにはテクニックが必要になります。そこで今回紹介するのが、Photoshopで手軽に利用できるベクターブラシセットを集めた「250+ Useful Vector Photoshop Brushes」です。


Flower Brush Set 1 by ~gvalkyrie on deviantART

未来的なデザインから、ポップなデザインまで、イラストレーターで作成したかのような使いやすいベクターブラシが豊富に紹介されています。中でも特に気になったものをピックアップしましたので、以下よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
2017年09月28日

様々なシーンで使えるアイコンセット「Basicons Multipurpose Icon Set」

Webサイトの利用者が増えるほどその使い方は様々で、幅広い使用用途を考慮した上でサイトの構築を行わなければなりません。中でもUIはとても重要で、いかに分かりやすくスムーズにユーザーを導くことができるかがポイントです。そんな時に役に立つのが今回紹介する、様々なシーンで使えるアイコンセット「Basicons Multipurpose Icon Set」です。

bm_IconSet01

およそ500種類の異なるアイコンがカテゴリごとに集約された、汎用性の高いアイコン素材です。

詳しくは以下

(さらに…)

続きを読む
posted 09:00  |  
Category: Design , Tool   
2017年07月05日

WEBデザイナーのための6つのオンラインツール「6 Essential Open Source Tools for Web Designers」

スマートフォンやタブレット端末が普及した今日では、毎日 Webサイトを閲覧するという人も随分多くなったのではないでしょうか。そんな中今回紹介するのは、日々変化していくWebサイトを制作するWEBデザイナーのための6つのオンラインツール「6 Essential Open Source Tools for Web Designers」です。

essential01
Krita | Digital Painting. Creative Freedom.

デザインの手助けをしてくれるアイテムはとても便利で、より良いものを作る事ができる優れものです。その中でも、気になったものをいくつかピックアップしてみました。

詳しくは以下

(さらに…)

続きを読む
posted 09:00  |  
Category: Tool , WebDesign   
2013年08月24日

ハイクオリティなデザインに活用したいフリーフォント「30 Free Creative and Quirky Fonts」

デザイン性に優れたフォントを使用するだけで、制作物のクオリティは格段にアップするもの。今回はそんなシーンに是非チョイスしたいフリーフォントまとめ「30 Free Creative and Quirky Fonts」を紹介したいと思います。

freefont20_0
Glitch (free font) on Behance

シンプルで定番として使用できそうなタイプから、フォント自体にデザインが施されているものまで、バリエーション豊富に紹介されています。

詳しくは以下

(さらに…)

続きを読む
posted 08:07  |  
Category: Font   
2015年11月13日

チェックしておきたい 種類豊富なセットが魅力のフリーアイコンまとめ「30 Free Icons Sets That You Must Have」

常に最新のデザインをチェックしておきたいアイコン。あたらしいものがどんどんと配布され続けています。そんな中今回は、種類豊富なセットが魅力のフリーアイコンまとめ「30 Free Icons Sets That You Must Have」を紹介したいと思います。

icon1113_4
Dribbble – Fblu free icons by buatoom

定番から、少し個性的なテーマまで、1つのセットの中にいろいろな種類がまとまっている嬉しいアイコンセットが多数紹介されています。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Design   
2014年08月23日

ECサイトなどで活用できる フリークレジットカードアイコンセットのまとめ「27 Free Credit Card Icon Sets for Online Web Shops」

インターネット上でショッピングをする際の決算方法として、クレジットカードを使用する方は非常に多いと思います。決済は非常に重要な工程であるため、デザイン的にも分かりやすく案内してあげることが重要。今回はそんな時に必要な素材の一つ・クレジットカードビジュアルをアイコン化した「27 Free Credit Card Icon Sets for Online Web Shops」を紹介したいと思います。

credit-cards1
Dribbble – 1 Color Credit Icons by Chad Pugh

さまざまな表現のクレジットカードのアイコンセットが、27種まとめられています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

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

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

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

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

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

関連サイト

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

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