Xamarin.Forms と Azure Mobile Engagement によって、新機軸を打ち出したモバイル向けイベント アプリを開発クロス プラットフォーム開発を効率化でき、プッシュ型情報配信の組み込みも容易に

「経営革新推進のための情報システム化パートナー」として、数多くの情報システム構築を行い、近年ではモバイル活用の支援も積極的に推進している株式会社ジェーエムエーシステムズ。ここではモバイル アプリのクロス プラットフォーム開発を効率化するため、Xamarin の活用が進められています。その一環として行われたのが、2016 年 9 月に開催された「Microsoft Foresight」のイベント アプリの開発です。開発環境として Xamarin.Forms を選択し、9 割近くのソース コードをプラットフォーム間で共通化。Microsoft Azure Mobile Engagement によるプッシュ型の情報配信も組み込んでいます。さらにこのイベント アプリを拡張する形で、「Microsoft Tech Summit」向けのアプリも開発。パイロット開発と実際のビジネス現場での検証を繰り返し、成長するビジネス領域に合うよう機能強化を進めていくというアプローチによって、高品質で使いやすいモバイル

アプリを実現しています。

導入の背景とねらい「Microsoft Foresight」向けのイベント アプリを Xamarin.Forms で開発

モバイル デバイス向けアプリケーション (モバイル アプリ ) の市場が、ここ数年急速な勢いで成長を続けています。総務省が公表した「情報通信白書 平成 28 年版」によれば、2013 年に 266 億回だった世界のモバイル アプリ ダウンロード数は、2015 年には 410 億回にまで増大しており、この増加傾向は今後も続くと予測されています (※1) 。ここで重要な課題となるのが、クロス プラットフォームへの対応です。モバイル デバイスのプラットフォーム (OS) には、Windows Phone®、iOS、Android と複数のものが存在しており、より多くのユーザーに使ってもらうには、これらすべてに対応することが求められるからです。

この課題に対応するため Xamarin.Forms を活用しているのが、株式会社ジェーエムエーシステムズ (以下、JMAS) です。

同社は日本能率協会として活動していた時代を含め 40 年以上にわたり、数多くの情報システム構築を行ってきた IT 企業。ミドルウェア開発やミッション クリティカル システムの提供を通じ、高い技術力を蓄積しています。現在提供しているサービスは、大規模システム開発、インフラ構築サービス、ERP、超高速開発と多岐にわたり、Microsoft Azure などを活用したクラウド ソリューションや、モバイル向けシステム開発にも積極的に取り組んでいます。

「モバイル アプリのクロス プラットフォーム対応は、コンシューマー向けアプリでは既にあたり前になっていますが、これからは企業ユースでも必須条件になっていくと考えています」と語るのは、JMAS 事業企画部 プロダクト企画グループ 統括マネジャーの傳寳 幸宏 氏。企業で使われるモバイル デバイスは、以前は統一されたものを会社側から貸与するケースが一般的でしたが、最近では複数の選択肢を用意する企業や、従業員の所有デバイスを業務に使う BYOD を採用する企業

ソリューション概要

○プロファイル株式会社ジェーエムエーシステムズは、1971 年 11 月に社団法人日本能率協会から分離独立する形で設立された IT 企業です。日本能率協会として活動していた時代を含め、40 年以上にわたり数多くの情報システムを構築しており、ミドルウェア開発やミッション クリティカル システムの提供を通じ、高い技術力を蓄積しています。現在提供しているサービスは、大規模システム開発、インフラ構築サービス、ERP、超高速開発と多岐にわたり、Microsoft ® Azure® などを活用したクラウド ソリューションや、モバイル向けシステム開発にも積極的に取り組んでいます。

○導入製品とサービス・ Xamarin.Forms・ Microsoft® Azure® Mobile Engagement

○導入メリット・ 開発環境として Xamarin.Forms を採用することで、クロス プラットフォームでのソース コード共通化が容易になり、短期間での開発が可能になった。

・ Azure Mobile Engagement を活用することで、プッシュ型の情報配信機能をモバイル アプリに組み込みやすくなり、クラッシュ レポートの取得も可能になった。

