2
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?

IBM Bobでマインスイーパー

Last updated at Posted at 2026-01-24

はじめに

IBM Bobでテトリスやからあげが降ってくるゲームを作成されている記事にインスピレーションを受け、昔学生時代に研究室のパソコンで徹夜でよくやっていたマインスイーパーを作ってみました。Bobとの対話を通じて、ゲームを作成した体験を共有します。
コードを一から書くのではなく、自然言語で要望を伝えながら、段階的にゲームを完成させていく過程が面白いかったので記事にしました。

インスピレーションをいただいた記事

🎮 完成品

image.png

最終的な機能

  • ✨ 4つの難易度レベル(超初級・初級・中級・上級)
  • 🚩 右クリックで旗を立てる機能
  • ⏱️ タイマー機能
  • 💣 残り地雷カウンター
  • 🎨 モダンでレスポンシブなデザイン
  • 📱 モバイル対応

対話の流れ

第1ステップ: 最初のリクエスト

: 「マインスイーパーを作れますか」

Bob: 「はい、マインスイーパーゲームを作成できます!」

Bobは即座に以下の提案をしてくれました:

  • 3つの難易度レベル(初級・中級・上級)
  • 基本的なゲームメカニクス
  • UI要素(タイマー、地雷カウンター、リセットボタン)

そして、具体的な仕様を確認するための選択肢を提示:

1. 基本的なマインスイーパー(9x9グリッド、10個の地雷)
2. 難易度選択機能付き(初級/中級/上級)
3. カスタマイズ可能なマインスイーパー
4. モダンなデザインとアニメーション付き

: 「はい、難易度選択機能付き(初級/中級/上級)のマインスイーパーを作成してください」

第2ステップ: 実装開始

Bobは即座にコードモードに切り替わり、以下のファイルを作成:

minesweeper/
├── index.html      # ゲームのHTML構造
├── style.css       # スタイリング(257行)
├── script.js       # ゲームロジック(310行)
└── README.md       # 説明書(123行)

難易度設定

const DIFFICULTIES = {
    beginner: { rows: 9, cols: 9, mines: 10 },
    intermediate: { rows: 16, cols: 16, mines: 40 },
    expert: { rows: 16, cols: 30, mines: 99 }
};

ゲーム状態の管理

let gameState = {
    board: [],
    revealed: [],
    flagged: [],
    currentDifficulty: 'beginner',
    gameOver: false,
    gameWon: false,
    firstClick: true,
    timer: 0,
    timerInterval: null,
    minesRemaining: 0
};

第3ステップ: ゲームを起動

: 「プレイしたいです。」

Bob: ブラウザでゲームを開いてくれました。

open minesweeper/index.html

実際にプレイしてみると、基本的な機能は完璧に動作していました!ここまでわずか3分程度でした。

第4ステップ: カスタマイズ要望

実際にプレイしてみて、新しいアイデアが浮かびました。(3時間くらい遊びましたが上級編がクリアできず)

: 「超初級の難易度レベルを作れますでしょうか。16x30のグリッドで1個の地雷。最初の一つをクリックするとほとんどのパネルが開くと爽快かなと思い。」

Bob: 「素晴らしいアイデアですね!」

Bobは即座に以下の変更を実施:

script.js の更新

const DIFFICULTIES = {
    superEasy: { rows: 16, cols: 30, mines: 1 },  // 新規追加!
    beginner: { rows: 9, cols: 9, mines: 10 },
    intermediate: { rows: 16, cols: 16, mines: 40 },
    expert: { rows: 16, cols: 30, mines: 99 }
};

index.html の更新

<div class="difficulty-selector">
    <button class="difficulty-btn" data-difficulty="superEasy">超初級</button>
    <button class="difficulty-btn active" data-difficulty="beginner">初級</button>
    <button class="difficulty-btn" data-difficulty="intermediate">中級</button>
    <button class="difficulty-btn" data-difficulty="expert">上級</button>
