非エンジニアも多数参加、PowerAppsでAIカメラアプリや安否確認アプリ
制限時間はだいたい2時間、ノンコーディングでアプリ開発するハッカソン
2018年08月23日 14時00分更新
全くコードを書くことなくアプリケーションを開発できる「Microsoft PowerApps」を使ってアプリをスピード開発し、そのアイデアと出来栄えを競うハッカソンが、2018年8月22日に開催されました。
このハッカソンでは、2時間50分の制限時間内に、日々の仕事の課題を解決する業務アプリのアイデアをチームで考え、PowerAppsでアイデアをチーム開発します。エンジニアだけでなく非エンジニアも多数参加し、1チーム4～5人に分かれて計5チームでハッカソンに挑みました。
ハッカソンの様子
外部サービス連携が得意なPowerApps、ただしチーム開発は少し大変
PowerAppsは、PowerPointでスライド上に作図するような操作感でアプリのユーザーインタフェース（UI）をデザインし、Excelの数式バーに数式を入力するような操作感で画面遷移などのアプリ動作を設定するサービスです。作成したアプリは、デスクトップでもスマートフォンでも動作します。基本的な使い方は、以下の2分間の動画を観るとイメージできると思います（動画では、PowerAppsを使ってオーダーをメール送信する「牛丼注文アプリ」を6分間で開発しています）。
「牛丼注文アプリ」を6分間で開発（クリックでYouTubeを再生）
PowerAppsはワークフロー作成ツールMicrosoft Flowと一緒に使うことを前提としたサービスで、PowerAppsのライセンスにはMicrosoft Flowが含まれています。PowerAppsコネクタという、外部のメールサービスやデータベース、SNS、AI APIなどとデータ連携するコンポーネントが用意されており、Microsoft FlowからPowerAppsコネクタを使って外部サービスと連携するアプリを作成します。
このように、ノンコーディング開発とはいえPowerAppsで実装できる機能の幅はかなり広いので、ハッカソンでは各チームとも、アイデアをまとめ、アプリに使う機能を取捨選択することに時間を割いていました。また、今回のハッカソンはPowerApps初心者も多く、PowerApps独自の数式に戸惑っている様子が見られました。コネクタを使った外部サービスとの連携では、サービスごとに設定のノウハウが必要で、つないだものの動作しないといったこともあります。あるチームは、外部サービスのつなぎこみの動作検証に時間を費やしていました。
今回のハッカソンはチーム開発の体制で行われましたが、PowerAppsはどちらかというと、UIデザインからバックエンドの実装、配布まで一人のユーザーが行うようなツールです。チーム開発を想定した機能はあまり入っていません。また、非エンジニアの参加者は、外部のチーム開発ツールの利用に不慣れです。それでも各チームとも、メールで各メンバーの成果物を共有してマージするなど、工夫していました。各チームとも、アイデア出しに50分ほど、開発に2時間ほどといった時間配分でした。
画像認識AIを組み込んだカメラアプリが短時間で完成
最後に、各チームの成果物の発表です。PowerAppsには、アプリからスマートフォンやPCのカメラを操作して撮影した写真データを取り込む「カメラコントロール」というパーツがあらかじめ用意されています。今回のハッカソンでは、2チームがカメラで撮影した画像をAIで解析するアプリを開発しました。
PowerApps経験者4人で編成された「チームメキシカン」は、Microsoft Azureの画像認識AI API「Computer Vision API」を組み込み、スマートフォンのカメラで写真を撮ると、被写体の解説をテキストで返すアプリを開発しました。「業務アプリ開発での利用が多いPowerAppsで、敢えて、自撮り写真に自動でリアクションがくるコンシューマーアプリを作ってみました」とのこと。解説文はSharePointに保存されるようになっており、顔認識するFace APIで応用すれば、来客管理などの業務アプリにも使えそうです。
「Computer Vision API」で撮影した写真に解説テキストがつくカメラアプリ
「Aチーム」が開発したのは、同じくComputer Vision APIのOCR機能を使って、スマートフォンで撮影した名刺を文字起こししてデータ保存する名刺管理アプリ。時間切れでデータ保存機能の実装まで進めなかったそうですが、アプリからカメラを起動して撮影、ボタン1つでOCRが文字起こしをする動作が出来上がっていました。
名刺を撮影すると文字起こしする名刺管理アプリ
初心者、開発未経験者を含むメンバーが、2時間程度の開発時間でAIを組み込んだカメラアプリを作り上げるとは驚きです。
みんな作りたかった、災害時に役立つ「安否確認アプリ」
残り3チームは、「安否確認アプリ」を開発しました。3チームのアイデアが重なるのは想定外でしたが、西日本の広い地域が大規模な水害に見舞われた今夏、「災害時に役立つアプリを作りたい」との思いを持っていた参加者が多かったようです。
まず、PowerAppsを一回も触ったことがない未経験のメンバーが集まったチーム「びぎなーず」は、PowerApps独自の数式の習得に苦戦して完成には至らなかったものの、安否確認アプリのトップ画面、安否報告画面、安否確認画面を作成し、画面遷移する操作設計までを実装しました。未経験でアプリのモックを2時間程度で作り上げたと考えるとなかなかすごいことです。
まったくPowerAppsを使ったことがないビーム「びぎなーず」だが安否確認アプリのモックまで完成
「チーム寄せ集め」は、安否確認の報告者用アプリと管理者用アプリの2つを作り、SharePointでデータ連携させました。管理者アプリから安否報告を促す一斉メールを送信し、報告者はメールに記載されたURLから報告用アプリを起動、無事かどうかの情報を入力して送信する仕組みです。報告された内容はSharePointに格納し、管理者用アプリから一覧を確認できるようになっています。今回は開発時間が足りませんでしたが、報告者の現在地を地図上で表示するために、安否送信時に緯度経度のデータもとっているそうです。
「チーム寄せ集め」が開発した安否確認アプリ（報告者用）
安否確認アプリ（管理者用）
「チーム坊主と女性たち」の安否確認アプリは、送信された緯度経度データをもとにBing Map上に報告者の現在地を表示する機能まで実装した。同チームのアプリは、管理者用のPowerAppsアプリと、報告者用のMicrosoft Flowアプリで構成されており、管理者用アプリからSharePointの従業員リストを読み込んで安否報告を促す一斉メールを送信、メールを受信した従業員がMicrosoft Flowアプリから安否・写真・位置情報を報告するという仕組みです。報告された内容はSharePointに格納され、管理者用アプリから報告一覧、従業員の現在位置と安否をプロット地図などを確認できるようになっています。
「チーム坊主と女性たち」が開発した安否確認アプリ
報告された従業員の安否と現在地を地図上にプロット
＊ ＊ ＊
社会人が参加しやすい時間帯を狙って水曜日の夕刻に開催された今回のハッカソンは、競争よりも、制限時間内にアイデアをアプリに実装する体験を通してPowerAppsとノンコーディング開発を学び合うことが目的のイベント。非エンジニアにとっては極短時間でアプリ開発の一連の流れを学び、PowerAppsの操作技術を持ち帰る機会になったと思います。また、アプリ開発経験者にとっても、ノンコーディング開発のスピードを体感して、その可能性を考える機会になったのではないでしょうか。PowerAppsには無償でフル機能を試用できるプラン「PowerApps Community Plan」があるので、興味を持った方は試しに使ってみてください。日経BP社から入門本も出版されています。
