アプリ概要
CamScanShareは、紙の文書をスキャンしてPDF化し、共有することに特化したモバイルアプリです。
スキャン
カメラで紙の文書を撮影。自動で紙の領域を検出し、台形補正・クロップを行います。
調整
撮影した画像を回転、フィルタ適用して読みやすく調整。文書に最適化されたプリセットを用意。
共有
PDFに変換し、Google DriveやAirDropなどOS標準の共有機能で即座にシェア。
画面遷移フロー
アプリ内の主要な画面遷移を示します。
文書一覧
FABタップ
(新規スキャン)
(新規スキャン)
▼
文書タップ
(既存文書)
(既存文書)
カメラスキャン
完了 →
ページ一覧
ページ選択
▼
← ページ追加(カメラ起動) 共有 → PDF出力 →
ページ編集
回転 / 撮り直し / フィルタ
撮り直し → カメラ(単発撮影)→ 自動で戻る
← 戻る(文書一覧へ)
画面 1
文書一覧
アプリ起動時のホーム画面。過去にスキャンした文書が一覧表示されます。
インタラクティブモック - クリックして操作できます
画面要素
- 文書リスト ステータスバー直下から画面全体を使う縦スクロールのリストビュー。各行は左にアイコンサムネイル(48×48、1ページ目のプレビュー)、右に文書名・ページ数・作成日を表示。リスト末尾にはホームインジケーター(ジェスチャーバー)領域分のパディングを設け、最終行がジェスチャーバーに重ならないようにする。
- 選択モードアクションバー 複数選択モード時に画面上部からスライドインで表示。選択件数・✕(閉じる)ボタン・削除ボタンを配置。プライマリカラー背景。表示時はリスト全体をアクションバーの高さ(56px)分下に押し下げ、先頭行が隠れないようにする。
- FAB(Floating Action Button) 画面右下にホームインジケーター領域の上に固定配置。カメラアイコン付き。パルスアニメーションで初回ユーザーへの視認性を向上。選択モード中は非表示。
インタラクション
- 文書をタップ リップルエフェクト → ページ一覧画面へ遷移
- 文書を長押し 複数選択モードに入り、長押しした文書が選択状態になる。サムネイルにチェックマークが表示される。アクションバーのスライドインに連動してリストが下に押し下げられ、長押しした行が隠れないようにする。
- 選択モード中にタップ タップした文書の選択/選択解除をトグル。選択数が0件になると自動的に選択モードを終了。
- 削除ボタンをタップ 確認ダイアログを表示(「選択したN件の文書を削除しますか?」)。確認後、一括削除しスライドアウトアニメーションで消去。
- FABをタップ カメラスキャン画面が起動し、新規文書のスキャンを開始
データ
- 表示情報 文書名、作成日、ページ数、アイコンサムネイル(1ページ目のプレビュー)
- ソート順 最終更新日時の降順(新しいものが上)
- 空状態 文書がない場合は空状態メッセージとFABへの誘導を表示
画面 2
カメラスキャン
カメラを使って紙の文書を撮影する画面。紙の自動検出とガイド表示で撮影を補助します。
撮影ボタンをクリックするとアニメーションが再生されます
画面要素
- カメラビューファインダー デバイスカメラのリアルタイムプレビューを全画面表示。UIを最小限にしてファインダー領域を最大化。
- 紙検出ガイド(矩形オーバーレイ) 紙を検出すると、四角形の枠ガイドが紙の輪郭に沿って表示される。コーナーマーカーと半透明フィルで視認性を確保。検出中はリアルタイムでトラッキング。
- 撮影ボタン 画面下部中央に大型の円形ボタン。物理シャッターボタンを模した2重円デザイン。グラデーション付きオーバーレイ上に配置。
- 左下アクションエリア 撮影枚数に応じて表示が切り替わる。0枚時は閉じるボタン(✕アイコン)、1枚以上ではサムネイルスタック(枚数バッジ付き)を表示。最新の撮影ページがサムネイルの最前面に反映される。
インタラクション
- 撮影ボタンをタップ フラッシュエフェクト → 撮影画像が縮小しながら左下のサムネイルスタックへ飛んでいくアニメーション → 枚数バッジがインクリメント
- 閉じるボタンをタップ(0枚時) スキャンを中断し、文書一覧画面へ戻る。
- サムネイルスタックをタップ(1枚以上) スキャンを終了し、ページ一覧画面へ遷移。クロップ処理が実行される。
- 紙の検出 検出矩形がリアルタイムでトラッキング。紙がファインダー中央付近にあるときのみガイドが表示される。
技術的な考慮点
- 紙検出アルゴリズム ファインダー中は、紙の四隅を見つけるための軽量なリアルタイム検出のみを行う。低解像度フレームを対象に、ぼかし → エッジ抽出 → 膨張 → 輪郭検出 → 四角形近似 → スコアリング選択を複数条件で試し、もっとも文書らしい四角形をオーバーレイ表示する。ここでの目的は保存用画像を作ることではなく、ユーザーに「今どこが紙として認識されているか」を安定して見せることにある。
- 四角形のスコアリング 検出された四角形の「文書らしさ」を、長方形度(各内角の90°からの偏差)・対辺の平行度・面積比率の加重スコアで評価する。面積が最大でも歪んだ四角形(床のコーナー等)より、小さくても長方形に近い紙を優先する。
- リアルタイム検出の安定化 カメラプレビュー中のオーバーレイ表示は、直近7フレームの検出結果を保持し、3フレーム以上で合意がある場合に各コーナーの中央値を返す。検出が一時的に失われた場合も最後の有効結果を500ms間保持し、枠の消失を防止する。さらに、コーナー座標の変化はアニメーション補間(150ms)で描画し、フレーム間の微小な座標変動による視覚的なちらつきを抑える。
- 保存時の Step 0 生成 シャッター押下後は、保存対象となる高解像度画像に対してあらためて紙検出を実行し、その四角形を使って射影変換を行う。これがページ画像の基準となる Step 0 であり、「台形補正済み・正面化済みの元画像」として保存される。ファインダー中の低解像度検出結果はガイド表示のためだけに使い、保存時の補正には流用しない。
- Step 1 以降との関係 文書処理パイプラインは、保存基準画像となる Step 0 の後に、必要に応じて「A4 に近い文書だけ比率を正規化する Step 1」を挟み、その後にフィルタ処理へ進む設計とする。カメラスキャン画面の責務は Step 0 を安定して作ることであり、Step 1 以降は編集・表示パイプライン側で扱えるよう段階を分離する。
- 連続撮影 撮影後もカメラは起動したまま。閉じるボタンまたはサムネイルスタックをタップするまで連続して撮影可能。
画面 2b
撮り直し(カメラスキャン)
ページ編集画面の「撮り直し」ボタンから遷移する、単発撮影モードのカメラ画面。1枚撮影すると自動で元の画面に戻り、該当ページの画像を差し替えます。
撮影ボタンをクリックすると1枚だけ撮影し、完了アニメーションが再生されます
通常撮影との違い
- 左下は常に閉じるボタン(✕) 通常撮影では撮影後にサムネイルスタックに切り替わるが、撮り直しモードでは常に閉じるボタンを表示。タップすると撮り直しをキャンセルしてページ編集画面に戻る。
- サムネイルスタック・枚数バッジなし 撮り直しは単発撮影のため、サムネイルスタックと枚数バッジは表示しない。
- 紙検出ガイド 通常撮影と同じ。紙を検出するとガイド枠が表示され、撮影時に台形補正が適用される。
インタラクション
- 撮影ボタンをタップ フラッシュエフェクト → 「撮り直し完了」オーバーレイ(✓アイコン + テキスト)を短時間表示 → 自動的にページ編集画面に戻る。元のページの画像が新しい撮影画像に差し替えられる。
- 閉じるボタン(✕)をタップ 撮り直しをキャンセルし、ページ編集画面に戻る。元のページ画像は変更されない。
- 2回目以降の撮影ボタンタップ 1枚撮影後は撮影ボタンが無効化されるため、連続撮影は不可。
技術的な考慮点
- 画像差し替え 撮影した画像はDB上で該当ページの imagePath を更新し、旧画像ファイルを削除する。フィルタ設定と回転設定は維持される。
- 編集中の状態保持 撮り直しで画像が差し替わっても、ユーザーが編集中のフィルタ・回転の設定は破棄せず保持する。画像パスのみ更新し、未保存の編集内容はそのまま残る。
画面 3
ページ一覧
スキャン済みの各ページをクロップ済み画像で表示。ドラッグ&ドロップで並べ替え、共有・追加が可能です。
ページを長押しするとドラッグ&ドロップで並べ替え。下部にドロップで削除。
画面要素
- トップアプリバー 戻るボタン(文書一覧へ)、文書名(タップで名前変更ダイアログ)、共有ボタン。
- 文書名 初期値は「新規ドキュメント_YYYY-MM-DD_hh-mm-ss」形式。タップするとダイアログで名前変更が可能。
- ページグリッド 2カラムのグリッドでクロップ済みのページ画像を表示。各サムネイルの下にページ番号を表示。
- ページ追加FAB 右下にカメラ+追加アイコンのFAB。タップするとカメラが起動し、既存文書にページを追加。ドラッグ中は非表示。
- 削除ゾーン(ドラッグ中) ドラッグ中に画面下部(高さ80dp)に表示される削除エリア。ページをドロップすると確認なしで削除。ゴミ箱に吸い込まれるアニメーション付き。
インタラクション
- 文書名をタップ 名前変更ダイアログが表示される。新しい名前を入力して「変更」で確定。
- ページカードをタップ ページ編集画面へ遷移。
- ページカードを長押し ドラッグモードに移行。カードが浮き上がり、FABが非表示になり、画面下部に削除ゾーンが出現。
- ドラッグ中に他のカード上へ移動 ページの並び順がリアルタイムに入れ替わる。ドロップで確定。
- ドラッグ中に削除ゾーンへ到達 削除ゾーンが赤くハイライトされ、ドロップ可能であることを示す。この状態でドロップするとゴミ箱に吸い込まれるアニメーションでページが削除される。確認ダイアログなし。
- 共有ボタンをタップ 全ページをPDFに変換 → 共有シート(ボトムシート)が表示。Google Drive / AirDrop / その他の共有先を選択。
- ページ追加FABをタップ カメラが起動し、初回スキャンと同じ操作感でページを追加。追加完了後、このページ一覧に戻る。
- 戻るボタンをタップ 文書一覧画面へ戻る。
ドラッグ&ドロップの詳細
- ドラッグ開始 ページカードを500ms以上長押しするとドラッグモードに入る。カードが浮き上がり(拡大+影)、元の位置にはプレースホルダーが残る。同時に削除ゾーンが画面下部からスライドインし、FABは非表示になる。
- 削除ゾーンの反応判定 ドラッグ中にサムネイルが削除ゾーンに「到達した」とみなす基準点は、「サムネイルの中心」と「指の位置」のうち画面下方にある方(Y座標が大きい方)とする。サムネイルの上半分をつかんでいる場合はサムネイルの中心が基準となり、下半分をつかんでいる場合は指の位置が基準となる。これにより、つかむ位置に関わらず、サムネイルが削除ゾーンに視覚的に重なった自然なタイミングでハイライトが切り替わる。
- 削除ゾーンのハイライト 基準点が削除ゾーン内に入ると、ゾーンの背景色がエラーカラー(赤)に変わり、アイコンとテキストが白になる。基準点がゾーンから出ると元の色に戻る。
- ドロップ 指を離した時点でハイライト状態であればページを削除する。ハイライト状態でなければ、カードを現在のドラッグ位置に最も近いグリッド位置に挿入して並べ替える。
- 座標系に関する注意 ドラッグ判定で使う座標(カード位置・指の位置・削除ゾーン位置)は、すべて同一の座標系で計算すること。タッチ座標にはOS/フレームワークによって「画面の土台(Activity等)基準」のものと「ウィンドウ全体のグローバル座標」のものがあり、混同すると判定位置がステータスバーの高さ分ずれる等の不具合が生じる。また、ドラッグ中のカードに拡大・回転等の視覚変換が適用されている場合、タッチ座標の取得がその変換の内側で行われると、変換倍率の分だけ移動量が歪む。タッチ座標の取得は視覚変換の外側で行い、変換はあくまで表示にのみ影響させること。
共有フロー
- PDF変換 全ページを順番にPDFドキュメントへ統合。A4サイズにフィットさせる。
- 共有シート OS標準の共有APIを呼び出し。Google Drive、AirDrop等、デバイスで利用可能な共有先を表示。
画面 4
ページ編集
文書内の全ページに対して回転・フィルタ適用・撮り直しなどの調整を行う画面です。左右スワイプで編集対象ページを切り替えられます。
左右スワイプでページ切替、回転・フィルタを操作できます
画面要素
- ページプレビュー(スワイプ式) 左右スワイプで文書内の全ページを切り替え可能。回転やフィルタの適用結果がページごとにリアルタイムで反映される。下部にページインジケータ(例: 1 / 3)を表示。
- アクションツールバー 左90度回転・撮り直し・フィルタの3つのアクションボタンを横並び表示。操作は現在表示中のページに対して行われる。
- フィルタパネル フィルタボタンをタップすると下部からスライドイン。横スクロールでプリセットフィルタを選択。タップで現在ページのみ、長押しで全ページ一括適用の確認ダイアログを表示。
- 適用ボタン 右上に配置。編集内容(フィルタ・回転)を永続化する。永続化されるのは編集前の画像と編集パラメータであり、編集後の画像自体ではない。
インタラクション
- 左右スワイプ 編集対象ページを前後に切り替え。ページごとにフィルタ・回転の編集状態が独立して保持される。
- 左90度回転ボタン 現在表示中のページのプレビューが左方向に90度、スムーズにアニメーション回転。連続タップ可。
- 撮り直しボタン カメラを起動し、現在表示中のページのみ再撮影。撮り直し後、編集画面に戻る。
- フィルタボタン フィルタパネルの開閉をトグル。パネルはスムーズなスライドアニメーションで表示。
- フィルタを選択 タップで現在ページにフィルタをリアルタイム適用。選択中フィルタは青枠でハイライト。
- フィルタを長押し 「全ページに適用しますか?」確認ダイアログを表示。適用を選ぶと全ページに同じフィルタを一括適用。
- 適用ボタン 全ページの編集内容(フィルタ・回転)を永続化し、ページ一覧画面へ戻る。
- 戻るボタン 未保存の編集がなければそのまま戻る。編集がある場合は「編集内容を破棄しますか?」確認ダイアログを表示し、破棄を選ぶと変更を捨てて戻る。
データモデル
- 編集状態の保持 ページごとに「適用フィルタ名」「回転角度」を編集データとしてビューモデルで保持。適用ボタン押下まで永続化されない。
- 永続化の対象 編集後の画像ではなく、編集前の原画像+編集パラメータ(フィルタ・回転)を保存。プレビュー画像はキャッシュのみで永続化しない。
- ページ編集の基準画像 ページ編集が扱う原画像は、撮影時に生成された Step 0 とする。つまり、台形補正と正面化が終わった画像を基準に、回転・フィルタの編集状態を重ねていく。編集画面は撮影前の生画像には戻らない。
プレビュー生成パイプライン
- オリジナル表示 保存済みの Step 0 画像を読み込み、必要な回転だけを反映して表示する。これが全フィルタの共通の出発点になる。
- マジック以外のフィルタ くっきり・白黒・ホワイトボード・鮮やかは、Step 0 画像に対して軽量な色変換をその場で適用してプレビューする。フィルタ切り替え時は画像ファイルを作り直すのではなく、表示用ビットマップを再生成する。
- マジックフィルタ マジックは Step 0 または Step 1 を入力として、文書向けの画像補正を適用してプレビューする。概念的には docs の Step 2・Step 3 に近い処理であり、照明ムラの補正、トーンの自動伸長、紙面の白化、色アクセントの保持をまとめて行う。A4 に近い文書では、必要に応じて Step 1 の比率正規化を経由してからマジック処理に入れる。
フィルタプリセット
オリジナル / くっきり / 白黒 / マジック(既定) / ホワイトボード / 鮮やか の6種。
各フィルタの効果・パラメータの詳細は フィルタ解説ページ を参照。
※ フィルタは今後の要件に応じて追加可能な拡張設計とする。