○ユーザー コメント「Xamarin と Azure Mobile Engagement を組み合わせることで、高品質で使いやすいモバイル アプリを短期間で開発できます。これらを積極的に活用し、お客様のモバイル活用をさらに強力に支援していきます」

株式会社ジェーエムエーシステムズ事業企画部プロダクト企画グループ 統括マネジャー傳寳 幸宏 氏

株式会社ジェーエムエーシステムズ

株式会社ジェーエムエーシステムズ

※1： http://www.soumu.go.jp/johotsusintokei/whitepaper/ja/h28/html/nc122230.html

株式会社ジェーエムエーシステムズ

も増えていると指摘します。「このような流れが加速すれば、Android

スマートフォンと Microsoft® Surface® を組み合わせて活用する、といったケースも増えてくるはずです。また旧世代のモバイル デバイスを使っている企業の場合には、デバイス移行の自由度を高めるためにクロス

プラットフォーム対応が求められる、といったことも考えられます」。

JMAS は 2010 年頃から、企業におけるモバイル アプリ導入を支援しており、この 6 年間で約 80 社、500 以上のモバイル アプリ開発を行ってきました。Windows® タブレットや Windows Phone 向けの開発も

2012　年から手掛けており、ユニバーサル Windows プラットフォーム (UWP) に対応した開発技術も蓄積しています。「しかし JMAS では、PhoneGap/Cordva によるクロスプラットフォーム開発の実績は多数

あったものの、Xamarin に関しては、2014 年に社内ハッカソンで試した程度でした」と傳寳 氏。この状況を大きく変えるきっかけになったのは、2016 年 6 月にマイクロソフトから受けた、ある依頼だったと言います。

「マイクロソフトは今年 9 月に Microsoft Foresight というビジネス リーダー向けのカンファレンスを開催しましたが、ここで使うイベント アプリを Xamarin で開発してもらえないか、というお話をいただきました。当社はモバイル アプリだけではなく、バックエンド システムまでカバーした開発を行うことができ、クラウドとの連携も可能です。マイクロソフトの依頼内容は、このような当社の強みを活かせるものであり、前提となった Xamarin の活用も、今後のさらなるクロス プラットフォーム開発への足がかりになると考えました」。

また JMAS では、短期間でパイロット開発を行い、それを実際にビジネスで使うことで効果を検証、改善を繰り返しながらアプリ機能を拡大、強化させるケースが多いのだとも説明。このアプローチはイベント アプリの開発でも、有効に機能すると判断したとも述べています。

開発したシステムQR コードによる受付やアンケート自動配信を実現 プッシュ型の情報配信には Azure Mobile Engagement を活用

今回開発されたアプリの概要を図 1 に示します。

株式会社ジェーエムエーシステムズ事業企画部プロダクト企画グループ 統括マネジャー傳寳 幸宏 氏

株式会社ジェーエムエーシステムズ事業企画部プロダクト企画グループプロダクトスペシャリスト川合 俊介 氏

図 1 : JMAS が「Microsoft Foresight」向けに Xamarin.Forms で開発した、イベント アプリの主要な画面。QR コードによる受付処理や、自分が参加するセッションのスケジュール編集、参加セッションのアンケート自動配布など、複数の新機軸が盛り込まれています。

ログイン画面 マイページ メニュー スケジュール確認 セッション詳細

スケジュール編集アンケートフォームアンケート一覧

カンファレンス情報セッション情報FAQ他

株式会社ジェーエムエーシステムズ

まず Microsoft Foresight への参加登録を行ったユーザーは、登録時に設定したアカウントでアプリにログインします。ログインが成功するとマイ ページが表示されます。マイ ページには QR コードが表示されており、これをイベント会場で示してスキャンしてもらうだけで、受付手続きが完了します。またこの QR コードはセッション会場の入り口でもスキャンされ、自分がどのセッションに参加したのかを後で確認することが可能です。

画面左上のアイコンをタップすると、メニューが表示されます。このメニューには、「Overview」「Sponsor」といったイベント情報、「Keynote」「Session」などのセッション情報、FAQ の項目が並んでいます。これらのメニューを選択することで、必要な情報にアクセスできます。

このアプリで特に注目したいのが、ユーザー自身がセッション参加のスケジュールを設定できることです。セッションの詳細情報も、スケジュール確認やスケジュール編集の画面からアクセスできます。

