🖼️ サンプル画像
📄 作品概要
内容紹介 Webブラウザー上で「カードが動くタロット占い」を作る本です。 画面上にカードを並べ、シャッフルし、配るものです。最終的に表側になったカードの内容をもとに、占い結果の文章を出力します。 実現方法はいくつかありますが、今回は次のような方針で作ることにしました。 * 使用言語はJavaScript * canvasに描画する * Tween方式でアニメーションする * PC、スマホで使うことを想定して、画面サイズに合わせて初期canvasサイズを変える * 結果の文章は、canvasの外にテキストとして出力させる * 既存のWebサイトに占いページを追加することを想定する * 最終的にライブラリーとしてファイルをまとめる canvasへの描画は、『Pixi.js』を使います。ゲーム用の有名ライブラリーで、WebGLを利用して高速に描画できます。 Tween方式のアニメーションは『Anime.js』を使います。軽量で使いやすいアニメーション用のライブラリーです。DOM要素を動かすだけでなく、オブジェクトのプロパティの値をアニメーションできます。 この2つのライブラリーは、いずれもMIT...
