PhotoPop Organizer
写真や動画を選ぶだけで、重複・ブレ写真を整理し、撮影日順のアルバムを作成できるPWAです。データは外部へ送信せず、端末内で安全に保存・処理します。
制作の背景
スマートフォンに増え続ける家族写真を、安心して簡単に整理できるアプリを目指して制作しました。整理が苦手な方でも使いやすいよう、写真を選ぶだけで重複やブレを確認し、撮影日順のアルバムを作成できる設計にしています。
また、個人の写真を扱うため、外部サーバーへ送信せず端末内で処理・保存することを重視しました。子どもや家族にも親しみやすいよう、POPな配色とオリジナルキャラクター「ポッピィ」を採用しています。
主な機能
写真・動画の複数選択
撮影日時順の自動並び替え
重複写真の検出
ブレ・ボケ写真の候補判定
アルバムの作成・編集・削除
IndexedDBによる端末内保存
作成途中の自動保存・再開
PDF・元ファイルの書き出し
オフライン利用・PWA対応
HEIC画像・iPhone Safari対応
写真を外部へ送信しないプライバシー設計
使用ツール・制作時間
使用ツール
HTML / CSS / JavaScript / IndexedDB / PWA / Service Worker / jsPDF / Codex / ChatGPT画像生成
制作時間
約2日
工夫したポイント
美容室の上質な雰囲気を表現するため、ブラックを基調にゴールドをアクセントとして取り入れ、高級感のあるスタイリッシュなデザインに仕上げました。
また、スマートフォンでの操作性を意識し、予約や顧客管理などの主要な機能へ直感的にアクセスできる画面構成にしています。
さらに、PWAに対応することで、ホーム画面からアプリのように起動できるようにしました。AIを活用しながら、短期間でデザイン性と使いやすさを両立した点も工夫したポイントです。
PWA・アプリアイコン
PWA用のアプリアイコンも制作しました。
ホーム画面に追加した際にもアプリの明るく楽しい雰囲気が伝わるよう、メインキャラクターのカメラをモチーフに、コーラルピンクやミントグリーンを取り入れたPOPで親しみやすいデザインに仕上げています。
「制作を通して学んだこと」
今回の制作を通して、見た目のかわいさだけでなく、利用する人が迷わず操作できる画面づくりの大切さを学びました。
写真や動画を端末内に安全に保存する仕組みや、アルバム管理、削除前の確認、PWA対応などを実装することで、使いやすさとデータ保護の両方を考えながら設計する経験ができました。
また、子どもや家族にも親しみを持ってもらえるよう、キャラクターや配色、アイコンまで世界観を統一することで、機能とデザインを一緒に考える重要性も学びました
コメント