</div>

第5ステップ: フィードバックと調整

実際に超初級モードをプレイしてみました。

: 「1個だとすぐクリアできてちょっとつまんなかったです。地雷を2個にしてください」

Bob: 「了解しました!地雷を2個に変更します。」

const DIFFICULTIES = {
    superEasy: { rows: 16, cols: 30, mines: 2 },  // 1→2に変更
    // ...
};

この調整により、爽快感を保ちつつ、適度な難易度になりました!

Bobとの対話で開発する利点やコツとして感じたこと

1. 素早いプロトタイピング

  • 要望を伝えるだけで、数分で動くプロトタイプが完成する
  • コードの詳細を気にせず、機能・ユーザー体験の改善を考えることに集中できる(ゲームなので大袈裟かもしれませんが)

2. 段階的な改善

  • 実際に使ってみてからフィードバックというのをクイックに回せる
  • 小さな変更を繰り返して(最初は想定していなかったような)理想の形に近づけていける

3. 学習機会

  • 生成されたコードを読んでコーディングのテクニックも学べる
  • なぜそのような実装になったのか理解できる

4. 柔軟な対応

  • 「超初級モード」のような独自のアイデアも即座に実装
  • 細かい調整(地雷1個→2個)も簡単

Bobの優れた点として端的にまとめると

  1. 文脈理解: 「マインスイーパー」と言っただけで、必要な機能を全て理解
  2. 提案力: 複数の選択肢を提示してくれる
  3. 実装力: HTML/CSS/JavaScriptを適切に使い分け
  4. 柔軟性: カスタム要望にも即座に対応
  5. ドキュメント力: アプリ作成後のreadmeや仕様書も程よい粒度で書かれており保守性が高まる

実際の対話ログ(ファイル読み取りや保存などの許可の部分は省いています)

私: マインスイーパーを作れますか
Bob: はい、マインスイーパーゲームを作成できます!

私: 難易度選択機能付き(初級/中級/上級)のマインスイーパーを作成してください
Bob: [ファイル作成開始]

私: プレイしたいです。
Bob: [ブラウザでゲームを起動]

私: 超初級の難易度レベルを作れますでしょうか。16x30のグリッドで1個の地雷。
Bob: 素晴らしいアイデアですね![実装開始]

私: 1個だとすぐクリアできてちょっとつまんなかったです。地雷を2個にしてください
Bob: 了解しました!地雷を2個に変更します。

私: readmeを見せてください
Bob: [README.mdの内容を表示]

私: こちらで実施した内容をQiita記事に投稿したいです。
    マークダウン形式でドラフト作成をお願いします。私とBobの対話の内容を中心にしてください。
Bob: [この記事を作成]

まとめ

所要時間

  • 初回実装: 約5分
  • カスタマイズ: 約3分
  • 微調整: 約2分
  • 合計: 約10分

対話で開発するメリット

  1. 速い: 従来の開発の1/10以下の時間
  2. 簡単: コードを書かずに自然言語で指示
  3. 柔軟: アイデアを即座に試せる
  4. 学習: 生成されたコードから学べる

おわりに

Bobとの対話を通じて、わずか10分でマインスイーパーゲームを完成させることができました。

特に印象的だったのは:

  • 要望を自然言語で伝えるだけで実装される速さ
  • 「超初級モード」のような独自アイデアも即座に実現
  • 実際に使ってみてからの微調整が簡単

これからの開発は、コードを書くことよりも、何を作りたいかを明確にすることが重要になりそうです。

ぜひ皆さんも、Bobとの対話で何か作ってみてください!

<2026/1/25時点>
早期アクセス継続中です。ぜひこの機会にIBM Bobとお友達になってみてください。

IBM Bobのお友達同士で集うコミュニティ"Bob サロン"もオープン予定です。夕方に短時間のハイブリッド開催を月一ペースで実施しますのでお気軽にお立ち寄りください。

image.png

2
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
2
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?