HTML5・Canvasの勉強に最適!! 髪の毛をシミュレーションした描画 『Hair』



ライブコーディングできる「CodePen」に面白いシミュレーションが公開されています

CodePenとはHTMLやCSS、JavaScriptをリアルタイムで編集、公開できると言ったサイトで

ここに変な?と言ったら怒られそうですが、面白いシミュレーションが公開されています

髪の毛をHTMLでシミュレーションしているのですが、この質感は凄いリアルに伝わります

hair1

CodePen Hair リンク先はこちらから

hair3

上記リンク先を開くと早速画面表示されますが

右上の「Editor」にてコードを表示できます

hair2

HTMLやCSS、JavaScriptがリアルタイムで編集可能で即時反映しますので

このシミュレーションを使って色々な勉強も可能です

hair4

パラメータの変更も可能で色々と試すことが出来て

HTMLの勉強だけでなく、このシミュレーションだけを見ても面白いと思います

hair5

ん~シュールな画像・・・

HTML、Canvasの勉強にもなりますよ

  • コメント: 0

関連記事

  1. 言語・開発・勉強

    HTML5の勉強に最高!! リアルタイムにコード変更してみる事が出来るWebサービス TheCode…

    用意されたサンプルを見ながらコードをいじったりするとリアルタイ…

  2. 言語・開発・勉強

    これは面白い!! 人体模型をグリグリ見れちゃうWebサービス 『ZygoteBody』

    理科室にあった人体模型をグリグリ回しながら細部まで細かく見れる…

  3. 言語・開発・勉強

    投稿型ゲームサイト HTML5なスマホ対応ゲームが沢山あります 9leap.net

    コンテストに参加や投稿されたゲームを実際に遊ぶことが出来るネットサービ…

  4. 言語・開発・勉強

    外国人名の発音が動画、音声で教えてくれるWebサービス 『Pronounce Names』

    外国人名などで発音の分からない名前などを教えてくれるWebサービス…

  5. 言語・開発・勉強

    30秒でどれだけ暗算できるかを競えるWebサービス 『Speedsums』

    たった30秒で何問暗算を解けるかを競えるWebサービス…

  6. 言語・開発・勉強

    ゲームをしながらJavaScriptの勉強ができるWebサービス 『CodeCombat』

    JavaScriptの勉強をRPGゲームをしながら出来る楽しい…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

PAGE TOP