画面デザイナ

hifive画面デザイナについて説明します。

※本ツールはベータ版です。仕様などは予告なく変更される場合があります。

• 概要
• 基本的な使い方
• 動作環境
• 試用版とローカル実行版について

概要

hifive画面デザイナ（以下「画面デザイナ」）は、画面を構成する部品（ボタン、入力ボックス等々）を配置して
画面の開発を行うWYSIWYG型の画面デザイン支援ツールです。
画面の完成イメージを確かめながら開発できるため、特にプロトタイプ開発等に威力を発揮します。
また、ツール自体がWebアプリとして作られており、機能拡張もWeb標準技術に従って行うことができます。

主な特長は以下の通りです。

• 予め用意された基本的なUI部品やレイアウト部品を配置するだけの簡単操作
• 完成イメージをリアルタイムに確認しながら画面を作成できる
• カスタムスタイルの定義等高度な使い方も可能

基本的な使い方

画面デザイナの基本的な使い方は以下の通りです。

1. エディタのページを開く（試用版はこちら（※後日リンク追加予定））
2. 画面左上の「新規作成」ボタンを押し、テンプレートを選んで「作成」ボタンを押す
3. 画面左の部品一覧から部品を選び、画面中央の領域にドラッグ＆ドロップする
4. 部品を編集したい（文章を変える、色を変える等）場合は、部品をクリックして画面右上のパラメータを編集する

その他、各機能の詳しい使い方は画面デザイナ内に出てくるツールチップを参照してください。

動作環境

画面デザイナは、以下のブラウザで動作します。
ただし、画面の描画結果はブラウザに依存するため、ブラウザによっては一部のCSSが適用されない場合があります。

• IE9以上
• Firefox最新版
• Chrome最新版

また、ローカル実行版を動作させる場合、サーバーサイドとして以下のJava環境が必要です。

• Java 7
• Tomcat 7（Tomcat以外のJava Servletコンテナでも動作する可能性がありますが、検証はしていません）

試用版とローカル実行版について

画面デザイナは、簡単にお試しいただけるよう、本サイトにて試用版を用意しています。
基本的な使い方や部品の数などは変わりありませんが、
試用版の場合スナップショットの作成・プレビューURLの生成など一部の機能は利用できません。

なお、画面デザイナはライセンスに基づき無償で提供するものですので、
試用版・ローカル実行版どちらも、利用にあたって課金などはありません。