リクエスト詳細
✨ 既存アプリの改善
対応完了
対象アプリ: 多言語フラッシュカード学習 CardMaster
カスタムカード作成・管理機能の追加
## 1. 目的
プリセット教材だけでなく、ユーザーが自分で単語カードを作成・編集・削除できる「マイデッキ」機能を追加する。試験単語・専門用語・旅行フレーズなど個人ニーズに合わせた学習を可能にし、継続利用の動機を高める。
---
## 2. 具体的な仕様
### 2-1. データ構造(localStorage)
- キー名: `customDecks`
- 形式: JSON配列
```json
[
{
"deckId": "uuid_string",
"deckName": "TOEIC頻出単語",
"language": "en",
"createdAt": "2025-01-01T00:00:00Z",
"cards": [
{
"cardId": "uuid_string",
"front": "serendipity",
"back": "偶然の幸運な発見",
"reading": "セレンディピティ"
}
]
}
]
```
- `reading` は任意項目(日中韓の場合に読み補助として既存の読み方トグルと連携)
- デッキ数上限: 20件、1デッキあたりカード上限: 120枚(超過時はUI上でエラー表示)
### 2-2. UIエントリーポイント
- ホーム画面の言語選択エリアの下(既存の学習モードボタン群より上)に「✏️ マイデッキ」ボタンを1つ追加
- ボタンはプリセット教材の言語選択とは独立して常に表示
### 2-3. マイデッキ管理画面(モーダル)
- 「✏️ マイデッキ」ボタンクリックでフルスクリーンモーダルを表示
- 上部: 「+ 新しいデッキを作成」ボタン
- デッキ一覧: カード名・言語・カード枚数・作成日を表示するカードリスト形式
- 各デッキに「学習開始」「編集」「削除」の3ボタン
- デッキが0件の場合は「まだデッキがありません。作成してみましょう!」のメッセージ表示
### 2-4. デッキ作成・編集フォーム(サブモーダル)
- 入力項目:
- デッキ名(テキスト入力、必須、最大30文字)
- 言語選択(既存7言語のセレクトボックス)
- カード一覧テーブル(表・裏・読み方の3列)
- 各行に「削除」ボタン
- 最終行に「+ カードを追加」ボタン → 新規入力行を末尾に追加
- 表(front): 必須、最大50文字
- 裏(back): 必須、最大100文字
- 読み方(reading): 任意、最大50文字
- 「保存」ボタンで`customDecks`に書き込み、サブモーダルを閉じてデッキ一覧を更新
- 「キャンセル」ボタンで変更破棄して閉じる
- バリデーション: カード0枚での保存は不可(エラーメッセージ表示)
### 2-5. 学習開始フロー
- デッキの「学習開始」ボタンを押すと、既存の「学習設定モーダル(v1.21.0)」を同様に表示
- 出題順序(シャッフル/登録順)と出題枚数スライダーを使用
- 設定確定後、既存の4択モードを起動
- 選択肢4択の生成: 同デッキ内の他カードの`back`からランダム3択+正解1択。デッキ内カードが4枚未満の場合は他デッキや同言語プリセットの`back`値を補完
- 音声読み上げ(TTS): 既存Web Speech APIをそのまま使用(`front`テキストを読み上げ)
- 読み方トグル(v1.24.0): `reading`が入力されているカードで有効化
- SRSスケジューラー(v1.25.0): 回答結果を`srsData`に記録(デッキIDをプレフィックスとしたキーで管理)
- セッション履歴(v1.22.0): モード名「カスタム」として既存と同様に記録
- 苦手集中モード・エンドレスモードには非対応(学習設定モーダルでこれらのタブを非表示)
### 2-6. スマホ対応
- カード一覧テーブルはスマホでは縦並びのカード形式(表・裏・読み方を縦積み)に切り替え
- 入力フォームはfont-size:16px以上でiOSズーム防止
- モーダルはoverflow-y:scrollで縦スクロール対応
---
## 3. 既存機能との整合(壊さない点)
- プリセット教材・既存学習モードのデータ・ロジックには一切手を加えない
- `customDecks`キーは既存のlocalStorageキー(`srsData`・`sessionHistory`・`weakCards`・`studySettings`等)と名前が衝突しない
- 既存の4択モードのレンダリング関数を再利用し、カードソースのみ差し替える形で実装
- ホーム画面レイアウトは「✏️ マイデッキ」ボタン1つの追加のみで、既存要素の位置・デザインを変更しない
プリセット教材だけでなく、ユーザーが自分で単語カードを作成・編集・削除できる「マイデッキ」機能を追加する。試験単語・専門用語・旅行フレーズなど個人ニーズに合わせた学習を可能にし、継続利用の動機を高める。
---
## 2. 具体的な仕様
### 2-1. データ構造(localStorage)
- キー名: `customDecks`
- 形式: JSON配列
```json
[
{
"deckId": "uuid_string",
"deckName": "TOEIC頻出単語",
"language": "en",
"createdAt": "2025-01-01T00:00:00Z",
"cards": [
{
"cardId": "uuid_string",
"front": "serendipity",
"back": "偶然の幸運な発見",
"reading": "セレンディピティ"
}
]
}
]
```
- `reading` は任意項目(日中韓の場合に読み補助として既存の読み方トグルと連携)
- デッキ数上限: 20件、1デッキあたりカード上限: 120枚(超過時はUI上でエラー表示)
### 2-2. UIエントリーポイント
- ホーム画面の言語選択エリアの下(既存の学習モードボタン群より上)に「✏️ マイデッキ」ボタンを1つ追加
- ボタンはプリセット教材の言語選択とは独立して常に表示
### 2-3. マイデッキ管理画面(モーダル)
- 「✏️ マイデッキ」ボタンクリックでフルスクリーンモーダルを表示
- 上部: 「+ 新しいデッキを作成」ボタン
- デッキ一覧: カード名・言語・カード枚数・作成日を表示するカードリスト形式
- 各デッキに「学習開始」「編集」「削除」の3ボタン
- デッキが0件の場合は「まだデッキがありません。作成してみましょう!」のメッセージ表示
### 2-4. デッキ作成・編集フォーム(サブモーダル)
- 入力項目:
- デッキ名(テキスト入力、必須、最大30文字)
- 言語選択(既存7言語のセレクトボックス)
- カード一覧テーブル(表・裏・読み方の3列)
- 各行に「削除」ボタン
- 最終行に「+ カードを追加」ボタン → 新規入力行を末尾に追加
- 表(front): 必須、最大50文字
- 裏(back): 必須、最大100文字
- 読み方(reading): 任意、最大50文字
- 「保存」ボタンで`customDecks`に書き込み、サブモーダルを閉じてデッキ一覧を更新
- 「キャンセル」ボタンで変更破棄して閉じる
- バリデーション: カード0枚での保存は不可(エラーメッセージ表示)
### 2-5. 学習開始フロー
- デッキの「学習開始」ボタンを押すと、既存の「学習設定モーダル(v1.21.0)」を同様に表示
- 出題順序(シャッフル/登録順)と出題枚数スライダーを使用
- 設定確定後、既存の4択モードを起動
- 選択肢4択の生成: 同デッキ内の他カードの`back`からランダム3択+正解1択。デッキ内カードが4枚未満の場合は他デッキや同言語プリセットの`back`値を補完
- 音声読み上げ(TTS): 既存Web Speech APIをそのまま使用(`front`テキストを読み上げ)
- 読み方トグル(v1.24.0): `reading`が入力されているカードで有効化
- SRSスケジューラー(v1.25.0): 回答結果を`srsData`に記録(デッキIDをプレフィックスとしたキーで管理)
- セッション履歴(v1.22.0): モード名「カスタム」として既存と同様に記録
- 苦手集中モード・エンドレスモードには非対応(学習設定モーダルでこれらのタブを非表示)
### 2-6. スマホ対応
- カード一覧テーブルはスマホでは縦並びのカード形式(表・裏・読み方を縦積み)に切り替え
- 入力フォームはfont-size:16px以上でiOSズーム防止
- モーダルはoverflow-y:scrollで縦スクロール対応
---
## 3. 既存機能との整合(壊さない点)
- プリセット教材・既存学習モードのデータ・ロジックには一切手を加えない
- `customDecks`キーは既存のlocalStorageキー(`srsData`・`sessionHistory`・`weakCards`・`studySettings`等)と名前が衝突しない
- 既存の4択モードのレンダリング関数を再利用し、カードソースのみ差し替える形で実装
- ホーム画面レイアウトは「✏️ マイデッキ」ボタン1つの追加のみで、既存要素の位置・デザインを変更しない
💬 返信 (3)
🛠 開発を開始しました (機能追加 (cardmaster))
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
📝 開発が完了しました
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
✅ リリース完了のお知らせ
ご要望いただいた「多言語フラッシュカード学習 CardMaster」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=cardmaster
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/cardmaster/
ご利用ありがとうございます!
ご要望いただいた「多言語フラッシュカード学習 CardMaster」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=cardmaster
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/cardmaster/
ご利用ありがとうございます!
Echo
Iris