TOP  >  ローディング

Tag : ローディング

2017年01月04日

CSSとテキストで実現するシンプルなローディングアニメーション「text-spinners」

WEBの演出の一つで、UXのストレスを軽減してくれるローディングアニメーション。WEBサイトがだんだんリッチになる中、当たり前の存在になってきていますが、今回紹介するのはCSSとテキストで実現するシンプルなローディングアニメーション「text-spinners」です。

textloading0

通常ローディングアニメーションはいくつかの画像を利用して生成されますが、このアニメーションはCSSとテキストのみで制作されるため非常に軽量です。

詳しくは以下

(続きを読む…)

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

CSSのみで実現するカラフルポップなローディングアニメ「CSS PIN」

WEBサイトに欠かせないUI/UXの一つローディング。この小さなアニメーションで多くのストレスが軽減でき、かつ世界観を表現できます。ローディングアニメーションには様々な作り方がありますが、今回紹介するのはCSSのみで実現するカラフルポップなローディングアニメ「CSS PIN」です。

csspin

全部で10個のローディングアニメーションが公開されており、どれもクリエイティブでポップな印象を受けます。

詳しくは以下

(続きを読む…)

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

CSSのみで制作されたローディングアニメーションセット「CSS Loader」

CSSのみで制作されるアニメーションは軽量でシンプルで非常に使い勝手も良く、国内でもブラウザの制限が商業レベルでも外れてきた今、数多く活用されはじめてきていますが、今日紹介するのはCSSのみで制作されたローディングアニメーションセット「CSS Loader」です。

cssloder

ローディングアニメーションはWEB制作の現場でも比較的利用頻度が高く、最近の画像中心のWEBサイトでは必ずと言っていいほど実装するためCSSのみで利用できるのは非常に魅力的です。

詳しくは以下

(続きを読む…)

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

webサイトなどの読み込み・待機中に利用したい フリーのローディング&プログレスバー13種「13 Free PSD Loading & Progress Bar Designs」

webサイトにアクセスした時や、重たいデータを読み込みする際に使用するローディング&プログレスバー。シンプルなデザインのものが多いですが、しっかりとデザインされたものが配置されていると、サイトクオリティをより高めることができます。今回はそんな時に参考にしたい、フリーのローディング&プログレスバー13種「13 Free PSD Loading & Progress Bar Designs」を紹介したいと思います。

loading1
Dribbble – Round Progress Meter (PSD Freebie) by Marco Moreno

デザイン的に非常に優れ、なおかつフリーで使用できるものが厳選され紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

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

クリエイティブなローディングが簡単に実装できるjs「Creative Loading Effects」

回線環境も機器も整ってきて、快適な環境であればほぼストレス無くWEBを閲覧できますが、本当に大きなデータを読み込ませたり、通信環境も考慮すると必要になってくるのがローディングです。ユーザーの待ち時間のストレスを緩和してくれるものですが、今日紹介するのはクリエイティブなローディングが簡単に実装できるjs「Creative Loading Effects」です。

CreativeLoadingEffects

幾つかのエフェクトが予めセットされており、それぞれのエフェクトを指定することで、簡単にローディングを実装することが可能です。幾つかエフェクトの種類についてキャプチャがありますので下記からご覧ください。

詳しくは以下

(続きを読む…)

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

インターフェースを整えるために欠かせないPSD素材まとめ「110 Free Progress / Loading Bar PSD Designs」

WEBサイトを活性化させるためには、WEBデザインの基本的なインターフェースを整えるのはもちろんですが、ページの切り替わりやローディング時にパーセンテージを表示したりと細かいところに気遣うことで、ユーザーの滞在時間も大きく変わってくるもの。そんな中今回紹介するのが、インターフェースを整えるために欠かせないローディングバーなどのPSD素材をまとめた「110 Free Progress / Loading Bar PSD Designs」です。


Progress Bars | Best PSD Freebies

シンプルなテイストから、演出にもこだわったPSD素材が多数紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

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

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

2017年04月18日

プレゼンテーションにも最適な、フリーのタブレットモックアップまとめ「22+ Free Tablet Mockups For Your Presentations」

ノートPC代わりに持ち歩く人も多く、年々利用者が増加しているタブレット。Webデザインにおいても無視出来ない存在です。今回はそんなタブレット端末でデザインを見せるときに便利なモックアプまとめ「22+ Free Tablet Mockups For Your Presentations」を紹介します。

13-freebie-tablet-pc
Free Tablet PC Mock-up on Wooden Background For Graphic Designers

フルCGで作られたシャープなものから、写真ベースの温かみのあるものまで、多数のモックアップが揃っています。気になったものをピックアップしてご紹介しますので以下よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
2012年01月08日

新しいクリエティブなフリーフォント10「10 Fresh Free Fonts」

デザイン制作をする上で、重要な要素の一つ、フォント選び。選ぶフォントによって、デザインが大きく左右され、その影響力は非常に大きなものです。今日紹介するのは、比較的発表されてからまもなく、クリエイティブなフォントを集めたエントリー「10 Fresh Free Fonts」を紹介したいと思います。


Lavanderia

正統派でシンプルというよりも、タイポ中心のデザインでも充分通用するようなクリエイティブなフォントが集められています。今日はその中から幾つか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

