1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【やんばるハッカソン】PC初心者がタイピングゲーム作成に挑戦

Posted at

はじめに

はじめまして。私は現在起業準備中です。

今回、私は「初心者」「AI」「アプリ開発」というキーワードになんとなく惹かれて宜野湾市からこのイベントに参加しました。なぜならば、AIも検索程度に使うだけで、自分がアプリを作るなんて全く想像がつかなかったからです。6日間という短期間なので、何か得られるものがあればいいなと期待して参加を決意しました。

結論から申し上げますと、うまくいきませんでした。

シンプルなタイピングゲームはAIで生成できたものの、複雑なAI生成デザイン画を添付して作成を要求したところ、どうしてもコーディングなしでは生成してくれない」ということが分かりました。(まだまだプロの手が必要な段階のようです)

この経験はとても勉強になったので、私のような方にも参考になるかと思い、この記事を書きたいと思います。


参加イベント概要

「nagonova×やんばるハッカソン」

名護市の「ナゴノバ」で行われるやんばるハッカソンは、地域の課題をAIで解決する斬新なイベントです。2025年7月14日(月)から7月21日(月)まで、異なるバックグラウンドを持つ参加者(学生、起業家、エンジニア、デザイナー、研究者など)が集まり、短期間でビジネスアイデアを実際のプロトタイプとして形にします。

イベント詳細

  • テーマ: AIを駆使してビジネスアイデアを形にする
  • 場所: ナゴノバ(沖縄県名護市宮里1004番地)
  • スケジュール:
    • 7月14日・15日: アイデアソン
    • 7月17日・18日: ハッカソン講習
    • 7月20日: ハッカソン開発
    • 7月21日: 発表会+懇親会
  • 参加対象: 未経験者も歓迎!特に地域課題や技術活用に興味がある方
  • 参加費: 無料(要事前申し込み)

ハッカソンとは?

ちなみに私はハッカソンの意味を初日、先生に質問して教えていただきました。

Copilotによるハッカソン概要

ハッカソンとは、限られた時間内でチームがアイデアを練り、アプリやプロダクトなどの試作品を迅速に開発する共同制作イベントであり、技術だけでなく創造力や課題解決力も問われる実践型の場です。

ハッカー×マラソンの造語だそうです。わくわく。)


1日目・2日目:アイデアソン

1. 課題と解決策

私のタイピングゲーム原案は以下の通りです。

  • 課題
    • PCタイピングを速くしたい
    • 普及版は子供向けでモチベーションが上がらない
  • 解決法
    • 制限時間内で出題
    • 自分が登録した文章から出題し向上心をあおる

2. 機能

  • 初級から上級
  • 出題箱に文や単語を登録し、そこから出題

3. デザイン画

ざっくり手描きしました。これをAIに見せるそうです。(驚き)

補足

私がタイピングゲームを作ろうと思ったのは、自分自身のためです。私には今、起業したいという夢があり、目下勉強中なのですが、PCがどうしても苦手です。iPhoneとはわりと仲良しなので、メモにせよ調べものにせよ、自然とiPhoneを使ってしまい、なかなかPCとは仲良くなれない現状がありました。起業講座の課題でスライドを作ったりするのですが、PC操作が苦手で苦戦しており、最終日のプレゼンがとても気が重いのです。そこで、自分がやって楽しいタイピングゲームで苦手意識を克服し、PC作業に自信がつくかなと思いました。


生成AI「Claude」(クロード)

上記の情報をClaudeにお伝えしました。

1番最初にできたゲームはこちらです。

https://claude.ai/public/artifacts/43e3feab-b182-4782-8b27-bfe37dae3354

手描きデザイン画をお見せした後も同じリンクです。

https://claude.ai/public/artifacts/43e3feab-b182-4782-8b27-bfe37dae3354

このあたりで今日の無料分はすべて使い切ってしまいました。

感想ですが、一瞬でこんな感じで出来上がってしまい驚きました。
が、その一方、まだまだ作りこまなくては。でもまだ4日あるのでできるだろう。
と、期待大といったところです。

問題点としては、手描きデザイン画のキーボードやキャラクターが反映されておらず、これからもっと的確な言葉でプロンプトを書いていこう!と嬉しい気持ちで1日目を終えました。


プロンプトの試行錯誤

家でCopilotGeminiChatGPTとともにプロンプトを練りました。デザインに使ったカラーパレットは先生から教わった新しい概念です。

正直、量的にいかほど必要なのか分かりませんでしたが、自分では作ることができないクオリティの画像が生成され、テンションが上がりました。

初期プロンプト一例

あなたは優秀なWebデザイナー Parisのソルボンヌにある古い書店 左はムッシュTHAI右はマダムMOMO #FFF5EB #DEEDF0 #F4C7AB #B2B8A3 吹き出しはフランスの古い書物みたいなデザイン。 このデザインでタイピングアプリをつくってほしい。 ユーザーは50歳女性。ソルボンヌ、蚤の市、アカデミック、起業家がキーワード
Gemini_Generated_Image_wo6djbwo6djbwo6d.png


終わりに

発表時間になってしまい、私の記事はこれで終えなくてはなりませんが、右往左往する中、あたたかい仲間に囲まれて楽しく勉強することができ、最高の6日間でした。

まっちゃん
タイキ
タクマ
ヒロト
ココア
きらり
さこうさん
たじまさん
モーリー

またぜひ構ってくださいね!


そのほか使用したAI

覚え書きとして、AIコードエディタ「Cursor」と生成AI「Vercel v0」を記します。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?