• ホーム
  • このブログについて
  • Flipsについて

Flips Blog Web担の小技

ウェブ担当者の為の小技&小ネタ

SVGローディング画像をサクッと作れるループアニメシュミレータ「SVGサーカス」

0
  • 投稿者: Yamada_nt
  • カテゴリー: サービス · 無料アイコン · 無料素材
  • — 2014年12月26日

SVGアニメーションTool

音速でこのサービスはブクマしとくといいよね。

SVGローダーは今年は結構使われるようになってきましたので、来年はさらに使う機会も増えるんじゃないでしょうか。

今回ご紹介するのは、そんなループアニメアイコンであるSVGローダを手軽に作ることができるWebサービスです。

SVGローダについては以前書いた記事も参考にしてみてください。

CSSやJSで純粋に構築された小さなローディングアイコン「SVGローダー」 |

SVGローダー

すぐに作れます

SVGサーカスにアクセスします。

SVG animation tool | SVG Circus

1から作るのがめんどい人は、以下のプルダウンメニューから、各種サンプルを呼び出すことが出来ます。

SVGCIRCUS

ここでアイテムの追加やコピーが出来ます。

アイテムの追加やコピー

追加されたアイテム。レイヤーとしても機能している。

アイテム

各種設定、動作の設定やサイズ等。

サイズや動作の設定

完成したらexport。

完成

ね、簡単でしょう。

是非チェックしてみてください。

それでは、また。

このエントリーをはてなブックマークに追加
Pocket

Share

タグ: サービスデザイン素材

Flips 手軽に始めるビジネスホームページ

— Yamada_nt

1999年より、Web制作、ウェブサイト運営支援を行なっており、Web担当者へお勧めの情報を共有しています。2007年より「ホームページを作る人のネタ帳」というブログをはじめ、現在はプロブロガーとして生活。 2008年、アルファーブロガーアワード受賞。 全国各地でブログセミナーや、サイト運営に関する様々な運営ノウハウセミナーなども行なっております。

  • 前の記事 Webデザイナーなら地味だけどちょっと便利!と感じるChromeエクステンション
  • 次の記事 美しすぎるデスクトップ壁紙サイト「Photography Wallpapers」で気分を一新してみよう|タブレットも

関連する記事

  • EXCELテンプレート 請求書、領収書、勤怠管理、見積書、事業計画書、工程管理、作る前にExcelのテンプレートサイトを確認しよう 2014年11月20日
  • HTML5メーカー 無料で使えるHTML5スライドメーカーでWebサイトを飾る事が出来る「html5maker」 2014年03月28日
  • 可愛すぎるブラシ集 永久保存版すぎる超かわいいPhotoshopのブラシ集 2014年11月15日
  • パララックス効果 あぁこれがパララックス効果の使い方かと納得のパララックスWebデザイン7つ 2014年01月25日
  • 新しい記事

    • 新着記事
    • タグ
    • クリエイターInstagramアカウント海外で人気のデザイナーのInstagramアカウント2016年5月24日
    • スワイプ対応レスポンシブでスワイプをサポートしているjQueryカルーセルプラグイン2016年5月13日
    • サイコロブロガーが陥る「サイコロのふりすぎ」と「時間の使いすぎ」問題2016年4月30日
    • デザインエディタ最近見つけたBeFunky Photo EditorとかいうWebフォトエディタサービスがスゴイ2016年4月29日
    • 新入社員研修とある新入社員研修の無駄なこと無駄なこと・・・2016年4月26日
    • Adobe CSS Excel Facebook Google Illustrator JavaScript jQuery Mac Photoshop SEO SVG お知らせ アイコン インスピレーション エクセル サイト運営 サービス デザイン パワーポイント フォント フラットデザイン フリーソフト ブログ プレゼン マーケティング ライフハック 中小企業に訊く 便利 文章術 素材 運用
  • 記事の検索ができます

  • 人気記事

    • 国内人気のクレジット不要、商用利用可の無料素材サイト24+シェアランキング
    • 2015下半期Webデザイナー、ディレクターなら絶対読んでおかないと後悔する厳選記事まとめ
    • 今度こそ3日で覚えるパワーポイントテクニック集、デザイン、表現力アップまとめ
    • 配色センスが全くない?それならマテリアルパレットをちょっと使ってみて?
    • 適切な伝え方|とにかく人にものを伝えるのが苦手な人が一度は読むべき5つのコツ
    • 20以上のレスポンシブ対応の無料htmlテンプレート HTML5UP
    • 無料素材のチョークデザイン100個|バッジ、リボン、インフォグラフィクス等
    • 2014年版ブログにトラフィックを集める7つの方法
    • ちゃちゃっとCSSで色々とやりたい時に激しく便利なサイトとまとめ記事
  • アーカイブ

  • Twitter

    @flips_jp からのツイート
  • Facebookページ

  • 最近の投稿

    • 海外で人気のデザイナーのInstagramアカウント 2016年5月24日
    • レスポンシブでスワイプをサポートしているjQueryカルーセルプラグイン 2016年5月13日
    • ブロガーが陥る「サイコロのふりすぎ」と「時間の使いすぎ」問題 2016年4月30日
    • 最近見つけたBeFunky Photo EditorとかいうWebフォトエディタサービスがスゴイ 2016年4月29日
    • とある新入社員研修の無駄なこと無駄なこと・・・ 2016年4月26日
  • カテゴリ

    • Chrome
    • JavaScript
    • SEO
    • Webデザイン
    • おしらせ
    • サイト運営のコツ
    • サービス
    • ソーシャルメディア
    • テンプレート
    • フリーソフト
    • フリーフォント
    • プレゼン資料の作り方
    • ライフハック
    • 未分類
    • 無料アイコン
    • 無料素材
  • サイト内検索

© Copyright 2019 Flips Blog Web担の小技. Typegrid Theme by WPBandit.