株式会社エイチアイ

株式会社エイチアイ

  1. トップ
  2. 製品情報
  3. exbeans® UI Conductor
UI Conductor
Automotive Grade Linux (AGL)
加盟企業様向けお問い合わせ

 exbeans®
UI Conductorの特長

エイチアイの組込UIノウハウを集約した次世代UIオーサリングツール

UI Conductorは、組み込みシステム向けのGUI(Graphical User Interface)や、HMI(Human Machine Interface)を開発するための統合環境です。

PCツール(ConductorTact)上で2Dおよび3Dグラフィックスをオーサリングし、そのオーサリングしたUIデータを実機上に配置したランタイムライブラリ上で動作させることができます。

ConductorTact上でUIの動きをリアルタイムに確認しながら開発を進めることができるため、開発工程が効率化するだけでなく、UIの表現力向上、分散開発、組み込みシステムに適したパフォーマンスの実現など、UI/UX開発における様々な問題を解決することができる製品です。

本製品は市場ニーズをキャッチアップし、随時バージョンアップされており、 最新バージョンでは、3D機能の更なる改善(FBX形式のサポート、実現可能な表現の追加)、マルチプレビュー機能の更なる改善(レイヤー合成)を行い、デザイナーの意図するリッチなグラフィックスを簡単に表現するとともに、UI/UX開発の効率化に貢献できるツールとなっています。

UI Conductor

UI開発の生産性とワークフローの改善

UI開発でよくある問題
UI開発でよくある問題
  • プログラムの完成までUIの確認ができない
  • 莫大な画面数をプログラムとExcelで管理しているため、作業ロスが多い
  • デザイナーとプログラマーの間で仕様調整に時間がかかり、生産性が上がらない
  • ボタンひとつ入れ替えるだけで大きな手戻りコストが発生する
  • 製品を複数の国に向けて出荷する必要があるが、UIの対応コストが高い
 
exbeans® UI Conductorを導入すれば、それらの問題を解決できます
UI Conductor導入で問題解決
  • ツール上で動作確認しながらデータ作成
  • 高い生産性を実現するための豊富な機能
  • ワークフロー改善による開発コスト削減
  • 充実したSDKでプラグインによる機能拡張
  • 多言語エディタ、クロスプラットフォーム対応
 
通常のワークフロー

デザインから確認までのサイクルが長く、作業が部分的に直列化してしまいます。また、実際のワークフローはプロジェクトによりバラバラです。

通常のワークフロー
exbeans® UI Conductor 導入後のワークフロー
UI Conductor 導入後のワークフロー
<製品利用フロー>
製品利用フロー

高機能かつ、使いやすいオーサリングツール

リッチなUIを短時間で開発できます
高機能かつ、使いやすいオーサリングツール高機能かつ、使いやすいオーサリングツール
 

 exbeans®
UI Conductorの機能