セッションに参加したユーザーには、そのセッションに対するアンケートが自動的に配信されます。アンケート フォームは短い時間で簡単に入力できるようになっており、その内容は各セッションの登壇者が自分で設定できます。セッション終了時には、アンケート回答を促す通知も自動送信されます。

アプリを実現するためのシステム構成は図 2 に示すとおりです。まずセッション内容やアンケート フォームの入力、参加登録などは Azure 上の Web サイトから行うようになっており、ここで入力された情報が DB

に保存されます。フロント エンドとなるイベント アプリは、API を介してこの DB に接続し、必要な情報を取得します。バックエンド DB はセッション受付の QR コード読取機とも連携しています。セッション通知や

アンケート配布といったプッシュ通信には、Azure Mobile Engagement

が活用されています。

JMAS はマイクロソフトからの提案を受け、すぐにこのアプリの開発に着手。モバイル アプリの開発環境としては、アプリのロジックだけではなく OS ごとの画面デザインや操作に関わるソース コードもクロス プラットフォームで共通化できる Xamarin.Forms を選択します。

「Xamarin のコミュニティには 2013 年から参加しており、デモ アプリはいくつか開発していたのですが、業務案件として Xamarin を使うのは初めての経験でした」と振り返るのは、このアプリの開発チームを率いた、JMAS 事業企画部 プロダクト企画グループ プロダクトスペシャリストの川合 俊介 氏。最初の段階では Xamarin.Forms に関する調査も並行して進めていったため、開発期間が長くなってしまったと語ります。それでも 3 か月後の 2016 年 9 月には最終版のアプリが完成。開発に関わった人員はわずか 2.5 人でした。「Xamarin.Forms による開発方法は既にマスターしたので、次の開発はもっと短期間で行えるはずです。同じような規模の案件なら、1 か月強で開発できると思います」。

活用効果ソース コードの 8 ～ 9 割を共通化し開発を効率化 プッシュ型配信のアプリ組み込みも容易に

Xamarin.Forms によるクラス プラットフォーム開発の最大のメリットは、複数のプラットフォームでソース コードの共通化が図れる点にあります。ロジックのみを対象にした Xamarin で共通化できるソース コードは 4 ～ 7 割程度だと言われていますが、「今回のアプリでは、Xamarin.

Forms で8 ～ 9 割のソース コードを共通化できました」と川合 氏は語ります。「プラットフォームによっては表示の位置調整が必要なケースも

図 2 : J「Microsoft Foresight」向けイベント アプリのシステム構成。モバイル アプリは API を介して、バックエンド DB から必要な情報を取得します。またプッシュ型配信には Azure Mobile Engagement が活用されています。

Web 開発 アプリ開発

参加登録

登録情報更新

…

DBAPI

Azure Mobile Engagement (Push 通知)

イベント アプリ

セッション受付 QR コード読み取りアプリ

Web サイト

WindowsiOS Android

株式会社ジェーエムエーシステムズ

導入についてのお問い合わせ本ケース スタディは、インターネット上でも参照できます。http://www.microsoft.com/ja-jp/casestudies/本ケース スタディに記載された情報は制作当時 (2016 年 10 月 ) のものであり、閲覧される時点では、変更されている可能性があることをご了承ください。本ケース スタディは情報提供のみを目的としています。Microsoft は、明示的または暗示的を問わず、本書にいかなる保証も与えるものではありません。製品に関するお問い合わせは次のインフォメーションをご利用ください。■インターネット ホームページ http://www.microsoft.com/ja-jp/■マイクロソフト カスタマー インフォメーションセンター 0120-41-6755(9:00 ～ 17:30 土日祝日、弊社指定休業日を除く )※電話番号のおかけ間違いにご注意ください。＊Microsoft、Azure、Surface、Windows Phone、および Windows は、米国 Microsoft Corporation の、米国およびその他の国における登録商標または商標です。＊その他記載されている、会社名、製品名、ロゴ等は、各社の登録商標または商標です。＊製品の仕様は、予告なく変更することがあります。予めご了承ください。

〒108-0075 東京都港区港南 2-16-3 品川グランドセントラルタワー

ありますが、これは XAML の記述で対応できます。また Android ではバージョンによって標準コントロールの見た目が異なることがありますが、これはカスタム レンダラーを活用することで回避できます」。

