わかりにくい線形代数を操作可能な図で表現することで簡単に理解できる無料の教科書「Immersive Math」
「Immersive Math」は、数学のうちベクトルや行列などの計算を研究する分野である「線形代数」についてインタラクティブな図を用意することでわかりやすさを向上させた無料の教科書サイトです。 Immersive Math https://immersivemath.com/ila/index.html サイトのトップページはこんな感じ。「完全にインタラクティブな図を備えた世界で最初の線形代数本」と述べられています。 中央に表示されている三角形の図はインタラクティブで、左上をクリックすることで回転・停止を切り替えられるほか、各頂点をクリックしてドラッグ＆ドロップすることで位置を調整可能。自由に図を編集できるため理解しやすいというわけです。 ページをスクロールすると目次が現れました。まずは「Preface(序文)」をクリック。 「『百聞は一見に如かず』という言葉の通り、たくさんの言葉を重ね
誰でもWeb上でリアルに動くHTML5アニメーションを製作できる「Animatron Studio」を使ってみた！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、ブラウザ上から誰でも簡単にHTML5で作られたアニメーションを製作できるWebサービスをご紹介します！ Webサイトやサービスに組み込んで動きのあるコンテンツを作成したり、企業ロゴやバナー広告、商品紹介、インフォグラフィック…など、とても幅広い分野に応用することが可能です。 ブラウザさえあれば今すぐアニメーションを作れるので、ぜひみなさんもオリジナル作品を作ってみてください！ 【 Animatron Studio 】 ■「Animatron Studio」とは？ 「Animatron Studio」は、とにかく誰でも簡単にアニメーション製作ができることを前提に設計されています。 豊富なイラストやテンプレートを自在に組み合わせることで、わずかなマウス操作だけで楽しいアニメーションを次々と作っていくことが可能です。 例えば、以下のようなアニ
コード不要で手描き風のSVGアニメーションを自動作成できるエディタ「Vivus Instant」の使い方大公開！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、誰でも超簡単にSVG画像をアニメーション化できる無料のWebサービスをご紹介します！ このサービスは、JavaScriptでSVG画像を制御できる「vivus.js」をベースにしており、誰でもプログラミング不要で簡単に「手描き風」のアニメーションを作れるのが特徴です。 【 Vivus Instant 】 そして本記事の後半では「vivus.js」を使った基本的なプログラミングについても解説しているので、ご興味ある方はぜひ参考にしてみてください！ ■「Vivus Instant」とは？ それでは、実際に「Vivus Instant」を使いながら、どのようなサービスなのかを見ていきましょう！ まずは、サンプルとして次のようなSVG画像を用意しました。 SVGは、ベクター形式で描かれたXML構造を持つデータですが、このままでは当然ながら静止画
調整も楽々！CSSアニメーションをその場で確認できる「Animista」の使い方を解説
眼球を捉えるようなユニークな動きをするアニメーションを絶妙なタイミングで取り入れることで、ユーザーの興味を引いて離脱を防げる確率が高くなります。 アニメーションはHTML5やCSSでも簡単なものであれば実装することができますが、10年前にAdobe Flashを使って表現していたような複雑なアニメーションを実現するために、CSSやJavaScriptを使ったライブラリを取り入れている方もいらっしゃるのではないでしょうか。 しかし、ライブラリには大抵デモページがついているものの、基本的なアニメーションの確認しか行うことができないものがほとんどです。 実際のところこうしたアニメーションライブラリにはアニメーションの速度やタイミングなど、さまざまなオプションがあり、オプションを活用することで、より活き活きとしたアニメーションを実装することができます。 ところが、デモページではこれらの詳細まで微調
モバイルにおける入力フォーム最適化(EFO)の７つのルール
皆さんのアプリやサイトを利用するモバイルユーザーには、特定の目的があります。そして多くの場合、ユーザーとその目的の間に立ちはだかっているのはフォームです。 実際には、フォームは目的を果たすための道のりにおいて、最後のステップであると考えられることが多いです。だからこそ、ユーザーが戸惑うことなくできる限り早くフォーム入力を完了できるようにすることが重要なのです。 次の７つのルールに従って、素早く簡単に完了できるフォームを作りましょう。 ルール１：フォーム表示をふさがない キーボードなどのインターフェース要素により、フォーム表示がふさがれないようにしましょう。ユーザーがフォームへの入力を完了したら、入力フィールドを自動的に画面の上へ送るようにしましょう。
花火大会をみんなでつくろう！ - jsdo.it - Share JavaScript, HTML5 and CSS
今年の「鎌倉花火大会」は、残念ながら中止になりました。 その代わりにはなりませんが、jsdo.it上で花火大会を開催します。 「hanabi」タグをつけて花火のアニメーションを投稿すると、 花火会場にあなたの花火が打ち上がります。 花火職人のみなさんへ 「hanabi」のタグがついたコードが会場で打ち上がります。 各コードはiframeで表示され、徐々にフェードアウトしつつ約3秒間表示されます。 他の花火と重なることはありません。背景は黒(#000)もしくは透過で作成してください。 画像から花火を作ってみよう！ 1. THE花火職人 / Fireworks Generatorに画像をドラッグ＆ドロップして配列を生成します。 2. 以下のコードをフォークして、htmlのscriptタグの中に生成した配列を貼り付けます。 → やらない花 注目の花火 これらの花火をあなたらしくアレンジ（＝フォー
動画をアニメーションGIFに変換するウェブアプリケーション作った - hitode909の日記
rokugaっていうウェブアプリケーションを作った．ブラウザ上で動画をアニメーションGIFに変換できる．Google Chromeでもちょっと動くけどSafariで見るのが良い． http://rokuga.herokuapp.com/ 使い方 こんな感じで，動画をドロップしてくださいとか言ってる． 1コマずつ出てきて，このコマとこのコマ，この速さ，みたいな指定ができる． 完成したアニメーションGIFは名前を付けて保存しましょう． 特徴 ブラウザで再生できる動画なら何でも変換できる Macなら動画はQuickTime Playerで撮れるので気軽に使える リアルタイムにプレビューしながら仕上がりを確認できる コマ送りは逆再生，行ったり来たり，シャッフルに対応 Herokuで動かしたらCPUが遅くて動画の変換にす時間かかる git cloneしてローカルで動かすとちょっと速い ソースコード→
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://twitter.com/t_takasaka/status/1570716749565231104
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
HTML5のアニメーションを簡単に作成できるサイト「HTML5 MAKER」 | ライフハッカー・ジャパン