ドラッグ&ドロップによるUIオーサリング
オブジェクト・コンポーネントアーキテクチャの採用により、直感的なドラッグ&ドロップ操作でUIを作成できます。特別な知識は不要で、プログラマー、デザイナー、プランナーすべての職種でご利用頂けます。
イベント、アニメーション
UI Conductorでは静的なUIに加え、タッチ、キー、タイマーなどのイベントおよびそれらイベントが発火した際、画面遷移、アニメーションなどの動的なアクションをドラッグアンドドロップで設定できます。
従来のオーサリングツールでは実現できなかった動きのある画面をConductorTact上で作成できます。
アニメーションエディタ
各種イベントから動作させるためのアニメーションをConductorTact上で作成、編集するためのエディタです。
プレビュー機能
タッチ操作、アニメーション、画面遷移など作成した画面のUXをConductorTact上で確認できます。
マルチプレビュー
UI Conductorではコンテキストに対するイベントの送受の仕組みを提供しており、具体的なディスプレイ間のやり取りの方法やプロトコルは、アプリケーション層で自由に規定できます。また、ConductorTact上で複数のディスプレイ間で連動するUIを作成/プレビューすることができます。(特許取得済み)
外部デバイスを使用したプレビュー機能
外部デバイスを接続し、そのデバイスからの入力をプレビュー時に反映することができます。例えば車載機器などの場合、ハンドルやハプティックデバイスを接続することでより実環境に近いシミュレーション環境を構築できます。
ステート連携
UIからアプリケーション/システムに、またはその逆方向から各種状態を通知できます。
これにより作成したUIからアプリケーションを経由してハードウェアを操作する、システムの状態に応じて特定のUIを表示する、などのユースケースが実現できます。
また、プレビュー中においてもその状態をエミュレートすることが可能です。
3Dサポート
3Dシーン上にモデル、ライトを配置し、そのシーンにカメラで表示領域(ビューポート)を指定することで3Dオブジェクトを容易に表示させることができます。従来の2Dオブジェクトと共存することも可能です。
シーンウィンドウ
3Dシーン上のモデル、ライト、カメラをマウス操作で平行移動、回転、拡大/縮小の組み合わせを容易に調整できます。
コモンオブジェクト
一度作成したUI部品をコモンオブジェクトとして登録すれば、ドラッグ&ドロップで再利用できます。元になっているコモンオブジェクトへの修正は配置済みのコモンオブジェクトへすべて反映されるので、仕様変更やデザイン変更が簡単にできます。
ローカライゼーション/仕向け管理
複数の言語、複数のデバイスに対応したUIを作成するための仕組みを用意しています。共通化するUIと環境固有のUIを設定できるため、必要最小限の作業で複数環境に対応したUIを作成できます。ConductorTact上からはボタン1つで環境を切り替えながら編集することができます。
画面遷移エディタ
複雑になりがちな画面遷移をビジュアルに編集できるエディタです。作成したUIを全体的に俯瞰する際や仕様書を作成する際にも利用できます。
リスト作成
タッチパネルの普及により一般的になったタッチスクロールをデフォルトでサポート。ドラッグ&ドロップで配置するだけでリストを使えます。データベースとの接続もサポートしています。
自動レイアウト機能
CSSのFlexbox相当のレイアウト機能により、UIを自動でレイアウトすることができます。例えばボタンやアイコンなどのUIパーツの数や大きさが変わっても、自動で美しいレイアウトを保つことができます。
自動テキストチェック機能
UIを複数の言語に対応させた場合、翻訳後の文字がテキストエリアからはみ出していないか、可読性を損なっていないか自動でチェックするための機能を用意しています。通常は人間が目視で大きな工数をかけて行う作業を、手間なく一瞬で行えます。
インスペクタ
画面数や1画面あたりに配置されるオブジェクト/コンポーネントの個数が増大した際、目的の機能を探すために、オブジェクト名、コンポーネント名などをキーにし検索するためのウィンドウを用意しています。
ドキュメント出力機能
作成したUI画面をMicrosoft Excel形式のドキュメントとして出力可能です。使っているパーツの一覧や配置情報を出力できます。表示する内容やレイアウトは自由にユーザーが編集できます。
Photoshop連携
PhotoshopでデザインしたデータをそのままConductorTactにインポートできます。
インポートしたデータにイベント、アクションを設定する事でそのままUIが作成できます。
充実したSDKとドキュメント
exbeans® UI Conductor製品パッケージにはツールの使い方やデータの作り方、開発マニュアルなど 豊富なドキュメントとサンプルコンテンツが含まれています。
 

ツールユーザビリティーの改善

1)プロジェクトの一覧性と検索性改善
プロジェクトウィンドウ上でスクリーンのサムネイルを表示できるようになります。
一覧してスクリーンを見つけやすくなります。更にスクリーンコメントの検索に対応しました。
2)コモンオブジェクトウィンドウ
新たにコモンオブジェクトウィンドウを実装します。
コモンオブジェクトウィンドウ上で各コモンオブジェクトをサムネイルで確認することや、検索を行うことができます。
3)オブジェクトウィンドウの一覧性と検索性改善
オブジェクトウィンドウ上で表示されるオブジェクトに最も適切なアイコンが表示されるようになります。 そのオブジェクトに指定されているコンポーネントの種類で判断し、適切なアイコン表示を行います。 上記にあわせ、コンポーネントの種類などを指定した検索が行えるようになります。

生産性を向上させるために

