前回の記事「ArcGIS Web AppBuilder から ArcGIS Experience Builder に移行しよう – ウィジェットについて」では、ウィジェットを中心に移行のフローをご紹介しました。
今回は、ArcGIS Web AppBuilder (以下、Web AppBuilder) から ArcGIS Experience Builder (以下、Experience Builder) の移行に向けて、両製品を利用して作成できるアプリのデザインについてご説明します。
目次
デザインの比較
まずは、両製品で作成できるアプリのデザインを比較します。Experience Builder では、Web AppBuilder と比較してデザインの自由度が大きく向上しましたが、実際にどのような部分が向上したかをご紹介します。
アプリ全体
Web AppBuilder では、テーマを選択することによってアプリのデザインを決定します。テーマにはパネル、スタイル、レイアウト、構成済みのウィジェットが含まれます。
デザインやウィジェットを選択するだけでアプリを作成できますが、マップ中心の固定的なデザインになります。
一方で Experience Builder ではマップ中心だけではなく、マップにとらわれない Web サイトのようなデザインも実現可能です。
要件に合わせてシンプルなデザインから柔軟なデザインまで対応可能です。
ウィジェットの配置やスタイル
Web AppBuilder では、ウィジェットの配置はテンプレートに依存します。またウィジェットの大きさも設定できません。
一方で Experience Builder でアプリを作成する際は、任意の場所・大きさでウィジェットを配置できます。そのため、前述した通り柔軟にアプリをデザインできます。
さらにウィジェットの大きさや配置は絶対値、相対値の指定が可能なので、ブラウザーの表示サイズやディスプレイの解像度でデザインが崩れないように調整可能です。
マルチ デバイス対応
Web AppBuilder はレスポンシブ デザイン、Experience Builder はアダプティブ デザインでマルチ デバイスに対応しています。どちらの方法もデバイスに関わらずユーザーに対し適切な状態で Web アプリを表示できます。
レスポンシブ デザインでは、1 つの HTML ファイルをデバイスやブラウザーの表示サイズに合わせて表示します。
一方でアダプティブ デザインは、PC 用の HTML ファイル、スマートフォン用の HTML ファイルといったように、対応デバイスごとに HTML ファイルを用意します。そのためユーザーが使用するデバイスに対して Web アプリの表示を変更可能です。
メリット
メリットとしてユーザー エクスペリエンスの向上が挙げられます。デバイスに応じて最適化された画面の作成・表示が可能で、ユーザーはスマートフォンの小さい画面でも快適なアプリ操作が可能となります。
また、表示デバイスごとに HTML ファイルが用意されているため、サイトの表示速度が速いという特長があります。
デメリット
柔軟で高速表示が可能なアプリ作成が可能ですが、一方で複数デバイスに対応したデザインの作成が必要というデメリットがあります。
ただし、Experience Builder では豊富なテンプレートが提供されており、それらを活用することでアダプティブ デザインのアプリを低コストで作成可能です。テンプレートについては次項で詳しくご紹介します。
Experience Builder でアプリをデザインする際のヒント
実際に Experience Builder でアプリを作成する際のヒントをご紹介します。
テンプレートから簡単にアプリを作成
前述した通り、Experience Builder では事前に設定されたデザインがテンプレートとして提供されています。テンプレートにはウィジェットやウィンドウが配置されており、データソースとウィジェットを接続するだけでアプリを作成できます。
大・中・小画面用のデザインも事前に設定されているため、低コストでアダプティブ デザインのアプリを作成可能です。またテンプレートは自身で作成したり、共有したりできるため組織全体で統一されたデザインのアプリ作成も可能です。
Web AppBuilder のデザインを踏襲してアプリ作成
Experience Builder のテンプレートには、Web AppBuilder の従来のテンプレートに倣ったデザインもあります。そのためアプリを移行しても、ユーザビリティを損なうことなく移行が可能です。
テンプレート選択や UI に関しての詳細は「ArcGIS Experience Builder を始めよう！」をご参照ください。
移行に関するまとめ
本記事を含め、3 つのブログ記事で Experience Builder への移行に関してご紹介しました。
「両製品の違いと移行のメリット」では両製品が採用しているテクノロジーや機能の違いについて比較し、移行のメリットについてご紹介しました。また「ウィジェットについて」ではウィジェットを中心に移行のフローをご紹介しました。
そして本記事ではユーザーにとって重要な要素であるデザインの比較、移行に向けたヒントをご紹介しました。
Experience Builder に移行することで、新たなテクノロジーに対応した柔軟なアプリが作成可能です。ぜひご活用ください。
移行に関連したドキュメント
Experience Builder ではじめてアプリ作成する方に向けた利用ガイド
ArcGIS Experience Builder 利用ガイド
移行に関するヘルプ
Web AppBuilder ユーザーに向けた Experience Builder
Web AppBuilder と Experience Builder の機能比較表
移行についての FAQ—ArcGIS Web AppBuilder