Skip to content

index.md

Latest commit

 

History

History
304 lines (276 loc) · 16.2 KB

index.md

File metadata and controls

304 lines (276 loc) · 16.2 KB
Raw
layout plain
preload_image /img/contests/img/IMG_7235.webp
<style type="text/css"> @import"https://fonts.googleapis.com/css2?family=Space+Mono&display=swap"; @import"https://fonts.googleapis.com/css2?family=League+Gothic&display=swap"; html { scroll-behavior: smooth } body { font-family: "Roboto", "Noto Sans JP", sans-serif; margin: 0; } .cursor::after { content: "_"; animation: blink 1s infinite; } @keyframes blink { 0%, 50% { opacity: 0 } 51%, 100% { opacity: 1 } } </style>
CoderDojo Logo

日本中の子ども達が集う、クリエイティブな祭典。君のアイデアで未来をハックしよう。

2026.03.29 (日)
NAGONO Campus

DIGEST

イベントダイジェストムービー

<iframe class="w-full aspect-video shadow-lg" src="https://www.youtube.com/embed/Jbm3Fe7GhzA?si=BoiiZ2oJliU9Hohe" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen> </iframe>

前日の会場設営から当日の作品展示、参加者同士の交流まで、
Coolest Projects Japanの熱気あふれる様子をダイジェストでお届けします。

Coolest Projects イベントの様子

ABOUT

イベント紹介

作品展示イベント

Coolest Projectsは、18歳以下の子どもたちのための世界的な作品展示イベントです。プログラミングやテクノロジーを使って作った独自のアイデアや作品を、コミュニティ全体で称賛し合います。順位を競うコンテストではありません。あなたの情熱、創造性、そして技術的な挑戦を仲間と共有する場所です。

  <div class="text-center mt-12">
    <a class="button-push" href="/about">開催概要を見る</a>
  </div>
</div>


<!-- 展示までの流れ「FLOW」 -->
<div class="pt-36" id="flow">
  <div class="text-center mb-16">
<a href="#flow" style="text-decoration: none;">
  <h2 class='text-4xl sm:text-5xl font-bold uppercase tracking-wider border-b-10 border-teal-500 inline-block' style="font-family: 'League Gothic', sans-serif; color: #221C35;">FLOW</h2>
  <p class="text-xl mt-2" style="color: #444444;">展示までの流れ</p>
</a>
  </div>

  <div class="text-center mb-8 max-w-4xl mx-auto">
<img src="/img/contests/flow.webp" alt="展示までの流れ" class="w-full rounded-2xl">
  </div>
</div>

<div class="pt-36" id="categories">
  <div class="text-center mb-8">
<a href="#categories" style="text-decoration: none;">
      <h1 class='text-5xl sm:text-6xl font-bold uppercase tracking-wider border-b-10 border-teal-500 inline-block'
        style="font-family: 'League Gothic', sans-serif; color: #221C35;">CATEGORIES</h1>
      <p class="text-xl mt-2" style="color: #444444;">カテゴリー</p>
