万葉の非公式マスコットキャラクター「いち葉さん」を自由にカスタマイズして作成できるWebアプリケーションです。

葉っぱに落書きをして、あなただけのオリジナル「いち葉さん」を作成できます。 作成したキャラクターは画面下でわらわらと動き回ります。

• キャラクター作成: 葉っぱベースの画像に自由に落書きできます

  • マウスやタッチ操作に対応
  • 5種類の葉っぱ画像からランダムに選択
  • ランダムな回転角度で個性的なキャラクターに

• キャラクター管理:

  • 作成したキャラクターをブラウザ内に保存
  • ギャラリーで一覧表示
  • 各キャラクターには個性的な紹介文が自動付与
  • 削除機能

• わらわらアニメーション:

  • 画面下部でキャラクターが自律的に動き回る
  • マウスカーソルに反応して逃げる
  • クリックでジャンプ
  • 落下アニメーション付きで新規キャラクターが仲間入り

1. python3 -m http.server 8080でサーバーを立ち上げる
2. ブラウザで http://127.0.0.1:8080 にアクセス
3. 「新メンバー」タブで葉っぱに落書き
4. 「採用」ボタンでキャラクター完成
5. 「メンバー紹介」タブで作成したキャラクターを確認
6. 画面下部のキャラクターをクリックしてジャンプさせたり、マウスで追いかけたりして遊ぶ

https://everyleaf.github.io/hc2025_atakada/ でも動作を確認できます

• HTML5
• CSS3
• JavaScript (Vanilla)
• HTML5 Canvas API
• LocalStorage

.
├── index.html       # メインHTMLファイル
├── style.css        # スタイルシート
├── script.js        # JavaScriptロジック
└── img/            # 葉っぱ画像（5種類）
    ├── leaf1.png
    ├── leaf2.png
    ├── leaf3.png
    ├── leaf4.png
    └── leaf5.png

• 完全クライアントサイド: サーバー不要、ブラウザだけで動作
• レスポンシブ: PC・スマホ・タブレット対応
• データ永続化: LocalStorageでキャラクターを保存
• 物理演算: 重力、摩擦、バウンスなどリアルな動き

• イベント: 2025ハッカソン
• 開発者: 高田
• リポジトリ: hc2025_atakada