GTSportのユーザーデカールでSVGを作るコツや表示されない場合の対処など
PS4用のGran Turismo SportではプレイヤーがSVGファイルを投稿して自由に車体をデザインできるユーザーデカール機能があるのですが、SVGファイルであれば何でも良いわけではなく、条件がいくつかあり ユーザーデカールで使用できるSVGファイルには以下の条件があります。 ・ファイルサイズが15kb以下であること ・文字がアウトライン化されていること ・乗算、加算など特殊な描画（ブレンド）モードが使われていないこと ・ビットマップ画像が埋め込まれていないこと ・SVGのバージョンが1.0、ないしは1.1であること ※グラデーションについては、シンプルな形式の物のみ対応しています。 ※サムネイルで表示される領域はSVG ビューポート設定に依存します。 ユーザーデカールのアップロードに関するTips - グランツーリスモ・ドットコム こうしたルールが規定されています。 なぜならSVG
たった50行でゲームも作れる！SVG描画ライブラリーの新顔GraphicsJSが登場
SVGを使った、軽量で強力なグラフィック描画ライブラリー「GraphicsJS」が登場。シンプルなゲームを例に、基本的な使い方を開発者自らが解説します。 HTML5は最近のWebにおける中心的な存在です。そして今日のインタラクティブな画像作成においては、SVGとCanvasが多くの人が好んで使う技術になっています。Flashは忘れ去られ、SilverlightはWebのどこかに生息する希少動物のユニコーンのようになり、サードパーティー製プラグインのことを覚えている人はほとんど見かけなくなりました。 SVGとCanvasについてそれぞれの長所も短所もよく議論されていますが、インタラクティブ要素を作成したり操作したりする場合にはSVGがより適しています。SVGはXML言語ベースのベクター形式であるため<svg>タグを使って画像をページに読み込めばすべてのエレメントがSVG DOMで利用可能にな
アドビがFlashの名を捨ててでも守りたかったもの
みなさん、こんばんは。ASCII（週刊アスキー＋ASCII.jp）の吉田ヒロでございます。本日は、先ほどアップデートがかかったアドビ システムズのウェブ系開発ツールをご紹介したいと思います。アドビのウェブ開発ツールとしては、コードを書かずにサイトデザインが可能な「Muse CC」、コード編集を伴う高度なウェブサイト構築が可能な「Dreamweaver CC」、ウェブ用のインタラクティブコンテンツの制作が可能な「Animate CC」の3つがあります。 今回、アップデートされるのは、Muse CCとAnimate CCの2製品。多くのみなさんが聞き慣れないかと思いますが、Animate CCというのは元Flash Professionalのことです。ASCII読者なら、一時は一世を風靡したFlashの現状をご存じかと思いますが、いちおう変遷を説明しておきます。 2000年代中盤まで、Flas
拡張機能Snap.svg Animatorを使ってAnimate CCからSVGを書き出そう - ICS MEDIA
（注記）この記事で紹介の「Snap.svg Animator」はすでに公開が終了しています。この記事の内容はアーカイブとして残していますが、動作しないためご注意ください。 SVGエス・ブイ・ジーとはHTMLでベクターグラフィックスを扱えるテクノロジーです。JPEGやPNGなどのラスターデータに対し、SVGはベクターデータのため拡大縮小に強いことが利点です。本記事ではこのSVGを使ってHTMLでアニメーションを実現する方法を紹介します。 まず前提としておさえておきたいのは、SVGでアニメーションやインタラクションを実装するには比較的低レベルのAPIの理解が必要となるということです。SVG 1.1 仕様の学習コストが高かったり、コンテンツ開発時の生産効率が上がらないといった課題が考えられます。そのためアニメーションやインタラクション用途のSVGコンテンツの開発にはJavaScriptライブラリ
いまさら聞けないSVG——Web制作に便利な3つの理由 (1/2)
スマートフォン向けのWebサイトやWebアプリを中心に、「SVG」がいま再注目されています。単なる画像フォーマットを超えて、最近ではさまざまな表現に広く活用されるようになりました。 本連載では、SVGの概要から基本的な使い方、Web制作での活用方法までをじっくり解説。CSSによる装飾やJavaScriptとの連携など、すでに使っている人がもっと使いこなすためのテクニックも紹介します。（編集部） Webの表現を広げるSVGの魅力 SVGと聞くと、「単なるベクターの画像でしょ」と思う方も多いでしょう。確かにSVGは「Scalable Vector Graphics」の略なので、ベクター形式の画像フォーマットであることには間違いありません。 一方で、SVGには、PNGやJPEGといった、他の画像フォーマットとは異なる魅力があります。SVGをWebページに使うことで、これまでのHTMLやCSSだけ
サンプルコードで学ぶ SVGの読み方、書き方 (1/2)
SVGの概要から基本的な使い方、Web制作での活用方法までをじっくり解説する本連載。前回はSVGができることをおおまかに解説しました。今回は、SVGの仕様をもとに、SVGの書き方、読み方の基礎を学びます。 SVGを描く、そして書く SVGは画像であり、コードを書かずとも、ツールで描けます。例えば、Adobe IllustratorやInkscape、Sketchなどのドローソフトを使えば、画面の操作のみでSVGファイルを作成できます。 ドローソフトを使って用意したSVGファイルは、HTMLでimg要素、あるいはCSSの背景画像などとして読み込むことで、手軽にWebページの一部として表示できます。 <img src="example.svg" alt="" width="600" height="400"> .example{ background: url( example.svg );
SVGアニメーションの現状 | POSTD
SVG（Scalabe Vector Graphics）の世界は魅力的です。そして、これを使ってできることや、これに用意されているオプションには圧倒されてしまうほどです。 SVGはXMLベースの2次元ベクター画像形式で、インタラクティビティとアニメーションをサポートします。言い換えると、SVGは図形やグラフをレンダリングするXMLタグで、その図形やグラフはHTMLの構成要素がそうであるように、インタラクトしたりアニメーション化したりできるのです。 SVGに関して、私がよく受ける質問の1つは、SVG画像のアニメーション化についてです。そのやり方だけではなく、それが何なのかということも聞かれます。ですから、現在の（そして未来の）SVGアニメーションの状況を見ながら、あなたが苦痛を感じずに行えるようなヒントやツールについてお話ししましょう。 同期マルチメディア統合言語、またの名をSMIL（Syn
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
森猫日記 - Wikipediaグループ
くあっどさんのツイート: "3件のコメント https://t.co/38f0ZJxMSh “SVG実習マニュアル 大黒学” https://t.co/coMRvYPLt7"
GraphicsJS | AnyChart
Introducing GraphicsJS, a Powerful Lightweight Graphics Library — SitePoint
popoyo on Twitter: "解説が充実してるSVGのチュートリアルを見つけた！ https://t.co/uJhVjhOWi7 https://t.co/ZIkbSi0Wl2"
Tumblr
はてなブログ | 無料ブログを作成しよう
anime.js
povray - 僕らのはてブ
SVGをHTML内で表示する4つの方法 | Design0
Tumblr
Tumblr
激まとめニュース on Twitter: "Suzuki Ken’ichiさんはTwitterを使っています: “SVGでアニメーションやJavaScriptが動くことを知る。 http://t.co/6DmfChvVq9” 詳細:http://t.co/h7PjFzoMAx"
