放課後CAMERA

概要 放課後CAMERA は、スマホで写真を撮り、パステル文字やスタンプで飾り、 「ふつうの画像」として保存することも、 このアプリ専用の「ひらく用データ」として保存・送信することもできる、 レトロカメラ風の PWA 試作です。娘のために作りました。 この試作の中心は、次の 3 ステップです。 撮る 飾る ひらく 通常利用では 「画像で保存」 を使えば十分です。 相手にもこのアプリで削って開いてほしいときだけ、「ひらく用を保存 / 送る」 を使います。 主な機能 スマホで写真を撮影、または既存画像を読み込み フィルター切り替え 好きな位置への文字追加 パステルカラー文字 スタンプ追加 文字・スタンプのサイズ調整 文字・スタンプの軽いアニメーション 完成画像の保存（PNG） アプリ専用データの保存 / 送信 読み込んだ専用データをグレー膜の上から削って表示 PWA としてホーム画面追加可能 使い方 1. 撮る 画面上部の 「1 撮る」 を選びます。 スマホ：カメラを起動 または 写真を選ぶ PC：ブラウザ内カメラ、または画像読み込み 写真を撮る / 選ぶと、自動で 「2 飾る」 に進みます。 2. 飾る 画面下のタブから操作します。 文字：テキスト追加、色、サイズ、アニメ スタンプ：スタンプ追加、サイズ、アニメ 調整：追加した要素の編集や削除 フィルターは写真全体にかかります。 3. 保存 画像で保存 ふつうの画像として保存します。 用途： LINE で送る Instagram や SNS に載せる アルバムに残す ひらく用を保存 このアプリ専用のデータとして保存します。 用途： 相手にもこのアプリで開かせたい グレー膜を削って見せたい ひらく用を送る 端末が対応していれば共有シートを開き、専用データを直接送ります。 4. ひらく 画面上部の 「3 ひらく」 を選び、 保存済みの ひらく用データ を読み込むと、 グレー膜をなぞって写真を表示できます。 PWA のインストール方法 iPhone / iPad（Safari） Safari で公開URLを開く 共有ボタンを押す 「ホーム画面に追加」 を選ぶ 追加後、ホーム画面のアイコンから起動する Android（Chrome） Chrome で公開URLを開く 右上メニューを開く 「ホーム画面に追加」 または 「インストール」 を選ぶ 画面の案内に従って追加する PC（Chrome / Edge） 公開URLを開く URLバー右側の インストールアイコン が出たら押す もしくはブラウザメニューからインストールを選ぶ ひらく用データについて 「ひらく用」は、このアプリで再生するための専用データです。 中にはおおむね次の情報が入っています。 元画像 選択したフィルター 追加した文字 追加したスタンプ 配置座標 サイズ アニメ設定 タイトル 通常の画像ではなく、アプリ上で再現するためのデータです。 既知の注意点 スマホブラウザによっては共有の挙動が少し違う 一部ブラウザではファイル共有の挙動が限定的 ローカル直開きでは PWA 機能が不完全になりやすい カメラ利用にはブラウザの許可が必要 端末によって capture 属性の挙動が少し異なることがある トラブルシューティング カメラが開かない HTTPS で公開されているか確認 ブラウザのカメラ権限を確認 端末ブラウザを再読み込み まずは 写真を選ぶ で動作確認 ホーム画面に追加できない manifest.webmanifest が正しく配置されているか確認 アイコンファイルが存在するか確認 HTTPS で配信しているか確認