皆さんは、AppSheetというノーコードツールをご存じでしょうか。
AppSheetはもともと、同名の企業によって開発された後、Googleに買収され、現在はGoogleのサービスラインの一つに位置付けられて開発が進んでいるノーコードツールです。
AppSheetは海外では非常に注目を集めており、『AppSheet、コロナウイルス対策のノーコードアプリのサンプル8種を公開』の記事にもあるように、ユースケースがすでに多数存在しています。
本記事においては、Yahoo!知恵袋やQuoraのようなQ&Aデモアプリを作りながら、AppSheetの魅力と使い方を解説していきたいと思います。
AppSheetの概要
まずAppsheetとは何なのか、使用することでどのようなことができるのかを確認していきましょう。
表計算データベース
Appsheetは、アメリカ発のアプリケーション開発用ノーコードツールです。最大の特徴は、表計算ソフトをインポートしてデータベースとして扱うことができることにあります。
データベースの設計は、システム開発でもっとも重要とされる設計の一つとされていますが、初学者にとっては学習のコストが高く、プログラミング学習の障壁になってしまいます。
しかし、Appsheetを利用する場合、Microsoft ExcelやGoogle スプレッドシートの扱い方さえ分かっていれば、RDBなどの通常システム開発に使用されるデータベースに関する知識がなくてもアプリを開発することが可能になります。
Appsheetと同じように、データベースを表計算型で管理できるノーコードツールには、Glideがありますが、GlideはGoogleスプレッドシートを中心に扱っているのに対して、AppsheetではExcelを使用することができるため、Excelで業務のデータを管理することが多い日本の企業にとっては使いやすいと感じることが多いかもしれません。
一方でGlideにしかない特色もあります。Glideについて、より知りたい方は、『【ノーコード初心者におすすめ】Glideの使い方「無料でECサイトサービスを作ってみよう」』の記事をご覧ください。
豊富な業務用テンプレート
またノーコードツールとしての魅力はそれだけではありません。
他のツールに比べて企業が業務用に利用する場面を想定したテンプレートが非常に豊富です。有志によって有料・無料で公開されたものが多く、生産性向上・タスク管理といったノーコードツールとしてオーソドックスなテンプレートのほか、CRM/流通管理などの用途にも活用できます。
一覧化され理解しやすいコンポーネント
他のノーコードツールでは、各画面のコンポーネントを自分で細かく作りこむ場合、欲しいコンポーネントについては自分で詳細にメニューから選択する必要があります。そのため、初めてノーコードツールを使用した時には、メニューにずらりと並んだコンポーネントを見て、どれを使えばわからなくなってしまう、という場面もあるでしょう。
一方で、Appsheetでは作成された画面にコンポーネントが一覧として表示されており、操作性が高く、説明を読まなくても直感的に作りこむことができます。
iOS,Google Playでも公開されており、スマホからノーコード開発を行えるのも魅力です。
作成においては、一から画面の遷移やレイアウトをカスタマイズすることもできますが、先述したような、開発頻度の高い複数のユースケースに即したテンプレートを活用することで、アプリ開発をしたことのないユーザーでも配色、レイアウトなどを自動で最適化したアプリを数クリックで作成することができます。
様々な魅力・特色があるAppsheetの威力をより実感すべく、本記事ではYahoo!知恵袋やQuoraのようなQ&Aサービス作成を作成していきましょう。
Appsheetを使うための事前準備
まずは会員登録などの準備を行いましょう。
まずはAppsheetの公式サイトに移動し、右上のStart for free/無料で開始をクリックします。
Googleアカウントへのアクセス権限を要求されるので、許可を押し続行します。
これでホーム画面が表示されるようになりました!
アカウントのホーム画面では、自分のGoogleスプレッドシートやエクセルなどの表からアプリを生成する「Quick Start」と、これまで自分が作ったアプリを閲覧できる「Prototype Apps」を操作できます。
Appsheetで開発するQ&Aアプリと各種機能
さっそくワンクリックでQ&Aアプリを作っていきましょう。
アカウントのホーム画面のプラスマーク「Make a new app」をクリックします。
どのように新しいアプリを作り始めるか聞かれます。
- 既に実現したいアイデアがあり、エクセルやスプレッドシートなどで準備もできている、という方は左の「Start with your own data」をクリックします。
- アイデアはあるが、まだデータや具体的なイメージは沸いていない、という方は、真ん中の「Start with an idea」をクリックします。
- 用途に応じてAppsheet側で作成されたサンプルアプリを見ながら、アイデアに応じて手を加えたい、という場合は右の「Start with a sample app」をクリックします。
今回はAppsheetがデフォルトで準備しているテンプレートの豊富さを実感する意味で、右の「Start with a sample app」から始めましょう。
アプリの名前、カテゴリ、アプリの保存先を選択します。
保存先には連携したGoogleアカウントやOnedriveなどのクラウドを選択可能です。
カテゴリは下記のように多種多様で、1つのカテゴリにつきいくつかのSample appが用意されています(1つもない準備中のカテゴリもあります)。
今回はEducation & TrainingのFAQ Directoryを選択しましょう。
これでQ&Aサービスのひな形となるアプリの作成は完了です!
アプリの開発用ホーム画面が表示されるようになりました。
開発用画面の見方
この開発用ホーム画面を通して、アプリのUIUXや機能の追加実装を行っていきます。
主要な機能を見ていきましょう。
1.AppsheetのUX
アプリのデザインや各機能の配置について設定できます。
サイドバーから①UXをクリックし、UXメニューを開きます。
主に使用するのは、②にある「Views」「Brand」「Format Rules」です。
- Viewsでは、各画面毎の機能の配置や名称に関して管理することができます。
- Brandでは、アプリ全体の配色やアイコン等を設定できます。
- Format Rulesでは、関数等を利用して作成したルール=条件に一致する行やデータに対して、指定したフォーマット(アイコン・色など)を適用してくれます。
2.データベース
サイドバーから①Dataをクリックすると、データベースの管理ができます。
主に使用するのは、②にある「Tables」と「Columns」です。
- Tablesでは、テーブルの追加、削除が可能です。テーブル内の各カラムの編集は下記Columnsで行います。
- Columnsでは、各テーブル内のカラムを編集することができます。
通常システムを開発する際には、各カラムに入力するものを「型」として指定する必要があります。
例えば下記でいうと、「Link」という外部リンクを貼るためのカラムには、URLという型しか入力できず、テキストや数字列を入れるとエラーが発生するようになっています。
この型指定がデータベース設計で障壁となることが多いですが、Appsheetではある程度決まったカラムと型を自動で指定してくれますし、型もプルダウンで選択できますので、「このカラムにはこういう情報を入力したいが、型として存在するだろうか」という思った際にすぐ調べられ、初学者にも便利です。
Appsheet開発におけるプレビュー
では実際にどうアプリが動くのか、プレビュー画面を見てみましょう。
Appsheetでは、画面の右側につねにプレビューが表示されており、自分が操作した部分の変更がリアルタイムで反映され、見ることができます。
加えて、指定のメールアドレスに送信することで、「PC端末で開発したAppsheetのアプリが実際のモバイル端末でどう動くか」を確認することができます。
「Apply」を押すことで下記赤枠に記載のメールアドレスに送信されます。
他にもタブレット端末やPCからのプレビューモードも存在します。
アプリプレビューの上のタブレットアイコン、矢印をクリックすることで、Appsheetを各端末から確認することができます。
今回はタブレットモードで閲覧してみましょう。
ホーム画面です。
アプリのユーザーが投稿した様々な質問が、パネル型で表示されています。
質問の概要のほか、Yahoo!知恵袋のように、回答への投票数を見る「Votes」および回答数「Answers」が各パネルに表示されています。
+ボタンから、質問を追加してみましょう。
画面下部のNew Questionから追加することも可能です。
ここでは質問の例として、「なぜノーコードは重要なのか」、リンクにノーコードジャパンのニュースサイトを貼り付けます。
赤枠のSaveをクリックすれば質問が投稿されます。
タイトルに戻ると、パネルの一覧に先ほど作成した質問が投稿されているのがわかります。
パネルをクリックすると質問の詳細画面が表示されます。
右上の三点リーダからプルダウンの「New Answer」を選択し、回答してみましょう。
回答を入力し、リンクや画像を挿入して、Saveを押下しましょう。
回答が質問の下に表示されるようになりました!
おわりに
いかがでしたでしょうか。Appsheetを利用することで、ワンクリックで業務を効率化するツールが作成できることがお分かりいただけたと思います。Googleに買収されたことでノーコード業界に大きなインパクトを与えたAppsheetは、今後も要注目のツールと言えるでしょう。
ノーコードジャパンでは、ノーコード開発者たちが気軽に質問し合える無料のプラットフォームNoCode Forumを運営しております。ノーコード開発で分からないことがあったら一人で悩まず、気軽に質問してみましょう。
ノーコードジャパンでは、ノーコードに関する最新のニュースの他、ノーコード開発やノーコードツールの使い方に関するコラムを配信していきます。