田口和裕の「ChatGPTの使い方！」

知識ゼロでも動くプログラ厶が作りたいなら、AI「Claude」とJavaScriptライブラリーを使うのがオススメ

いろんなライブラリーを探す

　次はChart.js以外のライブラリーを使ってみよう。と言われてもどんなライブラリーがあるのか見当もつかない……。そんなときはClaudeに聞いてみればいいのだ。

プロンプト：ビジュアル的にかっこいいものを作成できるClaudeで使えるJSライブラリーをたくさん教えて

　このプロンプトで教えてくれたのが以下の10種類だ。

D3.js
特徴：データ駆動型のドキュメント操作のための強力なライブラリ
用途：複雑なデータビジュアライゼーション、インタラクティブなグラフィックス

Three.js
特徴：WebGLを使用した3Dグラフィックスライブラリ
用途：3Dアニメーション、ゲーム、データビジュアライゼーション

P5.js
特徴：クリエイティブコーディングのためのライブラリ
用途：インタラクティブなアート、ビジュアルデザイン、アニメーション

Anime.js
特徴：軽量でパワフルなアニメーションライブラリ
用途：スムーズなウェブアニメーション、モーショングラフィックス

Plotly.js
特徴：高度なグラフ作成ライブラリ
用途：インタラクティブな科学的グラフ、ダッシュボード

Leaflet.js
特徴：モバイルフレンドリーな地図ライブラリ
用途：インタラクティブな地図、位置ベースのビジュアライゼーション

Vega-Lite
特徴：宣言的なデータビジュアライゼーションライブラリ
用途：統計グラフ、複雑なチャート

Particles.js
特徴：軽量なパーティクルアニメーションライブラリ
用途：背景アニメーション、インタラクティブな粒子効果

Chart.js
特徴：シンプルで柔軟なチャート作成ライブラリ
用途：レスポンシブなチャート、データビジュアライゼーション

Paper.js
特徴：ベクターグラフィックススクリプティングフレームワーク
用途：複雑な2Dグラフィックス、インタラクティブなアニメーション

　どれもおもしろそうなことが書いてあるが、今回は「P5.js」というライブラリーを使ってインタラクティブなアートを作ってみることにした。