こんにちは、2025年新卒エンジニアのtakiです！
10月4日～5日に開催された NASA Space Apps Challenge 2025 に同期と参加してきました。 本記事ではそのレポートをお届けします。
参加の経緯とハッカソンのすすめ
なぜ NASA Space Apps Challenge 2025 に参加したのか、その経緯とともに、ハッカソン参加についてお伝えしたいことがあります。
私たちは、入社時の研修のときから「同期でハッカソンに出たいね」という話をしていました。 ハッカソンを調べてみて、スケジュールとテーマが私たちにあうものを選ぼうと思っていました。しかし、調べ始めてから気がついたんです。 ほとんどのハッカソンは学生限定であると…！
社会人が参加できるハッカソンはなかなかありませんでした。 そんななか、やっと見つけたのが NASA Space Apps Challenge 2025 。社会人も出られる上、規模も大きく、宇宙関係のテーマ。 宇宙好きのメンバーが複数いる私たちにとって最高のハッカソンでした。
たまたま見つけた社会人OKのハッカソンが、私たちにぴったりのものだったので、「これだ！」となり参加することとなりました。 本当にラッキーな出会いでした。
学生の皆さん、ハッカソンは学生のうちに出ておきましょう！”学生のうちに学割を使い倒すんだ！”とよく言われますが、それと同じ熱量で言っております。
学生じゃない方は、出られるハッカソンを見つけたらチャンスです。迷わず出ましょう！
NASA Space Apps Challengeとは
NASA Space Apps Challengeは、NASAが主催する世界最大規模のグローバルハッカソンです。2025年は10月4日～5日の2日間、世界中で450以上のローカル会場とオンラインで同時開催され、登録者数は22万人を超えています。
このハッカソンでは、NASAやそのパートナー宇宙機関が公開するオープンデータを活用して、地球環境や宇宙探査に関する実際の課題に取り組みます。参加者は提示された18個のテーマの中から1つを選び、衛星データの可視化から宇宙探査技術まで、幅広い科学分野の課題解決に挑戦します。
チームは最大6人まで編成可能で、私たちはエンジニア職3人とビジネス職1人の4人チームで参加しました。
つくったもの
私たちが開発したのは「CUPOLA QUEST」という、国際宇宙ステーション（ISS）の観測窓、CUPOLAから撮影された地球の写真を使った地理推測ゲームです。
ISSの25周年を記念し、「宇宙飛行士の視点で地球を見る」という体験を教育的に伝えることを目的としています。プレイヤーはNASAが公開している実際の宇宙からの写真を見て、それがどこで撮影されたかを3D地球儀上にピンを立てて推測します。距離の正確さと回答速度に応じてスコアが算出される仕組みです。
使用技術はReact + TypeScript、MapLibre GL JS（3D地球表示）、Pythonでのデータ処理などです。デプロイにはVercelを使用しました。
こちらから遊べるので、ぜひ触ってみてください！
GitHubリポジトリはこちらです。
CUPOLA QUESTの詳細
ここでは各メンバーの担当内容を紹介します。
taki
私は主にアイデア出し、TypeScriptでのワイヤーフレーム作成、全体的なUIとレスポンシブデザインを担当しました。
アイデア出しはハッカソン前日の寝る前に行いました。ハッカソンへの参加の声かけを行った身として、アイデアを持っていくのは私の責務だと思ったためです。であればギリギリでなくもっと早くからやるべきなのですが、5個のアイデアを持っていったので許してください。ハッカソン当日にアイデアをみんなに話して賛成してもらえたときは嬉しかったです。
作るものが決まった後、すぐにReact + TypeScript + Viteでプロジェクトをセットアップしました。ゲームの流れを設計し、スタート画面から写真表示、地図での回答、結果表示という一連のページ遷移を実装しました。そして、MapAnswer、PhotoDisplay、ScoreDisplayなどといった主要コンポーネントの骨組みを用意することで、チームメンバーが各画面の詳細機能に集中して並行開発できる体制を整えました。
CSSとレスポンシブデザインですが、やるつもりはありませんでした。正直、CSSは積極的に触りたいものではないのですが、ハッカソンに出るとCSS担当になってしまいがちです。私は絵を描くことが趣味だからか、デザインに少しこだわりがあるんだと思います。デザインにこだわりがあるのが私なら、私がUI周りを担当するのが筋だろうということで、結局毎回CSSを担当することになってしまいます。今回、2日目のお昼くらいまではモバイルのことを考えていませんでした。raitoがアプリケーションのURLリンクをQRコードにして、それを発表スライドに貼り付けているのを見つけた時に『QRコードってことは、スマホで読み込むよなー…』と気づいてしまい、絶望しました。 最終的に、パソコンとモバイルの両方で快適に遊べるよう調整することができましたが、とても苦しい3時間でした。
Jonny
私は、NASAの提供するデータを収集・整備する作業を担当しました。
NASAのAPIの提供形態は2つありました。1つは比較的新しく作られたもので、使用申請をするだけで自動的にAPIキーが発行されるシステムであり、もう1つはかなり前に作られたもので、APIキーを取得するにはNASAに直接メールを送らなければならない方式でした。
前者であればやりやすかったのですが、私たちが使用しようとしていたデータは後者のシステムで運用されていました。ハッカソンの日程はわずか2日間であり、NASAからの返信を待っていると大会が終了してしまう可能性がありました。さらに、データを管理しているWebサイトの上部には「連邦政府の資金提供の停止により、NASAはこのウェブサイトを更新していません。ご不便をおかけし、心よりお詫び申し上げます。」という文言が記載されており、実際に返信を受け取れるかどうかも不確かな状況でした。
そこで、私たちは代替手段として、ISSで撮影された写真と位置情報が公開されているウェブサイトを直接クロールし、データ化することにしました。
データの収集はbqnqと協力して進めました。写真の通し番号と位置情報をクロールしてJSON形式のデータにまとめる作業と、写真ファイルをすべてクロールしてダウンロードする作業があり、私は前者を担当しました。
収集したデータを確認してみると、実際のゲームに使用するには難しい写真が含まれていました。例えばこの台風の画像は、場所を特定するためのヒントが何もありません。
bqnq, raitoと3人で協力し、約1500枚の写真からゲームに使用できる画像を目視で選別する作業を行いました。データ整備が終わった後、takiが作成したフロントエンドコンポーネントと接続し、ゲーム内で正常に活用できるように適用しました。
2日間のハッカソンは、まるで学生の時代に少し戻ったような感じでした。 当時ほどの体力はありませんでしたが、同期と一緒に作品を作り上げていく過程で多くのエネルギーをもらい、意味のある成果を残すことができました。
それぞれが自分の役割を主体的に担い、良いチームワークを発揮し、困ったときにはお互いに助け合いながら進めることができました。 短い時間ではありましたが、同期とともに過ごした今回のハッカソンは、良い経験であり、楽しい思い出となりました。
bqnq
私は今回のハッカソンで、ゲームに利用する衛星画像の取得と、ゲーム画面の実装を担当しました。
当初、ゲーム画面には、Google Mapsなどで一般的に使われているメルカトル図法を採用する予定でした。しかし、実際に実装を進める中で、この方法ではスコアの計算時にユーザ体験に悪影響を与える可能性があることに気づきました。
下の画像はメルカトル図法を用いた初期段階のゲーム画面です。このゲームでは、正解地点と回答地点との距離の近さと回答までに要した時間によってスコアが計算されます。しかし、メルカトル図法では、見かけ上の距離と実際の地球上の距離が一致しません。実際には極地付近は大きく引き伸ばされるため、プレイヤーはこれくらい離れているだろうと思っても、スコアはその感覚とズレてしまう可能性があります。これは、プレイヤーの直感に反する体験となり、UXを大きく損なってしまいます。
この懸念をチームメンバーに共有したところ、全員が同じ問題意識を持っていることが分かりました。そこで、私たちは距離計算とマップの表現方法を見直し、ゲーム画面を3D地球儀で表現する方針へと変更しました。この変更により、プレイヤーはまるで宇宙から地球を眺めるような感覚で、直感的な距離がそのままスコアに反映される、自然なUXを実現できました。
今回のハッカソンで特に印象に残ったのは、どの体験がプレイヤーにとって自然かをチーム全員で議論したことです。UI/UXデザインを実践的に考えるのは初めてでしたが、議論を通じて考え方が深まり、実際のアウトプットに反映できたことは、大きな学びとなりました。
正直に言うと、実装を修正するのは大変でしたが、地球をぐるっと回せるUIが動いた瞬間は、ちょっとテンションが上がりました！あの体験ができたことが今回のハッカソンに参加して一番の収穫でした！
raito
チーム内にデザイナーがいなかったため、ディレクター兼デザイン担当として参加しました。 UIデザインからロゴの制作、資料作成、発表まで幅広く担当しました。
ワイヤーフレームの作成では、既存の「某風景から場所を当てるサイト」を参考に、ユーザーが自然に遊び方を理解できる導線を意識しました。 今回のコンセプトが「ISSのCUPOLAから見える景色を当てる」という内容だったため、実際にCUPOLAから地球をのぞいているような体験を再現できる画面構成を目指しました。
ロゴデザインでは「地図アプリでよく見かける赤いピン」をベースに、中央の白い円に地球の模様を配置し、その周囲にISSと軌道をあしらうことで、「宇宙 × 地球 × 探索ゲーム」というコンセプトを一目で伝えられるよう工夫しました。 バランスとシンプルさを両立させるために、要素の位置や配色を調整しながら制作を進めました。
また、発表資料とデモ動画の作成も担当しました。 資料は文字量を最小限に抑え、フォントサイズを大きく、アニメーションを多用して視覚的に飽きない構成を意識しました。 デモ動画では「タイトル→プレイ→結果表示」の流れを映しながら字幕で解説を加え、画面構成や注目ポイントが伝わるような動画を目指しました。特に、回答と正解の距離が近い場合や遠い場合の挙動を比較し、プレイ体験の魅力をわかりやすく表現しました。
実際に作成したデモ動画（英語版）はこちらです。
さらに、英語での提出資料の作成も担当しました。 最終提出は開発したものの意図や解決できる課題を英語でまとめる＋英語版の資料という形式だったため、ChatGPTと相談しながら作成しました。
資料は、日本語資料をもとに構成を再調整し、直感的に理解できるよう画像を中心としたレイアウトに。 翻訳時に意味がずれないよう、チームメンバーのJonnyに確認してもらいながら内容を仕上げました。
今回が初めてのハッカソンでしたが、「みんなでひとつのものを全力で作る二日間」がとても刺激的で、強い達成感を得られました。 チーム内で役割分担がしっかりできており、限られた時間の中でも効率よく作業を進められたと思います。（睡眠時間はかなり削りましたが…！）
また、CanvaやFigmaなどのツールを使いこなすことで、ディレクターでもデザイナーの代役ができることを実感しました。 英語資料の作成も初挑戦でしたが、実際に形にできて良かったです。
結果
当日の発表では、ローカル会場で2番目に良い賞をいただくことができました。
NASA Space Apps Challengeでは、ローカル会場での発表と最終提出物を含めた審査が行われ、グローバルノミネート（Global Nominees）に選出されたチームは、さらにグローバル賞（Global Awards）の審査に進むことができます。残念ながら私たちのチームはグローバルノミネートには選ばれませんでしたが、2日間で形にできたものには満足しています。
おわりに
ハッカソン出場、最高です！ 限られた時間でアイデアを形にしていく過程は想像以上に刺激的で、技術力だけでなくチームワークや課題解決能力も試される場でした。
NASA Space Apps Challengeは来年も開催されると思いますので、興味がある方はぜひ参加してみてください！ 知り合い同士での参加でも、初めて会う人と当日チームを組んでの参加でも、良い経験ができると思います！
画像クレジット
本記事のアイキャッチ画像および開発したアプリケーション「CUPOLA QUEST」内で使用している写真は、NASAジョンソン宇宙センターより提供されています。
Image courtesy of the Earth Science and Remote Sensing Unit, NASA Johnson Space Center
