Microsoft Teamsのカスタムアプリを作成する手順

 2021.06.28  Microsoft 365チャネル編集部

Microsoft teamsでは、カスタムアプリを作成して自社向けにカスタマイズすることが可能です。しかし、作成の手順が複雑すぎて、何をすればよいかわからない方も多いでしょう。そこで本記事では、初心者でもなるべく簡単にアプリを作成できる方法についてご紹介していきます。

Microsoft Teamsのカスタムアプリを作成する手順

Microsoft Teamsのカスタムアプリとは

Microsoft Teamsは1つのアプリとして動作していますが、中身は複数のアプリの集合体となっています。たとえば、ユーザーのタスクに役立つ情報を提供するスペースや、Webベースのコンテンツを表示するタブなど、別々のアプリを読み込むことで1つのソフトウェアとして成り立っているのです。実は、こうした仕組みを利用し、自社開発したアプリを組み込み、Teamsの機能を自由に拡張することが可能です。これを「カスタムアプリ」といいます。

カスタムアプリは、ストアのカタログに送信せずともチーム内で共有できるメリットがあります。もちろん、プリインストールされているアプリだけでも使用できますが、それではいざというときに痒いところに手が届きません。さまざまな業種で利用するには、不便に感じる部分も少なからずあるため、自社向けに拵えたカスタムアプリを組み込み、社内システムとの連携や業務効率化を図ることが望ましいでしょう。

カスタムアプリの各ポリシーと設定

2019年7月の更新に伴い、Teamsでは新たにカスタムアプリのセットアップポリシーが追加されました。これにより、ユーザー・チーム・組織全体におけるカスタムアプリのアップロード権限の制御が可能になりました。以下では、それぞれの詳細と設定方法について解説します。

ユーザーカスタムアプリポリシー

この設定では、管理者がユーザーによるカスタムアプリの追加権限を制御します。この設定が有効の場合、ユーザーは「カスタムアプリの追加を許可しているチーム」「自身が所有するチーム」「個人用コンテキスト」へのカスタムアプリの追加、および組織全体のカスタムアプリ設定に準じたカスタムアプリの操作が可能です。無効の場合、追加は許可されませんが、操作権限は有効の場合と同様です。

【設定方法】

  • Teamsの管理センターにアクセスし、画面左側のウィンドウを開いて[Teamsのアプリ] → [セットアップポリシー]の順に選択
  • [+追加]をクリック
  • [カスタムアプリのアップロード]をオン/オフにし、[保存]して完了

チームのカスタムアプリ設定

この設定では、管理者およびチーム所有者が、チームへのカスタムアプリの追加権限を制御します。また、ユーザーのカスタムアプリポリシーに準じて、特定チームにカスタムアプリを追加できるメンバーの設定も行えます。

この設定が有効の場合、チーム所有者およびチームメンバーは、ユーザーのカスタムアプリポリシーで許可されていればカスタムアプリの追加が可能です。無効の場合、チーム所有者の権限は変わりませんが、チームメンバーによるカスタムアプリの追加は不可能になります

【設定方法】

  1. [チーム]から設定を変更したいチームに移動し、[その他のオプション]をクリック
  2. [チームの管理]→[メンバー設定]順に選択し、[メンバーのアクセス許可]を開く
  3. [カスタムアプリのアップロードをメンバーに許可する]をオン/オフにして完了

組織全体のカスタムアプリ設定

この設定では、組織内における全ユーザーのカスタムアプリの追加権限と操作権限を制御します。上記2つのマスタースイッチとして機能するため、これが有効でない限りはユーザー・チームのポリシー設定も有効になりません。

【設定方法】

  1. Teamsの管理センターにアクセスし、画面左側のウィンドウを開いて[Teamsのアプリ] →[アプリを管理]の順に選択
  2. [組織全体のアプリ設定]→[カスタムアプリ]の順に選択
  3. [カスタムアプリとの対話を許可する]をオン/オフにして完了

カスタムアプリの作成方法

カスタムアプリ作成の基本は、通常のアプリ開発と同様に、プログラミング言語による構築です。使用する言語は、主に「C#」と「JavaScript」です。このどちらかが扱えればよいのですが、こうした知識がない方もいることでしょう。

そこで以下では、通常の言語による開発のほかに、テンプレートや簡単な関数でアプリを作成できる方法についてご紹介します。専門知識のない方でもカスタマイズが可能なので、ぜひ参考にしてください。

開発環境の構築とアプリケーションパッケージについて

アプリ制作の前に必ず行うのが、開発環境の構築です。特にコーディングを行う場合は必須なので、忘れずに実施しましょう。Teamsで実行するのはWebアプリケーションなので、それに関連したツールをインストールします。

ここでは、ソフトウェア開発キットSDKを活用するために「C#.NET」や「JavaScript/Node.js」、またコーディングのため「Visual Studio Code」のインストールをおすすめします。さらにボットの開発には、「Azure Bot Service」が必要です。これらのツールをインストールしたら、次の工程に進みましょう。

App Studioを使用

Teams上にアプリケーションを結合するには、3つのファイルをZIPにしたパッケージファイルが必要です。3つのファイルは、2つのアイコンファイル(png)とマニフェストファイル(json)で構成されています。このマニフェストファイルのスキーマはTeamsに準拠していなければならず、間違えていた場合はエラーが発生します。サンプルはMicrosoft上で公開されていますが、jsonファイルの取り扱いはなかなか難しいものです。

そこで、パッケージファイルを作成してくれるツール「App Studio」を活用します。このアプリは、MicrosoftによるTeamsアプリ開発用のツールです。デバッグやパッケージファイルの出力・結合を簡単に行えるようになります。さらに、カード作成のためのエディターも付属しています。

