Canvas

2025-07-12 | lain

Webアプリでの動画再生は、単なる<video>タグだけではありません。本記事では、JavaScriptやCanvasを活用した動的な動画再生方法を4つ紹介し、それぞれの特徴や使いどころを比較します。演出・UI・アニメーションと組み合わせたい方におすすめです。

カテゴリ： AI動画制作

タグ： #動画再生#videoタグ#JavaScript#Canvas#UI演出#Webアニメーション#ゲーム開発#HTML5#メディア制御#技術記事

2025-12-11 | lain

HTML5 CanvasとJavaScriptで、ボスの複合当たり判定・弾幕処理・HPゲージ・撃破演出まで実装した流れをまとめました。楕円当たり判定の公式も解説しています。

カテゴリ： JavaScript

タグ： #canvas#game#hit-detection#boss-battle#bullet-hell

2025-12-05 | lain

[Human x AI] ChatGPT(5.1)との対話録～物理演算とパラダイムシフト～

カテゴリ： Human x AI

タグ： #ChatGPT-5.1#対話ログ#javascript#CANVAS#ゲーム開発#物理演算#パラダイムシフト#数学

2025-12-02 | lain

[Human x AI] ChatGPT(5.1)との対話録～技術力より表現力～

カテゴリ： Human x AI

タグ： #ChatGPT-5.1#対話ログ#javascript#CANVAS#物理演算#表現力

2025-11-27 | lain

[Human x AI] ChatGPT(5.1)との対話録～過去の憧れとジレンマ～

カテゴリ： Human x AI

タグ： #ChatGPT-5.1#対話ログ#javascript#canvas#requestAnimationFrame#個人開発#ゲーム開発#バイブコーディング#デバッグ#非同期処理#MSX#PC-98#グラディウス#ブロック崩し

2025-11-18 | lain

[Human x AI] ChatGPT(5.1)との対話録～「AIと伴走した半年を振り返る」～

カテゴリ： Human x AI

タグ： #ChatGPT-5.1#対話ログ#javascript#canvas#requestAnimationFrame#個人開発#ゲーム開発#バイブコーディング#デバッグ#非同期処理

2025-11-14 | lain

ゲーム開発やアニメーションの描画処理でよく使われる `ctx.save()`, `ctx.restore()`, `ctx.translate()`, `ctx.scale()` の使い方を解説します。

カテゴリ： JavaScript

タグ： #2D描画#Canvas#ゲーム開発

2025-11-13 | lain

Phaser.jsを使ったゲーム開発と、ネイティブCanvasを使ったゲーム開発を比較し、それぞれのメリットとデメリットを紹介。簡単なブロック崩しゲームを通じて学べるポイントも解説します。

カテゴリ： JavaScript

タグ： #Phaser.js#Canvas#ゲーム開発#ブロック崩し

2025-11-11 | lain

レスポンシブデザインにおけるcanvasとHTML/CSSの同期方法を解説。画面サイズに応じた動的な描画を実現するためのポイントを紹介します。

カテゴリ： JavaScript

タグ： #canvas#responsive-design#HTML#CSS

カテゴリ：Canvas