今回は、モダンWebの分散処理を活用した例として「顧客管理」アプリ(以降は本アプリと呼ぶ)を詳しく説明することで理解を深めてゆく。

 初めに利用環境や要件、処理の流れなどアプリの全体像を解説したあと、ここで利用するモダンWebの技術、実装された画面と機能の順に解説する。

アプリの利用環境を想定し仕様を決める

 図1に、今回取り上げるシステムの概要をまとめた。

図1●システムの概略図
図1●システムの概略図
[画像のクリックで拡大表示]

本アプリの対象業務
・企業向け事務機器販売会社の営業部門
・顧客ごとに営業を割り当てる担当営業制
・売上は「OA機器」、「備品」、「サービス」に分類して集計
・内勤事務社員は、主に顧客からの問い合わせ時に、本アプリを利用し顧客情報を参照する。PCを使用する
・外勤営業社員は、主に外出時に本アプリを利用し顧客情報の確認、営業報告を行う。スマートフォン・タブレットを使用する

管理するデータ
・顧客の基本情報(顧客番号、顧客名、住所、電話番号、ご担当者名)
・顧客ごとの月別売上実績(OA機器、備品、サービスのカテゴリー別)
・営業報告(表題、報告文、添付写真)

要件と機能
要件1.十分なセキュリティを確保すること
要件2.操作が簡単で、誰でもすぐに使えること
要件3.売上実績のグラフ表示ができること
要件4.日米2カ国語に対応し、将来対応言語を追加できること
要件5.モバイル対応
 PCと同じ機能を提供すること
 モバイル向けに最適化された画面レイアウトとすること
 ネットワーク圏外において利用可能なこと

1.十分なセキュリティレベルを確保すること

 セキュリティについては、次項 「セキュリティ機能の実装」で解説する。

2.操作が簡単で、誰でもすぐに使えること

 モダンWebも、従来のWebアプリと同様、 WebブラウザーさえあればURLを入力することですぐに利用できる。初めての操作でも使える分かりやすいユーザーインタフェースのデザインをする。