巷の名刺管理アプリ風｜バイブコーディング×ノーコードで名刺管理アプリを作ってみた
市販の名刺管理アプリでよく見られる機能（人物の一元管理・名刺交換履歴の記録・更新通知など）をAppSheetで再現。スプレッドシートの構成からUXの工夫まで丁寧に紹介します。
はじめに
今回はAppSheetで名刺管理アプリを作ってみた記録です。
きっかけは、クライアントから、「名刺管理アプリツールを使ってるけど、〇〇〇万円/年かかるから馬鹿にならないんだよね・・・」といわれ、社内で開発可能なアプリを生成してみました。
ノーコードツールでアプリ開発を進めながら、どこまで既存の名刺管理ツールに近づけられるのか・・・
巷にあふれる名刺管理アプリの機能を分析
市販されている名刺管理アプリの中には、企業利用を前提とした有料プランを備えたものも多く存在します。代表的なアプリでは、以下のような機能が提供されています：
- 名刺情報のOCR＋手動補正によるデジタル化
- 部門×社員軸での情報登録＆検索
- タグやメモの管理
- CSVエクスポート
今回はこのような一般的な機能の中から、「名刺交換の履歴記録」「社内メンバーとの共有」などを中心に、AppSheetでの再現にチャレンジしてみました。
データ構成とモデリング方針
今回は下記テーブルを用意しました。
■ 名刺交換ログ
名刺交換ごとの情報を記録する中核テーブル。氏名・会社・役職などの基本情報に加え、OCRテキストやタグを保持。タグは1件のみ（Ref）選択可能。
■ 社員一覧
AppSheet利用ユーザー（社員）の情報を保持。ログの担当者紐付け、アクセス制御に利用。
■ 部門マスタ
社員や名刺登録者の所属部門を分類するマスター。
■ タグマスタ
名刺交換ログに1件だけ紐づけられるタグマスター。分類・絞り込みに利用。
スプレッドシートのカラム構成
■ 名刺交換ログ
|
カラム名 |
AppSheetデータタイプ |
|
ID交換ログ |
Text |
|
作成日時 |
DateTime |
|
編集日時 |
DateTime |
|
フラグ |
Text |
|
メモ |
LongText |
|
初期入力者Email |
Email |
|
最終編集者Email |
Email |
|
交換日時 |
DateTime |
|
交換担当者 |
Ref → 社員一覧 |
|
登録部門 |
Ref → 部門マスタ |
|
氏名 |
Text |
|
メールアドレス |
Email |
|
会社名 |
Text |
|
部署 |
Text |
|
役職 |
Text |
|
名刺画像（表） |
Image |
|
名刺画像（裏） |
Image |
|
OCRテキスト_表 |
LongText |
|
OCRテキスト_裏 |
LongText |
|
OCR済 |
Text |
|
コメント・補足 |
LongText |
|
タグ |
Ref → タグマスタ |
■ 社員一覧
|
カラム名 |
AppSheetデータタイプ |
|
社員ID |
Text |
|
作成日時 |
DateTime |
|
編集日時 |
DateTime |
|
フラグ |
Text |
|
メモ |
LongText |
|
初期入力者Email |
Email |
|
最終編集者Email |
Email |
|
氏名 |
Text |
|
メールアドレス |
Email |
|
所属部門 |
Ref → 部門マスタ |
|
役職 |
Text |
|
ユーザー種別 |
Enum |
■ 部門マスタ
|
カラム名 |
AppSheetデータタイプ |
|
ID部門 |
Text |
|
作成日時 |
DateTime |
|
編集日時 |
DateTime |
|
フラグ |
Text |
|
メモ |
LongText |
|
初期入力者Email |
Email |
|
最終編集者Email |
Email |
|
部門名 |
Text |
■ タグマスタ
|
カラム名 |
AppSheetデータタイプ |
|
IDタグ |
Text |
|
作成日時 |
DateTime |
|
編集日時 |
DateTime |
|
フラグ |
Text |
|
メモ |
LongText |
|
初期入力者Email |
Email |
|
最終編集者Email |
Email |
|
タグ名 |
Text |
次回予告
次回は、これらの構成をもとにAppSheetで実際にアプリ画面（UX）を設計していきます。フォーム画面、一覧画面、詳細画面のカスタマイズや、通知機能の実装にも触れていきます。
0 件のコメント:
コメントを投稿