【ITニュース解説】Give it a try

2025年09月09日に「Dev.to」が公開したITニュース「Give it a try」について初心者にもわかりやすいように丁寧に解説しています。

作成日: 更新日:

ITニュース概要

GoogleのAI「Gemini」を活用し、ユーザーが描いた絵を当てるWebアプリが公開された。出されたお題の絵を描くと、AIがリアルタイムで推測する。友達よりも速く絵を当てると謳っており、AIの高速な画像認識能力を体験できる。

出典: Give it a try | Dev.to公開日:

ITニュース解説

ある個人開発者が、ユーザーが描いた絵を人工知能(AI)がリアルタイムで推測するWebアプリケーションを開発し、その技術的な挑戦の過程を公開した。このアプリケーションは、Googleが提供する最新のAI技術を活用しており、AI開発の身近さとその可能性を示す事例として注目されている。ユーザーがマウスや指で簡単な絵を描くと、AIが即座にそれが何であるかを当てるという、シンプルながらも高度な技術に支えられたゲームだ。

このプロジェクトは、Googleが主催するAI技術を用いた開発コンテスト「Google AI Challenge」への参加をきっかけに始動した。開発者は、AIの学習に利用できる巨大なデータセットの存在に着目した。そのデータセットとは、Googleが公開している「Quick, Draw! Dataset」である。これは、世界中の人々が「猫」「車」「家」といった様々なお題に対して描いた、数千万もの手描きのスケッチを集めたものだ。AI開発において、このような大量かつ多様なデータは、AIモデルに特定の概念を学習させるための教科書のような役割を果たし、その性能を決定づける極めて重要な要素となる。開発者はこのユニークなデータセットから着想を得て、お絵かき当てゲームのアイデアを具体化させた。そして、その中核となるAIには、Googleの最新大規模言語モデルである「Gemini」の画像認識能力を利用できる「Gemini Pro Vision API」が採用された。APIとは、Application Programming Interfaceの略で、ソフトウェアやプログラムの機能を外部から利用するための窓口のことである。このAPIを利用することで、開発者は自身で複雑なAIモデルをゼロから構築することなく、Googleが開発した世界最高水準の画像認識機能を、自分のアプリケーションに簡単に組み込むことが可能になった。

アプリケーションの動作原理は、ユーザーの操作からAIの応答まで、一連の明確な技術的ステップで構成されている。まず、ユーザーがWebブラウザ上のキャンバス領域に絵を描き始める。この描画データは、SVG(Scalable Vector Graphics)という形式で記録される。SVGは、点や線の座標情報で画像を表現するため、拡大縮小しても画質が劣化しない特徴を持つ。次に、このSVG形式の描画データを、APIを介してAIに送信できる形に変換する必要がある。具体的には、SVGデータを画像ファイルとしてレンダリングし、それをBase64というエンコード方式を用いてテキスト文字列に変換する。Base64エンコードは、画像のようなバイナリデータをテキストデータとして安全に送受信するために広く用いられる技術だ。こうして準備された画像データは、AIへの指示文である「プロンプト」と共に、インターネット経由でGemini Pro Vision APIに送信される。リクエストを受け取ったGoogleのサーバー上で稼働するGemini AIが画像を解析し、何が描かれているかを推測する。そして、その推測結果がAPIの応答として開発者のアプリケーションに返却され、最終的にユーザーの画面に「これは『猫』ですか?」といった形で表示される。この一連の流れが瞬時に行われることで、リアルタイムなゲーム体験が実現されている。

このプロジェクトの成功において特に重要なのが、「プロンプトエンジニアリング」と呼ばれる技術の巧みな活用である。プロンプトエンジニアリングとは、AIから望む回答を最大限に引き出すために、入力する指示や質問(プロンプト)を戦略的に設計する手法のことだ。開発者は、単に描かれた絵をAIに見せて「これは何ですか?」と漠然と尋ねるだけでは、期待する精度が得られないことに気づいた。AIが全く関係のない、無数の可能性の中から答えを探そうとしてしまうためだ。そこで、より的確な答えを導き出すための工夫が凝らされた。具体的には、質問の形式を「この絵は、以下のリストの中のどれに最も近いですか?」という形に変更したのだ。そして、そのリストとして、「Quick, Draw! Dataset」に含まれる345個のカテゴリ名(猫、車、ギター、ピザなど)をAIに提示した。このように、AIにあらかじめ回答の選択肢を限定して与えることで、AIは定められた範囲内で最も可能性の高い答えを選べばよくなり、推測の精度が劇的に向上した。この手法は、AIの能力を特定のタスクに最適化させる上で非常に効果的であり、現代のAIアプリケーション開発における重要なスキルの一つとなっている。

このアプリケーションの技術的な特徴として、サーバーサイドのプログラムを持たないシンプルな構成であることも挙げられる。すべての処理は、ユーザーのブラウザ上で動作するJavaScriptによって完結する、いわゆるクライアントサイドアプリケーションとして構築されている。フロントエンドの開発には、人気のフレームワークであるNext.jsが使用された。この構成により、開発者はサーバーの構築や管理といったインフラ面の複雑さから解放され、アプリケーションの機能開発そのものに集中することができた。また、サーバーコストがかからないため、個人開発者でも低コストでサービスを公開・運用できるという大きな利点がある。最新のAI APIと高機能なフロントエンドフレームワークを組み合わせることで、アイデアを迅速に形にできる現代の開発環境の好例と言える。開発者は今後の展望として、スコア機能や難易度設定の追加、描画データを活用したさらなる機能拡張などを構想しており、このプロジェクトが今後さらに発展していく可能性を示している。

関連コンテンツ

関連ITニュース