AppSheet を使ってメルマガ配信アプリをノーコードで作ってみた

送信対象メールアドレス登録画面

メルマガ送信先候補を登録する画面です。個人のメールアドレスも、グループメールアドレスも登録できます。

メールマガジンテンプレート登録画面

送りたいメルマガのタイトル、本文、添付画像を追加する画面です。

メルマガ配信画面

作成した送信先メールアドレスと、メルマガのテンプレートを選択し、「Save」を押すと、自動で選択されたメールアドレスにメルマガを送信します。

送信したメルマガの様子

簡単ですが、メルマガ配信を行うことができるアプリの出来上がりです。いかがでしょうか。

AppSheetを使えば、誰でも無料でアプリの開発ができます。作成者以外の人に使ってもらいたい場合、有料プランへの加入は必要となりますが、自分で作って自分で利用する分には完全に無料です。

それでは、引き続きこのアプリを実際に作成するための手順を見てみましょう。

データ設計編

世の中には沢山のアプリが存在しますが、9割以上のアプリの本質は、「特定のデータに対して、特定の操作を行うことで変化させる」という一言に尽きます。

例えば、「Todoリスト」類のアプリは、本質的にはユーザーに「タスク」というデータを操作させるためのアプリで、「SNS」類のアプリは、本質的にユーザーに「チャットデータ」を操作させるためのアプリとなります。

また、操作対象となるデータは、ほとんどの場合、Excel/SpreadSheet表で表すことができます。

例えば、「Todoリスト」の場合、以下の表ですべてのデータを表すことができます：

以上のように、この表の列は、データの1つの属性を表し、行は、1つデータの全体を表します。

言い換えれば、「Todoリスト」に1件タスクを増やすことは、本質的にこの表に1行新しいデータを追加することです。「Todoアプリ」は、本質的には、この表に対する操作を手伝うためのツールです。

故に、新しいアプリを設計する際に、まずこのアプリが扱う予定のデータの設計から着手するのが一般的です。

AppSheetを利用すれば、SpreadSheet（スプレッドシート）を使って簡単にデータの設計を行うことができます。設計する方法は、普段ExcelやSpreadSheetを利用する際の方法と全く同じです。今回は、折角なので、AppSheet専用のデータベース機能「AppSheet Database」を使って、以下3つの表（以後、「テーブル」と呼びます）を作成します：

テーブル：Email address

テーブル：Mail Magazine

テーブル：Send History

以上のように、AppSheet Databaseを使って作成されたテーブルにおいて、各列にこの列に保存されるデータのタイプを指定する必要があります。例として、テキスト、イメージなどがあります。

テーブル：Send Historyの列では、Referenceという特別なデータタイプに指定しました。このタイプは、指定された別のテーブルに登録された行データしか記入できないタイプとなります。

また、手動で指定された列以外に、自動的に追加されたメタ情報を記録する列も自動的に生成されることもありますが、今回はその紹介を省きます。

追加されたテーブルは、AppSheet上で表示されます。

データソースに対してできる設定が多く、特にKeyとLabelの設定が重要ですが、今回はその紹介を割愛します。もし興味ありましたら、以下の資料を参考にしてください。

What is a key? - AppSheet Help

Add row labels - AppSheet Help

UI設計編

データベースを追加した後、テーブル分のView（UI画面）が自動生成されると思いますので、特に設定不要でそのまま使えます。

もしUIに対して、自分で何らかのカスタマイズしたい場合、割と直感的な操作でできます。UIに対する変更は、リアルタイムで右のプレビュー画面で確認できます。

メール自動送信編

実際にメールを送信するため、今回は「Automation」という機能を使います。

「Automation」は、何らかのこと（イベント）が発生した際に、そのイベントの情報を使って、何らかの処理（Process）を自動的に行う機能です。

今回は、「Send History」テーブルに、新しいデータが入った際に、自動的にメールを送信する設定（Bot）を入れます。

Eventの設定は以下となります：

Processの設定は以下となります：

Processの送信先の設定は、

[送信先].[メールアドレス]

とします。意味として、「Send History」テーブルの「送信先」列に入れた、「Email address」テーブルの一行のデータ（レコード）の、「メールアドレス」の値を抽出するという意味です。

この書き方は、「Dereference expression」といい、もしより詳しく知りたい場合、公式ドキュメントを参照してください。

今回は、Email Typeのところ、「Custom Template」を選んだため、メールタイトルと、メール本文のところに、特別なテンプレート形式で記入します。例えば、タイトルでは、メール送信の度に、自動的に選択された「送信内容」のレコードの「メールタイトル」の内容を反映します。

テンプレートの書き方については、公式ドキュメントを参照してください。

最後に、「Attachment settings」→「Other Attachments」のところに、画像を添付ファイルの形でメールに追加する設定を入れます。

こちらも「Dereference expression」形式の設定で、

[送信内容].[挿絵]

を入れます。

まとめ

以上で概ねメルマガ配信アプリの作成が完了となります。挙動は、本文の最初に紹介されたように、実際にメルマガを配信できるようになります。

より細かいカスタマイズもできます。例えばアプリのアイコン、色、各ボタンの機能などを自由に変更できます。確認設定項目から、自分好みでカスタマイズしてみてください。

関連サービス