「生成AIハッカソン@大阪 = 人間はコードを書いてはいけない？！」に参加してきました

  • 投稿日
  • 更新日
  • 著者 sada
  • カテゴリー 未分類

生成AIハッカソン@大阪に参加してみた感想

先日、大阪で開催された「生成AIハッカソン@大阪 = 人間はコードを書いてはいけない？！」に参加してきました！このイベントは、コードを一切書かずにAIに指示だけして開発を進めるという試みで、結果として(とりあえず)動くものができました。

開発環境とAIの活用

開発環境は VSCode + ROO CODE で、使用したAIは Claude 3.7 Sonnet。渡した情報は ChatGPTが作成した仕様書のみ でした。
※開発環境はこちらの記事を参考に作りました

仕様書作成にあたっては、まず ChatGPT o3-mini-high に「インターネットメディアを作りたい」と伝え、ヒアリングをしてもらいながら仕様書としてまとめてもらいました。その仕様書をもとにAIに開発を指示した結果、以下のようなプロセスで開発が進みました。
※仕様書は記事下に置いておきました。

こんなシンプルな問いから動くものができるまで仕様書が作られるなんて…

AI開発で人間がやったこと

基本的に、僕はAIに「このファイル読み込んでよい？」「変更を保存してもよい？」「このコマンド実行して良い？」という質問に対して、「承認」というボタンを押すだけでした。(押さずに自動承認することもできます）

なので、自動承認にしておくと基本的には自動で動き続けてくれます。
ただ、AIが悩みはじめてしまったら無限に課金されるので、最初は一つ一つ許可を確認するようにしていました。

ハッカソンでAIを使うときにネックになる点

コードを書くために使うAPIに利用制限があることです。課金しはじめのユーザーは使える量が少ないので、日頃から使ってアカウントを育てる必要があります。
参考：Claudeの場合

AI開発の成果

今回AIによって作られたものは、(6/30に解約されるサーバー上で動いているため、そのうち見れなくなりますが)一定の形になりました。

AIが作ったサービスはこちら

※動く機能も動かない機能もあるのですが、イベント内でできた部分で公開しています。
５分に１回、提供いただいた情報を元にAIが新しい記事を公開します。
もし、セキュリティホールなどありましたら教えて下さい。

開発を進める中で実感したのは、

  • AIが設計を理解し、ゼロからコードを書かせることができる
  • 仕様書通りに指示をすれば、20~30%のモックアップレベルまでは作れる
  • 細かい指示を与えながら進めると50~60%くらいの完成度になる
  • 開発が進むほど、AIの利用コスト(コードの把握・解析)が上がる
  • 機能開発には強いが、ビューの修正などは苦手

こういった特性から、AIを活用すると企画段階から下記のようなことができると思います。

  1. 午前中に企画会議をして仕様書を作る
  2. ランチ前にAIに「仕様書通りに作っておいて」と指示
  3. ランチ後、作られたものを見ながらさらに詳細仕様を決める

この流れだと、モックアップレベルのものが早い段階で確認できるため、本格的な開発に入る前に仕様をより細かく詰めることが可能になります。結果として、開発のスピードが大幅に向上し、無駄な手戻りを減らせる可能性があります。

AI開発の限界と人間の役割

ただし、リリースレベルまで持っていくには 人間がコードを書いたほうが早い というのが正直なところ。つまり、「AIに指示してあとは放置」できるのは前半だけで、中盤以降は人間が主体にならざるを得ません。

この影響で、エンジニアの役割にも変化が出てきそうです。例えば、

  • 今まで「駆け出し」エンジニアがやっていた作業はAIが代替する可能性が高い
  • スキルの成長段階が 1~10段階 あるとすると、今までは1→2→3…とステップアップできたが、これからは 5段目からスタートしないと仕事がない
  • 「AIを使えば誰でもエンジニアに！」という教材はあるが、結局AIを使う側にも高いスキルが求められる

もし「AIを使えば誰でもエンジニアになれる」のであれば、企業は外注せずにAIを使えば済む話。結局、エンジニアリングの一部はAIに置き換えられるものの、専門職としてのエンジニアは 今後も変わらず必要 だと思います。ただし、そのエンジニアが求められるスキルのレベルは、確実に上がっていくはずです。

ただし、これは2025/3/8時点の感想なので、半年後など、AIがさらに進化すればより高い部分までAIが書いてくると思われます。
まぁ人間にバトンタッチされるところが開発中盤から後半に変わるだけだと思いますが。

まとめ

今回のハッカソンを通して、AIを使った開発の(現時点での)可能性と限界 の両方を実感しました。今後のエンジニアリングは、AIをどう活用するか が重要になり、単純なコーディング作業ではなく、設計スキルや言語化がより求められるようになるでしょう。

今回の体験から得た学びは、
✅ AIはモックアップをつくる手助けはしてくれるが、リリースレベルまで持って行くには人間の力が必要
✅ プロジェクトの企画書や設計書が「AIを使いこなす」為にとても重要
✅ AIを活用することで、開発のスピードを大幅に向上できる

AIによって生産性があがることで、新規事業開発などがすごいスピードで進むことが考えられる。

おまけ

開発中の画面はこんな感じ。指示ごとにかかった費用がわかる。
アイコンを付ける例はうまくいったが、下のpagenationsのアイコン問題は「解決しました！」って報告してきたけど解決してませんでした。

Screenshot

ChatGPTといっしょに作ったマークダウン形式の仕様書

これを、.clinerulesという名前で保存して、ROO CODEに「仕様書通り作って」って一言伝えれば作ってくれます。時間制限があったのであまり細かく仕様設定していませんが、色々いじってルール作ってから動かせば一発目で更にクオリティ高い物ができてくると思います。

# News Media System 仕様書

## 1. プロジェクト概要

- **プロジェクト名:** 日本新聞 
- **フレームワーク:** Laravel  
- **データベース:** SQLite  
- **バージョン:** 1.0  

## 2. 環境設定

- **開発環境:** Laravel Homestead  
- **本番環境:** Ubuntu  

## 3. ビュー（フロントエンド）

- **ビューの構成:**  
  - 最新の Bootstrap 5 を使用  
  - モバイルファーストのデザインを採用

## 4. 機能概要

### 4.1 認証・ユーザー管理

- **認証方法:**  
  - メールアドレスとパスワードによるログイン
- **ユーザーロール:**  
  - `admin`（管理者）  
  - `user`（一般ユーザー）
- **管理者専用機能:**  
  - 管理画面へのアクセス  
  - API通信時のプロンプト管理（APIエンドポイント、リクエストパラメータの調整）
- **一般ユーザー専用機能:**  
  - 自分が通報した内容の確認・管理

### 4.2 情報提供（Submissions）

- **利用条件:**  
  - 未登録ユーザーも利用可能（ゲスト投稿を許容）
- **入力項目:**  
  - `news_content`: ニュース内容（事実の記述）  
  - `source_info`: 出典情報（URLや参照元）  
  - `event_date`: 発生日時  
  - `keywords`: 関連キーワード
- **保存先:**  
  - `submissions` テーブルに記録  
  - ※複数の情報提供が同一の記事として統合される場合、該当レコードに記事IDが紐付く

### 4.3 AIリライト処理（AI Rewrite Processing）

- **利用プロバイダー:**  
  - OpenAI GPT（OpenAI のドキュメントに準拠）
- **重複チェック:**  
  - 対象期間: 過去1ヶ月以内  
  - 判定基準: 出典情報の50%以上が重複している場合は同一情報と判断し、API通信を行わない
- **処理条件:**  
  - `submissions` テーブルの `article_id` が `NULL` の場合のみ処理を実施
- **自動生成フィールド:**  
  - `generated_title`: タイトル（ユーザーが編集可能）  
  - `generated_body`: 本文（表現の統一、誤字脱字修正、SEO最適化済み）  
  - `generated_keywords`: AI生成キーワード  
  - `meta_description`: メタディスクリプション
- **エラー対応:**  
  - エラー発生時はその内容を `errors` テーブルに記録し、該当記事を非公開（`published` フラグを FALSE）に設定

### 4.4 記事（Articles）

- **基本動作:**  
  - 自動生成された記事は基本的に公開状態にする
- **エラー時の処理:**  
  - AIリライト処理またはAPI通信でエラーが記録されている場合、該当記事は自動的に非公開にする
- **広告:**  
  - Google AdSense の自動広告をスマホ向けに記事内に表示  
  - A/Bテスト用の広告レイアウト管理は将来的に実装予定

### 4.5 通報（Reports）

- **通報理由:**  
  - 「誤情報」「不適切表現」「スパム」など
- **処理:**  
  - ユーザーからの通報内容は `reports` テーブルに記録
- **通報閾値:**  
  - `.env` に設定された閾値（初期値: 10）を超えると「通報が多い記事」として表示
- **通知:**  
  - 通報があった場合、管理者および情報提供を行った一般ユーザーにメールで通知

### 4.6 キャッシュ

- **初期設定:**  
  - Laravel のキャッシュ機能を利用
- **将来的な計画:**  
  - クラウドフレアとの統合を検討

### 4.7 エラー処理

- **エラー記録:**  
  - AIリライト処理やAPI通信で発生したエラーは `errors` テーブルに記録
- **エラー対応:**  
  - エラーがある記事は自動的に非公開に設定（`published` フラグを FALSE）

## 5. データベース設計

### 5.1 `users` テーブル

```sql
CREATE TABLE users (
    id INT AUTO_INCREMENT PRIMARY KEY,
    name VARCHAR(255) NOT NULL,
    email VARCHAR(255) NOT NULL UNIQUE,
    password VARCHAR(255) NOT NULL,
    role ENUM('admin', 'user') DEFAULT 'user',  -- 'admin': 管理者, 'user': 一般ユーザー
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
);
```

### 5.2 `submissions` テーブル

```sql
CREATE TABLE submissions (
    id INT AUTO_INCREMENT PRIMARY KEY,
    user_id INT DEFAULT NULL,  -- 未登録ユーザーの場合はNULL許容
    news_content TEXT NOT NULL,         -- ニュース内容（事実）
    source_info VARCHAR(255) NOT NULL,    -- 出典情報（URLや参照元）
    event_date DATETIME NOT NULL,         -- 発生日時
    keywords TEXT,                        -- 関連キーワード
    article_id INT DEFAULT NULL,          -- 紐付く記事ID（重複情報が統合される場合用）
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
    FOREIGN KEY (user_id) REFERENCES users(id),
    FOREIGN KEY (article_id) REFERENCES articles(id)
);
```

### 5.3 `articles` テーブル

```sql
CREATE TABLE articles (
    id INT AUTO_INCREMENT PRIMARY KEY,
    generated_title VARCHAR(255) NOT NULL,   -- AI生成タイトル（ユーザーが編集可能）
    generated_body TEXT NOT NULL,              -- AI生成本文（リライト済み）
    generated_keywords TEXT,                   -- AI生成キーワード
    meta_description TEXT,                     -- AI生成のメタディスクリプション
    thumbnail_url VARCHAR(255),                -- AI生成またはユーザー編集後のサムネイルURL
    ad_variant VARCHAR(50),                    -- A/Bテスト用広告レイアウトのバリアント情報
    report_count INT DEFAULT 0,                -- 通報件数（集計用）
    published BOOLEAN DEFAULT TRUE,            -- 公開状態（エラーがある場合はFALSEに設定）
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
);
```

### 5.4 `reports` テーブル

```sql
CREATE TABLE reports (
    id INT AUTO_INCREMENT PRIMARY KEY,
    article_id INT NOT NULL,                -- 通報対象の記事ID
    user_id INT,                            -- 通報者のユーザーID（未登録の場合はNULL）
    reason ENUM('誤情報', '不適切表現', 'スパム') NOT NULL,  -- 通報理由
    comment TEXT,                           -- 任意の補足コメント
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    FOREIGN KEY (article_id) REFERENCES articles(id),
    FOREIGN KEY (user_id) REFERENCES users(id)
);
```

### 5.5 `errors` テーブル

```sql
CREATE TABLE errors (
    id INT AUTO_INCREMENT PRIMARY KEY,
    article_id INT,                         -- 関連記事ID（該当する場合）
    error_message TEXT NOT NULL,            -- エラー内容
    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    FOREIGN KEY (article_id) REFERENCES articles(id)
);
```

## 6. 環境変数 (.env)

- `OPENAI_API_KEY`: "your_openai_api_key_here"  
- `REPORT_THRESHOLD`: 10

## 7. コード作成ガイドライン

- **リーダブルコード:**  
  - オライリーの「リーダブルコード」の原則に従い、誰が読んでも理解しやすいコードを書くことを心がける。
- **Laravelの標準設計:**  
  - Laravelの公式ドキュメントやベストプラクティスに沿った設計・実装を行う。  
  - MVC（Model-View-Controller）パターン、サービスプロバイダ、ファサードなど、Laravelの標準機能を有効に活用する。

ちなみに重複チェックの判定基準は仕様書の時点では50%以上と記載していますが、同じドメインからの情報だと重複チェックに引っかかるということが判明したので、少しこの数字は上げました。

非エンジニアの方へ　3/12追記

昨日の今日ですが、OpenAIがデスクトップ版のChatGPTに指示すればコードを書いてくれる機能を追加しました‼️
触ってみた所下記の方法で使える様になるみたいです。

  1. ChatGPTモバイル版をインストール
  2. VSCodeをインストール
  3. VSCodeとChatGPTをつなぐVSCode用プラグインをインストール
ChatGPTへのリンク
VSCodeへのリンク
つなぐやつへのリンク

これで非エンジニアの方も簡単に使えるはず！

この記事を書いた人

sada

記事一覧