1. ホーム
  2. /LEXIA BLOG
  3. /GensparkのAI Developerとは?GensparkのAI Developerを使って安全な便利ツールを作ってみた
フルスタック

GensparkのAI Developerとは?GensparkのAI Developerを使って安全な便利ツールを作ってみた

公開: 2025年12月16日•8分•執筆:齋藤雅人
女性がLEXIA Toolsの画面を見て驚いている様子

はじめに — AI 開発ツールの新潮流

生成系 AI の進化によって「コードを書かなくてもアプリが作れる」という世界が現実になってきました。Genspark の AI Developer はその代表例で、非エンジニアでも自然言語の指示から本格的なアプリケーションを生成できます。公式ブログによると、Genspark は Claude Code の仕組みを再実装し、ブラウザやアプリから複数の最先端モデルを選んで作業でき、しかも 人間によるコーディングなしで プロフェッショナルな成果物を得られると説明しています。さらに、AI Developer は L3 レベルのコードアシスタントではなく「L4 完全自律型エージェント」として、計画・コーディング・テスト・公開までを AI が担当する点が特徴です。

Genspark公式ブログ(L4 Autonomous Coding の説明)
https://mainfunc.ai/blog/genspark_ai_developer

この記事では、Genspark の AI Developer の概要と機能を紹介し、実際にこのツールを使って LEXIA Tools(https://tools.lexia-hp.com/)という便利なファイル処理ツールを構築した過程をまとめます。開発中に感じた不便な点や、AI Developer の驚きの機能、今後の展開についても共有します。

Genspark AI Developer の機能

ノーコードで完全なアプリを生成

Genspark AI Developer は自然言語のプロンプトからネイティブ iOS/Android アプリやウェブアプリを構築します。「ログイン画面やプッシュ通知、Firebase によるデータベースと分析機能まで備えた完全なアプリ」を数分で生成すると説明する記事もあります。

高性能な GPT‑5 や Claude 系モデルを使っており、コーディング経験がない企業やマーケターでもリード獲得用のランディングページや顧客情報取得ツールを短時間で作れる点が強調されています。

Genspark公式ブログ
Introducing Genspark AI Developer
https://mainfunc.ai/blog/genspark_ai_developer

Genspark公式 YouTube(AI Developer 紹介動画)
https://www.youtube.com/watch?v=5Rba4qCZyL4

マルチモデル対応・完全自律動作

AI Developer は複数のモデルを選択できる点も特長的。最近だとGemini 3 Pro Preview、GPT-5 Codex、Claude Opus 4.5などからプロジェクトに適したモデルを選び、AI がユーザーインターフェースからバックエンドロジック、管理画面までを自動生成します。L4 自律エージェントとしてコードの計画、実装、テスト、公開まで AI が進めるため、人間はクリエイティブな企画や UI 改善に集中できます。

以下画像は2025/12/16時点の使用モデル一覧

CRM 連携やリード獲得ツール

マーケティング活用の事例として、AI Developer が生成したアプリは CRM と連携してリードを自動的に取り込めると紹介されています。例えば、地域のサービス企業が見積もり計算アプリを作成すると、アプリ経由で集めた連絡先が既存の営業フローに自動で取り込まれるため、営業効率が向上します。アプリ公開後は AI が自動的にフォローアップシーケンスを構築し、少人数のマーケティングチームでも潜在顧客の育成ができる。

LEXIA Tools の開発

どんなツールを作ったのか

LEXIAは Genspark AI Developer を使って、ブラウザ上で完結する安全なファイル処理アプリ LEXIA Tools を開発しました。このアプリには次の 4 つの機能を実装しました。

機能名

主要な操作

特徴

ファイル名変更ツール

複数ファイルをアップロードし、基本名・区切り文字・開始番号を指定してリネーム

変換前後の名前とサイズをプレビューし、ZIP で一括ダウンロードできる

画像形式変換ツール

JPEG/PNG/WebP/AVIF/GIF などの画像を読み込み、変換先形式と品質を設定

Canvas API による高品質変換と、個別・ZIP ダウンロード機能

画像リサイズツール

複数画像をアップロードし、ピクセル指定またはパーセント指定でリサイズ

アスペクト比の保持/無視や品質調整ができ、リサイズ後のサイズを比較表示

ZIP圧縮/解凍ツール

複数ファイルを ZIP に圧縮、またはアップロードした ZIP の中身を確認し解凍

カスタム ZIP 名の設定、最高圧縮レベルでの圧縮、内容の一覧表示と個別/一括解凍

このアプリは Next.js 15 + TypeScript + Tailwind CSS で構築されており、サーバーにファイルをアップロードせずにブラウザ内で処理が完結します。操作はタブで切り替えられ、シンプルなモノトーンの UI にプレビュー機能を備えています。

実装の裏側

AI Developer が生成したコードでは、ファイル名変更ツールに JSZip を利用してアップロードされたファイルをリネームし、ZIP 形式でダウンロードする処理を行います。また、画像形式変換やリサイズでは Canvas API を用いて画質を保ちつつ形式変更やサイズ変更を実現します。全機能でプレビューを表示し、個別ダウンロードと ZIP 一括ダウンロードの両方をサポートしている点が個人的にお気に入りポイントです。

開発中に感じた不便な点

Genspark AI Developer の導入は非常に便利でしたが、開発中にいくつかの課題もありました。

  • AI が途中で止まることがある — AI Developer が作業中に停止し、エラーになった場面があり、クレジットを無駄にした。 一回のプロンプトで持っていかれるクレジットの量は50~100くらい。
  • 明確なガイドラインが必要 — 何も考えずに適当に指示してると勝手に紫っぽいグラデーションのUIに作り変える傾向があるので、「AGENTS.md」を作成させて明確なデザインルール等を設定するとその通りに作ってくれる。AGENTS.md書けるUIがAI Developer内のどこかにあると良いですね。

また、リポジトリを既存の GitHub プロジェクトと連携する際に有料プランへの加入が必要。とはいえ、手動でコーディングする場合に比べれば大幅な時間短縮になります。

開発中に驚いたこと

Genspark AI Developer を実際に使ってみて驚いた点も多々あります。UI・バックエンド・管理画面を含むフルスタックアプリもきちんと設計すれば生成できる。チャット欄を新しくしないといけないが、複数のモデルを切り替えながらコードを生成する様子は、VScode上で使用するGithub Copilotのようでした。

また、すごいのがVScode上で使用するGithub Copilotと違ってCloud flareとの連携でデプロイもできて見事。サンドボックス環境での開発もできますし、まだ試してないけどデータベースも実装できるかも?

また、生成されたコードは Next.js や React、Tailwind CSS など最新のフレームワークを組み合わせており、作成された UI も実用的であることに驚きました。AI が設計したコンポーネントを読み解く過程は学習にもなり、手動実装時には見落としがちな細かな例外処理やユーザビリティ改善が盛り込まれている点も好印象でした。

LEXIA Tools の今後の展開

README には、将来追加予定の機能として「ファイル名に日付を追加するなどのカスタムパターン」「個別ファイル名の編集」「ファイルの並べ替え」「SVG や TIFF などより多くの画像形式への対応」「処理履歴の保存」などが挙げています。AI Developer を使えば、これらの機能も自然言語で要件を記述するだけで実装できる可能性があります。具体的には、

  • カスタムリネーム機能 — EXIF 情報や撮影日を使って「2025-12-16_001.jpg」のような命名規則を自動生成。
  • SVG/SVGZ 変換 — デザイナー向けにベクタ画像の変換や最適化を追加。
  • PDF やテキスト抽出 — 画像からテキストを抽出して PDF を生成するユーティリティ。
  • 履歴管理とバッチ処理 — 過去の処理設定を保存し、ワンクリックで再実行できるようにする。
  • フィードバック機能の追加 — 不便な点や不具合を提出いただく窓口を作ろうかなと思ってます。(ここでAI Developerのデータベースが開発できるかどうかが分かる)

今後も AI Developer の機能進化に合わせてツール群を拡充し、より多くのファイル処理や画像編集のニーズに対応していく予定です。

まとめ

Genspark AI Developer は、自然言語から本格的なアプリケーションを生成する画期的なプラットフォームです。複数の最先端モデルを切り替えながらフルスタックアプリを自律的に構築し、CRM など外部サービスとの連携も自動で行えます。今回、AI Developer を用いて LEXIA Tools のようなブラウザベースの便利ツールを短期間で開発できたことは、生成系 AI の可能性を強く実感させてくれました。

開発中に一部の不便さ(途中で止まる、指示が必要など)も経験しましたが、明確なルール設定やプロンプト設計を工夫することで克服できました。今後は更なる機能追加や改善を進め、AI Developer の力を活かした Web ツールの提供、開発を続けていきます。

おまけ

最近のアップデートでチームチャットも追加されたみたいです。友達いないから使わないけど泣

他の記事も見る

同じジャンルのおすすめ

もっと見る →
Onlookとは?:Subframe・Tempo・v0・Boltなど、デザイナーと開発者のための次世代UIツール徹底比較

Onlookとは?:Subframe・Tempo・v0・Boltなど、デザイナーと開発者のための次世代UIツール徹底比較

OnlookはReactとTailwindを使った既存プロジェクトを“そのまま編集”できる唯一のVisual IDE。SubframeやTempo、v0など主要AIデザインツールと比較し、開発者が語る「one-to-one in code」の思想からOnlookだけの魅力を解説します。

2025年10月22日続きを読む →
Firebase Studioとは?Googleが描くAI時代の新しい開発環境

Firebase Studioとは?Googleが描くAI時代の新しい開発環境

Googleの次世代クラウドIDE「Firebase Studio」。Gemini連携によるAI開発体験を詳しく解説。

2025年10月17日続きを読む →

新着記事

Sim.aiって何?視覚的にAIエージェントを設計できるOSSワークフロー基盤

Sim.aiって何?視覚的にAIエージェントを設計できるOSSワークフロー基盤

Sim.aiは、AIエージェントや自動化フローを視覚的に設計・実行できるオープンソースのワークフロー基盤です。LLMやAPIをフローチャート感覚で組み立てられる特徴や、他ツールとの違いを解説します。

2025年12月17日続きを読む →
adk-go とは?Goで始める実務向けAIエージェント開発

adk-go とは?Goで始める実務向けAIエージェント開発

adk-goは、Googleが提供するGo向けAIエージェント開発用SDKです。本番運用を前提に、安全で制御しやすいAIエージェントを実装したい開発者向けに、特徴やできることをわかりやすく解説します。

2025年12月17日続きを読む →
v0ってどこまで実用的なアプリ作れる?

v0ってどこまで実用的なアプリ作れる?

v0を使って日程調整アプリ「LEXSYNC」を実際に開発・公開した事例を紹介。UI生成にとどまらず、実運用を見据えたUX設計や技術構成、v0の実践的な活用ポイントを解説します。

2025年12月16日続きを読む →

このブログの運営はホームページ制作やデザイン制作、動画制作などを行うWEB制作事業LEXIA(レキシア)が行っています。

制作の相談をする→

←記事一覧に戻る
LEXIALEXIA textLEXIALEXIA text

価値を伝わるカタチに

企業のウェブサイトは「顔」であると同時に、ブランド価値を伝える最重要ポイントです。御社のウェブサイトを「成果を生む資産」へと進化させます。

MENU

  • 事業概要
  • サービス一覧
  • 制作工程
  • 制作実績
  • チーム
  • 理念
  • お問い合わせ
  • プライバシーポリシー

Connect

  • お問い合わせフォーム
  • メール
  • 電話

Get in touch

lexia0web@gmail.com
footer iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter iconfooter icon