Anthoropic Claude sonet 3.7sonet and P5.js

 

 

このプロンプトやってみて!

300匹の小さな魚が群れをなして泳ぐ姿のシミュレーションをp5jsを使って作って。Windowを水槽に見立てて、壁にぶつからないようにして

これは、@snakajimaさんのX.comからアイデアを拝借!


https://x.com/snakajima/status/1894382189720092770

 

■P5.js とは?

p5.js(ピーファイブ・ドット・ジェイエス)は、JavaScriptベースのライブラリで、クリエイティブなコーディングやビジュアルメディアの作成を可能にしてくれる。

【特徴】
    • 絵を描くようにプログラムを作成できる
    • キャンバス上で図形や画像を描き、動かすことができる
    • WebGLを活用した3D表現ができる
    • テキストや入力、ビデオ、ウェブカメラ、サウンドなどのHTML5オブジェクトを含むブラウザのページ全体をスケッチと考えることができる
  • 無料でオープンソース

【活用例】アニメーションの作成、ゲーム風の読み込み画面の作成、アートやデザイン、 学習教材。

【利用方法】
  • オンラインエディターで作業することもできる
  • お気に入りのエディターを使用することもできる
  • YouTubeにはたくさんのチュートリアルがある
【メリット】
  • 視覚的なプログラミング手法である
  • ウェブブラウザ上で実行可能
  • 即座にフィードバックを確認できる
  • クロスプラットフォームに対応している
【開発背景】
  • Processingという電子アートのプログラミング言語をJavaScriptで使用できるようにしたライブラリ
  • デザイナやアーティストなど普段プログラミングに慣れていない人たちが手軽に、Web上でビジュアルメディアの作成が行えるよう設計されている

show content.  claude 3.7 sonet の成果

https://claude.site/artifacts/cb0ab700-82f6-4ada-909d-f106dadb9cb1

 

300匹の精子を一つのピンクの卵子を追いかけてください。ピンクの卵子は精子につかまらないように縦横無尽ににげてください。 その逃亡の経路をプロットしてリポートしてください

 

https://claude.site/artifacts/a5bd867f-a6ef-4802-a979-3252333e67ba

 

Cursor で使う Claude3.7sonnet

mikimiki Webスクール はやいですね!

比較表

 

Claude3.7Sonnet の位置づけ