Storyboard FAQ
Storyboardについて
Storyboardエンドユーザーライセンス契約 (EULA) を確認できますか?
Storyboard(評価版を含む)をインストールいただきますと同時にインストールされます。
例:デフォルトの設定でそのままインストールした場合
なお、インストールする前に内容確認を希望される場合はお問い合わせのページからご連絡ください。
StoryboardにはOSSが含まれますか?
Storyboardのマニュアルはどの様に提供されますか?また、日本語のマニュアルは提供されますか?
Storyboard(評価版を含む)をインストールいただきますと同時にインストールされます。
例:デフォルトの設定でそのままインストールした場合
大変申し訳ございません。日本語のマニュアルは提供しておりません。
pdfドキュメントとは別にCrank社がサポートサイトで情報を公開しています。
サポートサイトではドキュメントのほか動画などもご覧いただくことが可能です。
公開サイトですので、ブラウザ等の翻訳機能をご活用いただければ幸いです。
Storyboardの起動手順について
動画『SCP転送でUIをターゲットに書き出す方法』で行っている、Storyboard Application Export Configurations の Execute after transfer の欄で指定する起動スクリプトの記述例を教えてください。
Linux環境を前提とします。
環境変数としてStoryboardのpluginの保存場所のパスを指定する SB_PLUGINS が必要です。また、LD_LIBRARY_PATHには、ダイナミックリンクライブラリのパスを追加登録する必要があります。例えば、i.MX8/yocto 環境の場合、以下のようなscriptを作成します。
export SB_PLUGINS=$RUNTIME_ROOT/plugins
export LD_LIBRARY_PATH=$RUNTIME_ROOT/lib:$LD_LIBRARY_PATH
$RUNTIME_ROOT/bin/sbengine $1
※このファイルはあらかじめLinuxターゲットに転送し実行権限を付加しておきます。
Storyboard Application Export Configurations の Execute after transfer をチェックして、このファイルをフルパスで指定してください。
Storyboard Application Export Configurations でExecute after transfer を指定してエクスポートしても、自動起動できません。アプリケーションの転送自体は正しく行われています。
Linux環境を前提とします。
StoryboardデザイナーのConsole ウィンドウに以下のようなエラーが残っている場合があります。
ERROR [0.000]:Unable to get native display
ERROR [0.96189]:Can't initialize the display
この場合、環境変数 XDG_RUNTIME_DIR を設定する必要があります。
Linuxターゲットにログインしてこの環境変数の設定をご確認ください。
例:
XDG_RUNTIME_DIR=/run/user/0
target#
例えば上記の場合、Execute after transfer に指定するスクリプトファイルの先頭に以下のように追記します。
タッチパネルを接続していますが、ただしくハンドリングできません。
Linux環境を前提とします。
タッチパネルデバイスがdefault値と異なっている可能性があります。
起動時にデバイス名を-omtdevオプションで指定してください。
例:デバイスが /dev/input/event2 の場合
デバイス名が不明な場合、catコマンドで/dev/input 内のデバイスを順番に標準出力にリダイレクトすることで確認できます。
例:
タッチパネルデバイスに対して上記実行しタッチパネルをさわるとゴミが出力されますので、そのデバイスを指定します。
sbengineで指定できるオプションについて教えてください。
sbengineのオプションはPDFドキュメントの「Table 10. Plugin Options」またはサポートページの「Storyboard Engine Plugin Options」で説明しています。
IllustratorからPhotoshopへのインポート
Illustratorのデザインファイル(Aiファイル)をStoryboardにインポートするためにPhotoshop(PSD)に書き出す手順を知りたいです。
Illustratorファイル(Aiファイル)をStoryboardにインポートするためにPhotoshop(PSD)に書き出す際の注意点を知りたいです。
【注意点】
①(05:26~) Illustratorのレイヤー内でグループ化されていないものは、
PSDに書き出し後、Photoshopのレイヤーで1つのオブジェクトとなります。
②PhotoshopからStoryboardにインポートする際、ボタンの機能を持つオブジェクト(_up /_down)の上に他のオブジェクトが被っていると、ボタンのactionが作成されても機能しません。PSDのレイヤーの順番でボタンのレイヤーが上になるようにして下さい。
PhotoshopからStoryboardへのインポート
サンプルPSDはありますか?
こちらよりダウンロードしていただけます。
Storyboard用PSDファイル
Photoshopのカンバスの設定に指定はありますか?
アートボードの命名規則はありますか?
他のストーリーボードオブジェクトとは違い、アートボードには命名規則がありません。
アートボードはPhotoshopで設定した名前で、StoryboardのScreenとしてインポートされます。
アートボードの大きさは統一してください。
アートボードの大きさがStoryboardの画面サイズになります。
Photoshopアートボード内のコンテンツの命名規約は?
英数字(アルファベット・数字・特殊文字) フォーマットを使用して名前を付ける必要があります。
「Aa-Zz」「0-9」とアンダースコア文字である「_」の組み合わせで行うことができます。
日本語または、全角英字は使用できません。
Photoshopのコンテンツ名と構成は、アプリケーションモデル内での配置が決まります。
※参考PSDファイル:01 _group and _layer.psd
ボタンはどのように作成出来ますか?
_upで終わるPSDレイヤーを、_downで終わる同じ名前の別のレイヤーの直上に配置すると、
ボタンとして動作するコントロールが作成されます。
※参考PSDファイル:02 Button-up-down-setting.psd
Photoshopのレイヤーにつけた効果のインポート
描画モードはインポート出来ますか?
上のレイヤー(描画モードが変更されている)と下のレイヤー、
2つのレイヤーを選択して、一緒にスマートオブジェクトに変換してください。
ラスタライズ化では効果はインポートされません。
(イメージ画像の白いボタンの効果、【べベルとエンボス】はラスタライズ化でもインポートされます。)
※参考PSDファイル:03 Blending Mode.psd
クリッピングマスクはインポート出来ますか?
2つのレイヤーを選択して、一緒にスマートオブジェクトに変換してください。
ラスタライズ化では効果はインポートされません。
※参考PSDファイル:04 clipping Mask.psd
ワープ文字はインポート出来ますか?
文字のアンダーラインはインポート出来ますか?
光彩はインポート出来ますか?
ドロップシャドウはインポート出来ますか?
ベベルとエンボスはインポート出来ますか?
変形のワープはインポート出来ますか?
スマートフィルターのぼかし(ガウス)はインポート出来ますか?
スマートフィルターの描画(逆光)はインポート出来ますか?
スマートフィルターの変形(ジグザグ)はインポート出来ますか?
FigmaからStoryboardへのインポート
FigmaからStoryboardへのインポートに関するガイド(PDF)
FigmaデザインファイルをStoryboardにインポートする手順
StoryboardにインポートするFigmaデザインファイルの作成に関する注意点