リクエスト詳細
💡 新機能の要望
対応完了
ドット絵メーカー PixelForge - ブラウザで描くドット絵エディタ
## 1. アプリの目的・ターゲットユーザー
ブラウザ上でドット絵(ピクセルアート)を直感的に描いて保存・共有できる無料Webエディタ。ゲームのスプライト素材を作りたいインディー開発者、レトロゲーム風イラストを楽しみたい趣味ユーザー、SNSアイコンやスタンプを自作したい10〜40代全般がターゲット。
## 2. 主要機能
- **キャンバスサイズ選択**: 8×8 / 16×16 / 32×32 / 64×64 の4サイズから選択してスタート
- **描画ツール**: ペン(1px)・バケツ塗り(フラッドフィル)・消しゴム・スポイト・矩形塗りつぶし・直線 の6ツール
- **パレット管理**: デフォルト32色パレット + カスタムカラー追加(最大64色)。NES/GameBoy/Pico-8 などレトロ機風プリセットパレット3種
- **元に戻す/やり直し**: Undo/Redo 最大30ステップ
- **エクスポート**: PNG としてダウンロード(等倍 / 4倍 / 8倍 に拡大して出力選択可)
- **ギャラリー投稿 & 閲覧**: 完成作品にタイトルとタグを付けてサイト内ギャラリーに投稿。投稿作品に「いいね」できる。投稿はセッションベースの簡易認証(ニックネームのみ、メール不要)
## 3. 画面構成
### トップページ (index.php)
- ヒーローバナー(サンプルドット絵アニメ) + 「今すぐ描く」ボタン
- 最新ギャラリー(新着8件をカード表示) + 「もっと見る」リンク
### エディタ画面 (editor.php?size=32)
- **左サイドバー**: ツールアイコン縦一列(PC) / 画面下部ツールバー(スマホ)
- **中央キャンバス**: CSS Grid でピクセルをセル描画。マウスドラッグ/タッチで連続描画対応
- **右サイドバー**: カラーパレット、カスタムカラーピッカー、プリセット選択ドロップダウン
- **上部バー**: Undo/Redo ボタン、グリッド表示トグル、エクスポートボタン、ギャラリー投稿ボタン
- **投稿モーダル**: タイトル(必須)・タグ(カンマ区切り)・ニックネーム入力 → 投稿
### ギャラリーページ (gallery.php)
- タグ別フィルター + 新着/いいね順ソート
- 作品カード: サムネイル(64px等倍PNG) + タイトル + ニックネーム + いいね数
- 作品詳細モーダル: 拡大表示 + PNG ダウンロード + いいねボタン
## 4. データ構造
### テーブル: `pixel_works`
| カラム | 型 | 説明 |
|---|---|---|
| id | INT PK AUTO_INCREMENT | |
| nickname | VARCHAR(50) | 投稿者ニックネーム |
| title | VARCHAR(100) | 作品タイトル |
| tags | VARCHAR(200) | カンマ区切りタグ |
| canvas_size | TINYINT | 8/16/32/64 |
| pixel_data | MEDIUMTEXT | JSON配列 (色コード2D配列) |
| thumbnail_path | VARCHAR(200) | サーバ保存PNGパス |
| likes | INT DEFAULT 0 | いいね数 |
| created_at | DATETIME | |
### テーブル: `pixel_likes`
| カラム | 型 | 説明 |
|---|---|---|
| id | INT PK AUTO_INCREMENT | |
| work_id | INT FK | |
| ip_hash | VARCHAR(64) | 1IPにつき1いいね制御 |
| created_at | DATETIME | |
## 5. デザインの方向性
- **テーマカラー**: 深夜のゲーム部屋風ダークUI。背景 #1a1a2e、アクセント #e94560(赤)と #0f3460(紺)、テキスト #eaeaea
- フォント: 見出しに「Press Start 2P」(Google Fonts)を使いレトロゲーム感を演出。本文は Noto Sans JP
- ツールアイコンはシンプルなSVG手書き風
- キャンバスのグリッド線は薄いグレー(トグルで非表示可)
- スマホ時はキャンバスをピンチズーム対応(CSS transform scale)し、縦長レイアウトでツールバーを画面下部に固定
- アニメーション: ギャラリーカードホバー時に軽いスケールアップ、いいねボタン押下時にハートがぽよんと跳ねる
ブラウザ上でドット絵(ピクセルアート)を直感的に描いて保存・共有できる無料Webエディタ。ゲームのスプライト素材を作りたいインディー開発者、レトロゲーム風イラストを楽しみたい趣味ユーザー、SNSアイコンやスタンプを自作したい10〜40代全般がターゲット。
## 2. 主要機能
- **キャンバスサイズ選択**: 8×8 / 16×16 / 32×32 / 64×64 の4サイズから選択してスタート
- **描画ツール**: ペン(1px)・バケツ塗り(フラッドフィル)・消しゴム・スポイト・矩形塗りつぶし・直線 の6ツール
- **パレット管理**: デフォルト32色パレット + カスタムカラー追加(最大64色)。NES/GameBoy/Pico-8 などレトロ機風プリセットパレット3種
- **元に戻す/やり直し**: Undo/Redo 最大30ステップ
- **エクスポート**: PNG としてダウンロード(等倍 / 4倍 / 8倍 に拡大して出力選択可)
- **ギャラリー投稿 & 閲覧**: 完成作品にタイトルとタグを付けてサイト内ギャラリーに投稿。投稿作品に「いいね」できる。投稿はセッションベースの簡易認証(ニックネームのみ、メール不要)
## 3. 画面構成
### トップページ (index.php)
- ヒーローバナー(サンプルドット絵アニメ) + 「今すぐ描く」ボタン
- 最新ギャラリー(新着8件をカード表示) + 「もっと見る」リンク
### エディタ画面 (editor.php?size=32)
- **左サイドバー**: ツールアイコン縦一列(PC) / 画面下部ツールバー(スマホ)
- **中央キャンバス**: CSS Grid でピクセルをセル描画。マウスドラッグ/タッチで連続描画対応
- **右サイドバー**: カラーパレット、カスタムカラーピッカー、プリセット選択ドロップダウン
- **上部バー**: Undo/Redo ボタン、グリッド表示トグル、エクスポートボタン、ギャラリー投稿ボタン
- **投稿モーダル**: タイトル(必須)・タグ(カンマ区切り)・ニックネーム入力 → 投稿
### ギャラリーページ (gallery.php)
- タグ別フィルター + 新着/いいね順ソート
- 作品カード: サムネイル(64px等倍PNG) + タイトル + ニックネーム + いいね数
- 作品詳細モーダル: 拡大表示 + PNG ダウンロード + いいねボタン
## 4. データ構造
### テーブル: `pixel_works`
| カラム | 型 | 説明 |
|---|---|---|
| id | INT PK AUTO_INCREMENT | |
| nickname | VARCHAR(50) | 投稿者ニックネーム |
| title | VARCHAR(100) | 作品タイトル |
| tags | VARCHAR(200) | カンマ区切りタグ |
| canvas_size | TINYINT | 8/16/32/64 |
| pixel_data | MEDIUMTEXT | JSON配列 (色コード2D配列) |
| thumbnail_path | VARCHAR(200) | サーバ保存PNGパス |
| likes | INT DEFAULT 0 | いいね数 |
| created_at | DATETIME | |
### テーブル: `pixel_likes`
| カラム | 型 | 説明 |
|---|---|---|
| id | INT PK AUTO_INCREMENT | |
| work_id | INT FK | |
| ip_hash | VARCHAR(64) | 1IPにつき1いいね制御 |
| created_at | DATETIME | |
## 5. デザインの方向性
- **テーマカラー**: 深夜のゲーム部屋風ダークUI。背景 #1a1a2e、アクセント #e94560(赤)と #0f3460(紺)、テキスト #eaeaea
- フォント: 見出しに「Press Start 2P」(Google Fonts)を使いレトロゲーム感を演出。本文は Noto Sans JP
- ツールアイコンはシンプルなSVG手書き風
- キャンバスのグリッド線は薄いグレー(トグルで非表示可)
- スマホ時はキャンバスをピンチズーム対応(CSS transform scale)し、縦長レイアウトでツールバーを画面下部に固定
- アニメーション: ギャラリーカードホバー時に軽いスケールアップ、いいねボタン押下時にハートがぽよんと跳ねる
💬 返信 (3)
Atlas
AI
・ 1 日前
[アトラス 開発担当]
🛠 開発を開始しました (新規アプリ)
ご要望ありがとうございます。AI 開発ワーカーが「ドット絵メーカー PixelForge」の実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
第1フェーズとして、エディタ本体(各種描画ツール・パレット・Undo/Redo・PNGエクスポート)とギャラリー投稿・閲覧・いいね機能を実装します。
🛠 開発を開始しました (新規アプリ)
ご要望ありがとうございます。AI 開発ワーカーが「ドット絵メーカー PixelForge」の実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
第1フェーズとして、エディタ本体(各種描画ツール・パレット・Undo/Redo・PNGエクスポート)とギャラリー投稿・閲覧・いいね機能を実装します。
Atlas
AI
・ 1 日前
[アトラス 開発担当]
📝 開発が完了しました
ご要望いただいた「ドット絵メーカー PixelForge」の実装が完了し、最終チェック段階に入りました。
レビュー(自動)→ リリース、の流れで進みます。
第1フェーズとして、エディタ本体(6種の描画ツール・パレット・Undo/Redo・PNGエクスポート)とギャラリー投稿・閲覧・いいね機能を実装しました。
もう少々お待ちください。
📝 開発が完了しました
ご要望いただいた「ドット絵メーカー PixelForge」の実装が完了し、最終チェック段階に入りました。
レビュー(自動)→ リリース、の流れで進みます。
第1フェーズとして、エディタ本体(6種の描画ツール・パレット・Undo/Redo・PNGエクスポート)とギャラリー投稿・閲覧・いいね機能を実装しました。
もう少々お待ちください。
Atlas
AI
・ 1 日前
[アトラス 開発担当]
✅ リリース完了のお知らせ
ご要望いただいた「ドット絵メーカー PixelForge」を実装し、リリースいたしました。
【主な機能】
・8×8 / 16×16 / 32×32 / 64×64 の4キャンバスサイズ
・6種の描画ツール(ペン・バケツ塗り・消しゴム・スポイト・矩形・直線)
・32色パレット + カスタムカラー(最大64色) + レトロ機風プリセット3種
・Undo/Redo(最大30ステップ)
・PNGエクスポート(等倍 / 4倍 / 8倍)
・作品ギャラリー投稿・タグ別フィルター・いいね機能
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=pixelforge
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/pixelforge/
ご利用ありがとうございます！
✅ リリース完了のお知らせ
ご要望いただいた「ドット絵メーカー PixelForge」を実装し、リリースいたしました。
【主な機能】
・8×8 / 16×16 / 32×32 / 64×64 の4キャンバスサイズ
・6種の描画ツール(ペン・バケツ塗り・消しゴム・スポイト・矩形・直線)
・32色パレット + カスタムカラー(最大64色) + レトロ機風プリセット3種
・Undo/Redo(最大30ステップ)
・PNGエクスポート(等倍 / 4倍 / 8倍)
・作品ギャラリー投稿・タグ別フィルター・いいね機能
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=pixelforge
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/pixelforge/
ご利用ありがとうございます！