</a>
  </div>
  <!-- カテゴリーカード -->
  <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mt-8">
    <!-- Visual Programming -->
    <div class="bg-white rounded-2xl p-8 shadow-lg">
      <div class="p-4 rounded-xl bg-gradient-to-br from-orange-400 to-red-500 mb-6 shadow-lg inline-block">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-8 h-8 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
          <path stroke-linecap="round" stroke-linejoin="round" d="M7 21a4 4 0 01-4-4V5a2 2 0 012-2h4a2 2 0 012 2v12a4 4 0 01-4 4zm0 0h12a2 2 0 002-2v-4a2 2 0 00-2-2h-2.343M11 7.343l1.657-1.657a2 2 0 012.828 0l2.829 2.829a2 2 0 010 2.828l-8.486 8.485M7 17h.01" />
        </svg>
      </div>
      <h4 class="text-2xl font-bold text-gray-900 mb-3">Visual Programming</h4>
      <p class="text-gray-600 leading-relaxed">Scratch、Kodu、MakeCodeなどのブロック型言語を使った創造的なプロジェクト。micro:bitやArduinoと組み合わせたハードウェア制御も歓迎です。</p>
    </div>
    <!-- Web -->
    <div class="bg-white rounded-2xl p-8 shadow-lg">
      <div class="p-4 rounded-xl bg-gradient-to-br from-blue-400 to-cyan-500 mb-6 shadow-lg inline-block">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-8 h-8 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
          <path stroke-linecap="round" stroke-linejoin="round" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9" />
        </svg>
      </div>
      <h4 class="text-2xl font-bold text-gray-900 mb-3">Web</h4>
      <p class="text-gray-600 leading-relaxed">HTML、CSS、JavaScriptを使って作るウェブサイトやウェブアプリケーション。インタラクティブなデザインや便利なツールで、あなたのアイデアを表現しよう。</p>
    </div>
    <!-- Games -->
    <div class="bg-white rounded-2xl p-8 shadow-lg">
      <div class="p-4 rounded-xl bg-gradient-to-br from-purple-400 to-pink-500 mb-6 shadow-lg inline-block">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-8 h-8 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
          <path stroke-linecap="round" stroke-linejoin="round" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
          <path stroke-linecap="round" stroke-linejoin="round" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
        </svg>
      </div>
      <h4 class="text-2xl font-bold text-gray-900 mb-3">Games</h4>
      <p class="text-gray-600 leading-relaxed">Python、Unity、Unreal Engine、Godotなど、あらゆる言語やエンジンで作られたゲーム作品。2Dアクション、3D冒険、パズルゲームまで、君のゲームをみんなに遊んでもらおう！</p>
    </div>
    <!-- Mobile Apps -->
    <div class="bg-white rounded-2xl p-8 shadow-lg">
      <div class="p-4 rounded-xl bg-gradient-to-br from-indigo-400 to-purple-600 mb-6 shadow-lg inline-block">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-8 h-8 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
          <path stroke-linecap="round" stroke-linejoin="round" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z" />
        </svg>
      </div>
      <h4 class="text-2xl font-bold text-gray-900 mb-3">Mobile Apps</h4>
      <p class="text-gray-600 leading-relaxed">スマホやタブレットで動く便利なアプリ、楽しいエンタメアプリ、役立つ情報アプリなど。実機またはエミュレータでのデモでOKです。</p>
    </div>
    <!-- Hardware -->
    <div class="bg-white rounded-2xl p-8 shadow-lg">
      <div class="p-4 rounded-xl bg-gradient-to-br from-green-400 to-emerald-600 mb-6 shadow-lg inline-block">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-8 h-8 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
          <path stroke-linecap="round" stroke-linejoin="round" d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z" />
        </svg>
      </div>
      <h4 class="text-2xl font-bold text-gray-900 mb-3">Hardware</h4>
      <p class="text-gray-600 leading-relaxed">Raspberry Pi、Arduino、micro:bitを使ったロボットや電子工作。センサーやモーターを組み合わせて、動く作品を作ろう。</p>
    </div>
    <!-- Creative -->
    <div class="bg-white rounded-2xl p-8 shadow-lg">
      <div class="p-4 rounded-xl bg-gradient-to-br from-yellow-400 to-orange-500 mb-6 shadow-lg inline-block">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-8 h-8 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
          <path stroke-linecap="round" stroke-linejoin="round" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z" />
        </svg>
      </div>
      <h4 class="text-2xl font-bold text-gray-900 mb-3">Creative</h4>
      <p class="text-gray-600 leading-relaxed">音楽制作、デジタルアート、映像編集、3Dモデリングなど、クリエイティブな表現を形にしたプロジェクト。あなたの感性を作品にしよう。</p>
    </div>
    <!-- AI -->
    <div class="bg-white rounded-2xl p-8 shadow-lg">
      <div class="p-4 rounded-xl bg-gradient-to-br from-teal-400 to-blue-600 mb-6 shadow-lg inline-block">
        <svg xmlns="http://www.w3.org/2000/svg" class="w-8 h-8 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
          <path stroke-linecap="round" stroke-linejoin="round" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
        </svg>
      </div>
      <h4 class="text-2xl font-bold text-gray-900 mb-3">AI</h4>
      <p class="text-gray-600 leading-relaxed">機械学習、画像認識、自然言語処理、データ分析など、AIを活用したプロジェクト。最新のAI技術で未来を創造しよう。</p>
    </div>
  </div>
  <div class="text-center mt-24">
    <a class="button-push" href="/works">当日の展示作品を見る</a>
  </div>
</div>

<!-- NEWS セクション -->
<div class="pt-36" id="news">
  <div class="text-center mb-16">
<a href="#news" style="text-decoration: none;">
      <h1 class='text-5xl sm:text-6xl font-bold uppercase tracking-wider border-b-10 border-teal-500 inline-block'
       style="font-family: 'League Gothic', sans-serif; color: #221C35;">NEWS</h1>
      <p class="text-xl mt-2" style="color: #444444;">お知らせ</p>
</a>
  </div>
  <!-- お知らせ一覧（最新3件） -->
  {% assign latest_news = site.posts | where: "categories", "news" | sort: "date" | reverse | limit: 3 %}
  <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
    {% for post in latest_news %}
      {% include news_card.html post=post %}
    {% endfor %}
  </div>

  <div class="text-center mt-12">
    <a class="button-push" href="/news">お知らせ一覧を見る</a>
  </div>
</div>

<div class="pt-36" id="sponsors">
  <div class="text-center mb-16">
    <a href="#sponsors" style="text-decoration: none;">
      <h1 class='text-5xl sm:text-6xl font-bold uppercase tracking-wider border-b-10 border-teal-500 inline-block'
        style="font-family: 'League Gothic', sans-serif; color: #221C35;">SPONSORS</h1>
    <p class="text-xl mt-2" style="color: #444444;">スポンサー</p>
    </a>
  </div>
  <div class="text-center mb-16">
    <p class="text-xl mb-12" style="color: #444444;">Coolest Projects Japanは<a href='/sponsors/'>スポンサーのご協力</a>により開催されています。協賛くださいました、皆様ありがとうございます。</p>
  </div>
</div>

{% include sponsors.html %}

<div class="text-center mb-16">
  <a href="/sponsors" class="button-push"> 各スポンサーの詳細を見る </a>
</div>

{% include faq.html %}

<style> /* FAQセクションの背景色 */ #faq { background-color: #eff2f6; padding-bottom: 48px; } </style>
{% include about_us.html %} 
<div class="text-center mt-12">
  <a class="button-push" href="/about">開催概要を見る</a>
</div>