インストールするにはTeamsストアで「App Studio」と検索して、アプリのインストールページを開いてください。[インストール]をクリックしたら完了です。App StudioはTeamsの[…]タブからいつでも開けます。

内部の主要な機能は、「Conversation」「Manifest editor」「Card editor」「Control library」の4つのタブで構成されていて、それぞれ以下のようなことが可能です。

  • Conversation:カードエディターで作成したカードが、実際にどのように表示されるのかを自分自身に送信することでテストします。
  • Manifest editor:App Studioの中核となる機能である、マニフェストファイルの作成を行います。タブやボットなど、作成したアプリのデバッグや出力・結合ができます。
  • Card editor:カードを作成するタブです。ここでは「json」「C#」「node」の3つのエディターが利用できます。
  • Control library:ドロップダウンやチェックボックスなどの各種コントロールのライブラリーと変更が可能です。

ジェネレーターを使用する

アプリの作成をより簡便化するために、スキャフォールディングジェネレーターが使用できる「Yeoman」をインストールします。前述した開発環境の構築を行ったあとに、ターミナル上で以下のコマンドを入力してください。

  • npm install -g yo
  • npm install -g generator-teams

コマンド入力後にTeamsのジェネレーターを走らせることで、ひな形が使用可能となります。ここからVisual Studio Codeを利用して、アプリを開発しましょう。

アプリ開発が終わったら、ローカル環境でアプリを実行する必要があります。Teamsで動作させるためには、外部から自身のローカルサーバーにアクセスしなければいけません。そこで、トンネリングソフトウェアの「ngrok」などを活用しましょう。このソフトウェアを利用することで、ローカルサーバーにパブリックURLを割り当てて、Teams上からアプリにアクセスできます。

アプリテンプレート・PowerAppsを使用

Teamsのカスタムアプリは、Microsoftのホームページにてサンプルが公開されています。これらを活用すれば、コードを記述することなくTeamsをカスタマイズできます。さらにコーダーであれば、サンプルのソースの一部を書き換えてフレキシブルなカスタマイズが可能です。時間を短縮するためにも積極的に利用しましょう。

なお、カスタムアプリの導入にはMicrosoft Azureが必要です。下記いずれかのプランを契約している必要があるので、事前に確認しておいてください。

  • Azure Logic App
  • App service
  • App service plan
  • Bot channels registration
  • Azure Cosmos DB account
  • Application Insights

これらいずれかを契約していることが確認できたら、デプロイに移ります。デプロイの方法には、「手動で行う方法」と「パワーシェルやターミナルを利用する方法」があります。それぞれの導入方法に関しては、長くなりますのでGitHubの導入ガイド

また、上記以外にも「PowerApps」というツールを使用して、Teamsアプリを作成する方法もあります。PowerAppsとは、Dynamics 365やoffice 365の特定のプランに含まれている、ビジネスアプリケーション作成ソフトウェアです。このアプリを使用すれば、プログラミング言語を使用することなく、簡単な操作と関数の入力だけでアプリ作成ができます。

カスタムアプリの作成例

ここでは、実際に作成できるカスタムアプリの例をテンプレートからご紹介します。

Visitor Management

名前の通り、Teams上で訪問者を管理するためのアプリです。訪問者の情報(名前・連絡先・所属・到着時間・訪問目的)を作成して、管理チームに通知できます。管理チームは、送信された情報をもとにアクションが可能です。さらに、これらの情報はまとめて観覧できるうえ、実際に訪問者が来たときには再通知も行えます。Teams上で外部の人間の情報をまとめて管理したい場合に、有効なアプリといえます。

Time Tally

「Time Tally(タイムタリー)」は、簡単なタイムシートの作成ができるようになるアプリです。1つのフレーム内で「プロジェクトの名前」「クライアントネーム」「月の作業時間」「作業外時間」「プロジェクトのスタート・エンドの日付」を作成します。

さらに複数のタスクを作成して、従業員をそれぞれのタスクに割り当てて管理することも可能です。エンドユーザーがタイムシートを記入したら、マネージャーに承認を促して作業完了となります。このアプリにより、チームの進捗管理やタスクの透明性が担保できるでしょう。

New Employee Onboarding

このアプリでは、新入社員向けにオンボーディングでタスクを実行させることが可能です。新入社員がTeamsにアクセスすると、人事担当が作成したウェルカムカードが送信されます。さらに、担当者が独自で作成した自己紹介のための質問文を送信し、各々の人物象の把握に役立てられます。

紹介文はチームメンバーにフィードバックでき、またチームにすぐ加入させることも可能です。一方の新入社員は、毎週自身のタスクを確認できます。こうした機能により、新入社員に特殊な体験をさせて、チームの業務にスムーズに馴染めるよう促せるのです。

まとめ

Teamsのカスタマイズアプリは、「App Studio」「Yeoman」「PowerApps」などを活用すれば簡単に作成できます。さらにテンプレートも用意されているため、コーディング不要ですぐにでもアプリを導入できます。これまでアプリ作成の方法に悩まれていた方は、ぜひチャレンジしてみてはいかがでしょうか。

CTA

RECENT POST「業務効率化」の最新記事


業務効率化

Windows 10を便利に使うカスタマイズについて

業務効率化

SharePoint Onlineのカスタマイズ方法

業務効率化

SharePointカスタムリストを試してみる

業務効率化

ノンコーディングでアプリ開発!PowerAppsとは?

FAVORITE POST「Microsoft製品」の人気記事


Microsoft Teamsのカスタムアプリを作成する手順

サイト掲載へのお問い合わせ