続きを読む
posted 08:53  |  
Category: Design , Font   
2015年06月22日

幾何学的にデザインされたフリーフォント「20 Gorgeous Free Geometric Fonts to Download」

さまざまなテイストのデザインフォントが展開されており、いろいろな種類をストックされている方も多いかと思います。そんな中今回紹介するのは、幾何学的にデザインされたフリーフォント「20 Gorgeous Free Geometric Fonts to Download」です。

geometricfonts1
PIER SANS // FREE TYPEFACE with 4 New Styles on Behance

幾何学的とありますが、シンプルなテイストをベースに個性が演出されたフォントが揃っています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 11:16  |  
Category: Font   
2014年05月01日

いろいろなデザインに使用できる 多彩な種類の素材をまとめた「50 fantastic freebies for web designers, May 2014」

デザイン制作をする時には、いろんな種類の素材を使用して作り上げていくことも多いと思います。今回はそんなシーンにおすすめのまとめ「50 fantastic freebies for web designers, May 2014」を紹介します。

free0501_1
Purple UI Kit Flat Responsive web template by w3layouts

フォント、テクスチャ、UI、psd、JS、CSSといった多彩な素材が紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 02:26  |  
Category: Design   
2016年01月06日

便利なフリーリソースが集約された「50 Free Resources for Web Designers from December 2015」

常に最新の情報をチェックしておくことで、トレンドのデザインをより魅力的に見せることができるのではないでしょうか?そんな時に参考にしたい、便利なフリーリソースが集約された「50 Free Resources for Web Designers from December 2015」を今回は紹介したいと思います。

resources0107_1
Dallegrave Free Brush Typeface on Behance

昨年2015年末に公開されているまとめ記事で、非常にクオリティの高い素材が多数紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

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

光を描くフリーphotoshopブラシ集「Great Abstract Photoshop Brushes」

様々な印象を与える事ができる光。それは強さだったり光の色だったり描き方だったりで印象を変えますが、今日紹介するのは様々な光を表現する為のフリーphotoshopブラシを集めたエントリー「Great Abstract Photoshop Brushes for Light Effects #2 | Abduzeedo – design inspiration & tutorials」を紹介したいと思います。


Quantum Brushes

全部で12個のphotoshopブラシが公開されています。今日は公開されているものの中からいくつか気になったものをピックアップして紹介したいと思います。

詳しくは以下

(続きを読む…)

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

取り入れるだけで印象的なデザインに!アクセントに使えるフリーフォント19選

デザインの世界観を大きく左右するデザインフォントは、常に多くのバリエーションを揃えておきたいもの。今回はご紹介するのはアクセントとして使用出来る、インパクト抜群の印象的な英字フリーフォントをまとめた「Fresh Free Fonts for Designers」です。

free_handwritten_fonts

手書き風のフォントからカリグラフィー風に描かれたものまで、印象的でデザイン性の高いフォント19種類が一同に揃います。おすすめのフォントを幾つかピックアップしてご紹介しますので、以下よりご覧下さい。

詳しくは以下

(続きを読む…)

続きを読む
posted 10:00  |  
Category: Design , Font   
2017年07月29日

WEBデザイナーならチェックしておきたい活用できる最新素材まとめ「12 Freebies & Goodies For Web Designers」

Webデザインを行う際は、レスポンシブによる見栄えやUI設計への考慮など、さまざまな箇所に気を配らなくてはなりません。UIは日々進化しており、ユーザーが快適な使用ができるようにきちんと追いついていきたいもの。そんな方におすすめの、最新のUIキットなどがまとめられた「12 Freebies & Goodies For Web Designers」を今回は紹介します。

webdesignfreebies_topkeyboard

モックアップやWordPressのテンプレート、フォントなどがまとめられています。気になったものをいくつかピックアップしているので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
2013年07月28日

いろいろなデザインで活用できる ミニマルデザインフォントまとめ「19 Free And Stylish Minimalistic Fonts For Your Designs」

インターネット上で配布されている素材の中でも、活用の幅の広いフリーフォント。特にシンプルで汎用性の効くタイプは1つでも多く持っておきたいものです。今回そんなタイプのミニマルデザインフォントまとめ「19 Free And Stylish Minimalistic Fonts For Your Designs」を紹介したいと思います。

minimalfont2
Simple Ronde Font | dafont.com

いろんなデザインに使用できそうなフォントが19種、ビジュアルイメージと共に公開されています。いくつかピックアップしていみましたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

続きを読む
posted 12:38  |  
Category: Font   
2013年09月06日

ライター・ブロガーのためのフリーWordPressテーマ「Free WordPress Themes For Writers & Bloggers」

CMSの中でもっともポピュラーと言えるWordPress。もともとはブロガーのプラットフォームとして作られたシステムが、近年では様々な用途に使われています。そんな中今回紹介するのは、ライター・ブロガーに向けたのフリーのWordPressテーマまとめ「Free WordPress Themes For Writers & Bloggers」です。

wp_0
Cascade

シンプルなものから特徴的なもの、実用性を重視したものなどさまざまなテーマがまとめられています。気になるものをピックアップしたので、下記よりご覧ください。

詳しくは以下

(続きを読む…)

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

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

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

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

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

関連サイト

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