1)コントロールプラグイン
コントロールプラグインを用いた開発ができるようになりました。 例えばチェックボックスなどの状態(チェックの有無など)が必要な部品が単一のコンポーネントとして提供されます。
その際には従来のイベント、アクション、アニメーションを組み合わせた制御のための部品を作成する必要はありません。
2)プログラムソースの生成
作成したコンテンツをプログラム上で動作させるためのソースコードを出力することができるようになり、APIを使用したアプリケーションの開発を補助します。 (初期化、プラグインの登録、アップステートの制御、画面遷移など)
3)トランジションエディタの改善
画面遷移図を描くようにスクリーン間をリクエスト/条件を設定し矢印で繋ぐことができます。
この画面遷移はConductorTact上のプレビューで動作確認ができるようになります。 更に画面遷移時に条件分岐がある場合、プレビュー上で選択肢を表示し、異なる遷移先を表示することも可能です。
4)レイヤープレビュー
従来では画面部品を共有するために、コモンオブジェクトを作成し必要な画面に配置する、という実現方法を提案していました。
例えばアラートダイアログのような全ての画面に表示される事を想定した部品の場合、専用のスクリーンを作成し、メインのスクリーンと重ねて表示する、という実現方法を提案します。その重ねたスクリーンの動作をプレビュー上で確認するために、マルチプレビューにレイヤープレビュー機能を追加しています。

アニメーション機能の強化

1)オートキーフレームモード
スクリーン上で動かしたオブジェクトをカレントフレームに自動的に記録するモードを追加しました。 アニメーションを感覚的に素早く付けることができるようになります。 また、キーフレーム追加時には現在の値を反映するなど操作性を向上させる改善も行っています。
2)アニメーションカーブ
従来のアニメーションのモードはリニア、イーズイン/アウトなど固定の割り付けのみサポートしていましたが、アニメーションカーブをより細かく調整できるようになりました。
3)パスデータに沿ったアニメーション
パスデータを描画する機能は提供していましたが、そのパスデータに沿ってアニメーションする機能を追加しました。

アトラス画像のサポート

複数の画像を一つの画像(アトラス画像)にまとめ、描画時にはアトラス画像のどの領域を表示するかという指定を内部的に行う事で、OpenGL ESのAPI呼び出し回数が低減し、描画全体のパフォーマンスが改善する事が期待できます。 例えば複数の点灯アイコンをアトラス化し、オブジェクトの描画順を連続させるとより描画パフォーマンスの向上が期待できます。

3D機能の改善

1)FBX形式のサポート
従来は3ds MaxまたはMayaで作成された3Dデータをエイチアイ独自フォーマットに変換しUIC上で表示する仕様でしたが、バージョン1.8.0では主要な3Dオーサリングツールで取り扱うことができるFBX形式をサポートしました。
そのため、今まで使用していた3Dオーサリングツールを引き続き使用して頂いたうえで、UIC上でその3Dデータを問題なく表示できるようになります。
2)ビルトインシェーダー
従来では全ての3Dデータに対し個別にシェーダーを記述する必要がありましたが、バージョン1.8.0ではモデルやシーンからシェーダーを自動的に生成し、シェーダーの知識がなくても3Dデータを表示できるようになります。
また、サポートされていた機能(キューブマップなど)はそのままに、新たに下記表現をサポートできるようになりました。

・シーン内ライトをシェーダーから操作
・ライトマップ
・法線マップ
・セカンドUV
 

 exbeans®
UI Conductorの製品仕様

<ソフトウェア構成図>
ソフトウェア構成図

製品に含まれるもの(SDK)

ランタイム
Standardプラグイン
(ライブラリ, ソースコード)
コアライブラリ(ライブラリ)
ポーティングレイヤーRI
(ライブラリ, ソースコード)
2Dレンダラ(SW/HW)
3Dレンダラ
ツール
exbeans® UI ConductorTact
(ツール)
Photoshop Importer / Exporter Plugin
専用ビューア
多言語エディタ
サンプル
サンプルデータ
サンプルコード
サンプルコンテンツ
ドキュメント
チュートリアル
リファレンスマニュアル
デザイナーズマニュアル
プログラマーズマニュアル
 

動作環境

ツール
OS:Windows 7(x86/x64), Windows 8/8.1, Windows10
CPU:Core 2 Duo以上(i5以上推奨)
GPU:Direct X 9以上をサポートするグラフィックカード ※3D利用時のみ必要
メモリ:2GByte以上(4GB以上推奨)
その他:VS2015ランタイム(SDKに再頒布パッケージを同梱)が必要
ランタイム(組込ライブラリ)
OS:各プラットフォームにポーティング可能
CPU:ARM9 200MHz以上(コンテンツに依存)
メモリ:コンテンツに依存
ライブラリサイズ:300KB前後(ARM版)
GPU:OpenGL ES 2.0以降 , OpenVG
(GPUがない場合はソフトウェアレンダリングも利用可能)