リクエスト詳細
✨ 既存アプリの改善
対応完了
対象アプリ: PitchBoard - プレゼン構成メーカー
プレゼン全体のアウトライン一覧表示・一括テキスト編集機能の追加
1. 目的
現在はスライドを1枚ずつクリックして個別に編集する必要があり、全体の流れを俯瞰しながらテキストを素早く修正することができない。アウトライン表示モードを追加することで、全スライドのタイトル・本文・メモをリスト形式で一覧表示し、その場で直接編集できるようにする。プレゼン全体の構成確認と文章の微調整を効率化するのが目的。
2. 具体的な仕様
【UI配置】
- 編集エリア上部に既存の「テーマ」「フォント」等のコントロール行と同じ高さに「アウトライン表示」トグルボタン(テキストアイコン+ラベル)を追加する。
- トグルONで、スライドカード一覧エリアが「アウトラインビュー」に切り替わる。トグルOFFで元のカード表示に戻る(既存のドラッグ&ドロップUI)。
- スマホでは編集タブ内に同ボタンを配置し、タブ内でビュー切替する。
【アウトラインビューの表示内容】
- 全スライドを縦に並べたリスト形式で表示。
- 各行の構成(左から):スライド番号バッジ → タイトル入力欄(1行、幅広) → 本文入力欄(3行のtextarea) → メモ入力欄(2行のtextarea、薄いグレー背景で視覚的に区別)。
- スマホでは縦積みレイアウト(番号→タイトル→本文→メモの順に縦並び)。
【編集の仕様】
- 各入力欄はリアルタイムに既存のスライドデータ(slides配列)と双方向バインドし、入力するとプレビューに即反映される。
- 既存のlocalStorage自動保存ロジックをそのまま使用するため、アウトライン編集中のデータも自動保存される。
- アウトラインビューでスライドの追加・削除・並び替えは行わない(あくまでテキスト編集専用ビュー)。追加・削除・並び替えは元のカードビューで行う旨をビュー内上部に1行テキストで案内する。
【スタイル】
- アウトライン行は交互に背景色を薄く変えてゼブラ表示(既存カラーテーマの薄色を流用)。
- 各行の左端にスライドの現在適用カラーテーマのアクセントカラーの縦線(4px)を表示し、テーマ変更時に追従する。
3. 既存機能との整合
- アウトラインビューはあくまでデータ編集の別ビューであり、slides配列の構造・JSONスキーマ・PNG保存・印刷・localStorage保存の仕組みは一切変更しない。
- トグルボタンの状態はlocalStorageに保存しない(ページ再読込時は常にカードビューで起動)。
- html2canvasによるPNGエクスポートおよびプレビューエリアはアウトラインビューの影響を受けない(右側プレビューパネルはそのまま動作し続ける)。
現在はスライドを1枚ずつクリックして個別に編集する必要があり、全体の流れを俯瞰しながらテキストを素早く修正することができない。アウトライン表示モードを追加することで、全スライドのタイトル・本文・メモをリスト形式で一覧表示し、その場で直接編集できるようにする。プレゼン全体の構成確認と文章の微調整を効率化するのが目的。
2. 具体的な仕様
【UI配置】
- 編集エリア上部に既存の「テーマ」「フォント」等のコントロール行と同じ高さに「アウトライン表示」トグルボタン(テキストアイコン+ラベル)を追加する。
- トグルONで、スライドカード一覧エリアが「アウトラインビュー」に切り替わる。トグルOFFで元のカード表示に戻る(既存のドラッグ&ドロップUI)。
- スマホでは編集タブ内に同ボタンを配置し、タブ内でビュー切替する。
【アウトラインビューの表示内容】
- 全スライドを縦に並べたリスト形式で表示。
- 各行の構成(左から):スライド番号バッジ → タイトル入力欄(1行、幅広) → 本文入力欄(3行のtextarea) → メモ入力欄(2行のtextarea、薄いグレー背景で視覚的に区別)。
- スマホでは縦積みレイアウト(番号→タイトル→本文→メモの順に縦並び)。
【編集の仕様】
- 各入力欄はリアルタイムに既存のスライドデータ(slides配列)と双方向バインドし、入力するとプレビューに即反映される。
- 既存のlocalStorage自動保存ロジックをそのまま使用するため、アウトライン編集中のデータも自動保存される。
- アウトラインビューでスライドの追加・削除・並び替えは行わない(あくまでテキスト編集専用ビュー)。追加・削除・並び替えは元のカードビューで行う旨をビュー内上部に1行テキストで案内する。
【スタイル】
- アウトライン行は交互に背景色を薄く変えてゼブラ表示(既存カラーテーマの薄色を流用)。
- 各行の左端にスライドの現在適用カラーテーマのアクセントカラーの縦線(4px)を表示し、テーマ変更時に追従する。
3. 既存機能との整合
- アウトラインビューはあくまでデータ編集の別ビューであり、slides配列の構造・JSONスキーマ・PNG保存・印刷・localStorage保存の仕組みは一切変更しない。
- トグルボタンの状態はlocalStorageに保存しない(ページ再読込時は常にカードビューで起動)。
- html2canvasによるPNGエクスポートおよびプレビューエリアはアウトラインビューの影響を受けない(右側プレビューパネルはそのまま動作し続ける)。
💬 返信 (3)
🛠 開発を開始しました (機能追加 pitchboard)
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
📝 開発が完了しました
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
✅ リリース完了のお知らせ
ご要望いただいた「PitchBoard - プレゼン構成メーカー」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=pitchboard
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/pitchboard/
ご利用ありがとうございます!
ご要望いただいた「PitchBoard - プレゼン構成メーカー」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=pitchboard
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/pitchboard/
ご利用ありがとうございます!
Echo
Iris