TOP  >  パララックス

Tag : パララックス

2014年01月02日

パララックス効果を与えてくれるjQueryプラグイン「7 Useful Parallax jQuery Plugins」

2013年のWEBでは大きく活躍していたパララックス効果。視差効果によってもたらされる体験は、今までのWEBとはまた違った感覚を与えてくれました。今回紹介するのはそんなパララックス効果を簡単に利用できるプラグインをまとめたエントリー「7 Useful Parallax jQuery Plugins」です。

1
7 Useful Parallax jQuery Plugins

手前と奥にオブジェクトを設置し、遠近感を持たせて画面に奥行きをもたせるものから、スクロールによって背景と手前のオブジェクトを動かす定番のものまで様々なパララックス効果を得られるjQueryプラグインが紹介されています。今日はその中から気になったものをピックアップして紹介したいと思います。

(さらに…)

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

パララックスを実現するためのチュートリアル&リソース集「Parallax Scrolling Tutorials & Resources」

大きな話題を呼び、国内でも様々なPRサイトに実装されたパララックス(視差効果)。今までには無い体験は多くの人の注目をあつめました。今日紹介するのはパララックスを実現するためのチュートリアルやリソースをあつめた海外のチュートリアル&リソース集「Parallax Scrolling Tutorials & Resources」です。


Behind The Scenes Of Nike Better World

ソースで開示されているところや、根幹の考え方等、示されている方法は様々ですが、今回はその中から比較的分かりやすいと思うチュートリアル、リソースをピックアップして紹介したいと思います。

詳しくは以下

(さらに…)

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

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

2009年04月19日

WEBデザインの品質をあげるテクニック集「How to Spot Quality within Web Design: Examples & Tips」

WEBデザインというのはかなり複合的なデザインで様々な要素の組み立ててででき上がっています。クオリティの高い、低いはいったいどんな要素で決定しているのか!?そんなWEBデザインの確信にも迫る部分を取り上げているのが今回紹介するWEBデザインの品質をあげるテクニック集「How to Spot Quality within Web Design: Examples & Tips」です。

quality_in_web_design01

クオリティを上げるためのテクニックやヒントがいくつか紹介されていますが、そのなかでも特に気になったものをいくつか紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 10:28  |  
Category: WebDesign   
tag: webdesign
2010年04月26日

クリエイティブなフリーフォント集「40 Beautiful Free Fonts For Creating Attractive Typography Headlines」

さまざまな種類のフォントが日々リリースされていますが、。今回紹介するのはクリエイティブなフリーフォント集「40 Beautiful Free Fonts For Creating Attractive Typography Headlines」というエントリー。

freefont40_01

全部で40のフォントがまとめられていましたが、その中からシンプルで使いやすいタイプのフォントを中心にいくつピックアップして紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 11:09  |  
Category: Design , Font   
tag: Design Font
2015年04月10日

デザインに彩りを デザイン性の高いフリーフォントまとめ「Collection of New & Free Fonts for April 2015」

フォントには非常にいろいろな種類が存在していますが、フォント単体で存在感が感じられる個性的なタイプもたくさんフリーで配布されています。今回はそんな、デザイン性の高いフリーフォントまとめ「Collection of New & Free Fonts for April 2015」を紹介したいと思います。

font0409_1
MOSCÚ | Free Font on Behance

シンプルでベーシックに使用できるものから、形が非常に独創性のあるものまで、幅広いデザインのラインナップが魅力のまとめとなっています。

詳しくは以下

(さらに…)

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

ソース付きCSS3で作るボタン「10 Awesome CSS3 Buttons to use on your website」

次世代の規格として注目され、最新のブラウザでは問題なく認識ができるようになってきているCSS3。今日紹介するのはCSS3を利用してつくるボタン集「10 Awesome CSS3 Buttons to use on your website」を紹介したいと思います。

グラデーション、ドロップシャドウ、角丸など、CSS3の機能をふんだんに使って上記のような全部で10のボタンが公開されています。

詳しくは以下

(さらに…)

続きを読む
posted 10:43  |  
Category: WebDesign   
2012年07月22日

実用性の高い バリエーション豊富なテクスチャまとめ「The Ultimate Collection of Professional Textures」

使い方によって、さまざまな形に変化し幅広く活用できるテクスチャは、デザイナーにとっては欠かせないもの。今回は、是非自身のストック素材としてチェックしておきたい、実用性の高いテクスチャまとめ「The Ultimate Collection of Professional Textures」を紹介したいと思います。


Wood Texture Pack – 12 Free Images! | Media Militia

定番からちょっとアレンジを加えたもの、テクスチャ単体で使用しても様になるもの、幅広いラインナップをこのまとめ一つで取り入れることができます。

詳しくは以下

(さらに…)

続きを読む
posted 04:58  |  
Category: Design   
2014年05月23日

テキストをグラフィカルに変化させる Photoshop&Illustratorのチュートリアルまとめ「44 New Photoshop Illustrator Text Effects Tutorials」

使用するだけでデザインを演出してくれるフォントは多数存在しますが、もっとグラフィック的なデザインを求めるシーンも多くあると思います。今回はそんな時に是非参考にしたい、テキストをグラフィカルに変化させる Photoshop&Illustratorのチュートリアルまとめ「44 New Photoshop Illustrator Text Effects Tutorials」を紹介します。

tuto1
Tutorial: Candy Text Effect

さまざまなテイストやイメージにテキストを加工できる方法が分かりやすく紹介されたまとめとなっています。

詳しくは以下

(さらに…)

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

フラットテイストのアイコンセットを集めた「30 Free Flat Icon Sets for Web Designers」

現在主流のフラットデザイン。テイストに合わせた素材がたくさん配布されています。そんな中今回紹介するのは、フラットテイストのアイコンセットを集めた「30 Free Flat Icon Sets for Web Designers」です。

icon140811_1
Dribbble – Free BBQ Icons by Cort McGinty

シンプルでありながらもデザイン性に優れたアイコンセットが多数まとめられています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 08:37  |  
Category: Design   
2015年09月20日

世界の有名ランドマークをアイコン化した「12 Free Icons」

世界には有名なランドマークが多数存在しており、その中でもひときわ有名なものは国を象徴する存在として、多くの人に知られています。今回はそんな世界の有名ランドマークをアイコン化した「12 Free Icons」を紹介したいと思います。

landmark

おなじみのランドマーク12種が集結。アイコン化されたものがダウンロードできるようになっています。

詳しくは以下

(さらに…)

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

さまざまな光の形を演出できるPhotoshopブラシまとめ「20 Free Light Effects Photoshop Brushes」

Photoshopの中でもデザイナーがよく利用するブラシツールは、手軽にいろいろな描写ができる点が非常に便利です。今回はそんなブラシで、さまざまな光の形を演出できる「20 Free Light Effects Photoshop Brushes」を紹介したいと思います。

light0
Radiant Brush Set – Free Photoshop Brushes at Brusheezy!

光やきらめきを描き出せるPhotoshopブラシが多数紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Photoshop   
2015年09月16日

200種の細めラインで構成されたアイコンセット「200 Nanoline Icons」

アイコンには実にいろいろな種類があり、デザインしているもののテイストによって使い分けていると思いますが、今回は200種の細めラインで構成されたアイコンセット「200 Nanoline Icons」を紹介したいと思います。

icon0915

非常に細い、繊細なラインで描き出されたアイコンが200種、セットでフリーダウンロードできるようになっています。

詳しくは以下

(さらに…)

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

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

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

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

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

関連サイト

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

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