https://ai.negi-lab.com/tags/html-canvas-%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3/Recent content in HTML Canvas アニメーション on Negi AI Labhttps://ai.negi-lab.com/images/og-default.pnghttps://ai.negi-lab.com/images/og-default.pngHugo -- 0.154.5jaSun, 17 May 2026 15:29:07 +0900https://ai.negi-lab.com/posts/local-qwen-coder-html-canvas-tutorial/Sun, 17 May 2026 00:00:00 +0900https://ai.negi-lab.com/posts/local-qwen-coder-html-canvas-tutorial/<p><strong>所要時間:</strong> 約40分 | <strong>難易度:</strong> ★★★☆☆</p> <h2 id="この記事で作るもの">この記事で作るもの</h2> <ul> <li>Qwen 2.5 Coder 32Bをローカル環境で動かし、物理演算を含むHTML Canvasアニメーションを1発で生成します</li> <li>ブラウザだけで動作し、パーティクルの衝突や重力シミュレーションを実装したシングルファイルHTMLを完成させます</li> <li>前提知識：ターミナルでのコマンド入力に抵抗がなく、HTML/JavaScriptの基礎（タグや変数の意味）がわかること</li> <li>必要なもの：VRAM 12GB以上のNVIDIA製GPU、またはメモリ24GB以上のApple Silicon搭載Mac</li> </ul> <div style="border:1px solid #e0e0e0;border-radius:8px;padding:16px;margin:20px 0;background:#fafafa"> <p style="margin:0 0 4px;font-size:13px;color:#888">📦 この記事に関連する商品（楽天メインで価格確認）</p>