共通化できるソース コードの割合が大きければ、仕様変更の際にも迅速に対応できます。またプロトタイプを作成し、要件を探りながら改善を繰り返していくといったアプローチも採りやすくなります。今回の案件も、要検定義を行うことなく開発が始まりました。開発途中でリクエストが出たために、追加された機能も少なくありません。

その結果、アンケートの自動配信や QR コードによる受付といった、新しい取り組みの実現も可能になりました。「アンケートの自動配信はイベント主催者と参加者の双方にとって、手間のかからない方法だと評価されています」と言うのは傳寳 氏です。「QR コードを使った受付も今回初めて導入しましたが、イベント会場でよく見られる人の行列がなくなり、非常にスムーズな入場を実現できました」。

またネイティブ アプリと同等のパフォーマンスを発揮することも、Xamarin で開発されたアプリの特長の 1 つです。「実は以前、Monaca

の勉強会で、Monaca で開発した Cordova アプリ (HTML5 で作成したソース コードを WebView 上で実行 ) と Xamarin アプリの比較を行ったことがあるのですが、Xamarin で開発したアプリの方がサクサク動きます」。

今回の案件では、Azure Mobile Engagement の採用も、大きな効果をもたらしています。これによってプッシュ型の情報配信を、アプリに簡単に組み込めるようになったからです。

「開発時点ではまだ日本での実績がなかったため、Azure Mobile

Engagement の採用には不安を感じていました」と川合 氏。しかしマイクロソフトの支援を受けながら実際に使ってみた結果、非常にわかりやすいしくみであることが実感できたと言います。「開発環境に必要なライブラリを入れて、アプリのソース コードから呼び出すだけで利用できます。またプッシュ配信する情報を他のシステムから受け取るための

API も用意されているので、他システム連携のソース コードを自分で書く必要もありません」。

ユーザーの利用状況を確認でき、アプリがクラッシュした時のクラッシュ

レポートを自動的に取得する機能を装備していることも、大きな魅力だ

と指摘します。「アプリがクラッシュした時にユーザーにログを送ってもらうのは困難ですが、クラッシュ レポートが自動的に取得できれば、アプリ保守の負担を軽減できます。これだけリッチな機能があるのに、あまり知られていないのはもったいない。他の開発者にもぜひ活用をお薦めしたいと思います」。

今後の展望「Microsoft Tech Summit」向けに機能をさらに強化 今後は他の案件でも同様の取り組みを推進

Xamarin.Forms と Azure Mobile Engagement を組み合わせた次の開発も、既に始まっています。2016 年 11 月に開催される「Microsoft

Tech Summit」で使用するため、イベント アプリの機能強化が進められているのです。

その 1 つがログイン機能の高度化です。Microsoft Foresight では参加登録を行う Web サイトでアカウント管理も行っていましたが、Microsoft Tech Summit ではこれを分離し、Microsoft Authentication

Library (MSAL) を利用した Microsoft アカウントとの連携を実現します。また会場周辺情報が掲載された Web ページへのリンクや、SNS への投稿機能も組み込まれる予定です。

その一方で、このイベント アプリを汎用化し、JMAS の製品ラインアップに組み込んでいくことも検討されています。JMAS は既に、ビーコンを活用した屋内の位置情報システムや、その情報をマップと連携させるアプリなどを提供しています。イベント アプリをこれらと組み合わせれば、営業担当者がイベント会場で顧客のいる場所を見つけやすくなり、商談のチャンスを増やせるはずです。また参加者がどこに集中しているのかをヒートマップで表示できれば、より適切な動線計画を立案することも可能になります。

「今後は、Xamarin をより有効活用したアプリ開発を行い、お客様のビジネスに貢献したいと考えています」と傳寳 氏。またモバイル アプリの利便性を高めるにはプッシュ型の情報配信も必須となるため、Azure

Mobile Engagement も積極的に採用していきたいと語ります。「これらを組み合わせて活用することで、高品質で使いやすいモバイル アプリを短期間で開発できるようになります。パイロット開発と実ビジネスでの検証を繰り返し、機能強化を続けていくというアプローチによって、これからもお客様のモバイル活用を強力に支援していきます」。

6061-SE1