お役立ち

Game UI Atelier：最初の1画面をつくる

ノベルゲームのメッセージウィンドウや選択肢など、画面の見た目を考えるときに使えます。無料ブラウザ版は、1画面のデザインを選び、調整して持ち帰る道具です。

1. 無料版を開くと、プリセットとライブプレビューが表示されます。プリセットを選ぶか、スタイルを選んで「生成する」を押します。複数の案を比べたいときは「4つの候補」を押し、気に入った候補を適用します。
2. 「デザイン調整」でメッセージウィンドウ、選択肢・ボタン、テキスト・名前欄を選び、色・形・文字を整えます。例えば、紙のような背景色と読みやすい文字色に変え、会話画面の雰囲気を確かめられます。
3. 編集を続けるための控えは「JSON保存」でダウンロードします。画像なら「PNG画像出力」、ゲーム向けのデータなら「エクスポート」から出力先を選びます。

何を保存すればよい？

• JSON：あとで無料版の「JSON読込」から編集を続けるためのデータです。別の端末へ移すときにも使います。
• PNG：デザインを画像として持ち帰ります。編集用のJSONも一緒に残すと安心です。
• エンジン向けZIP：Web / CSS、ティラノスクリプト、Unity UGUI、Godot 4を選べます。導入手順を含むZIPを保存し、出力先のゲームプロジェクトで確認してください。

保存場所と、困ったとき

作業内容は、使っているブラウザ内に保存されます。アカウントやAI APIは不要です。ブラウザのデータ削除や別端末への移動に備え、大切なデザインはJSONでも手元に保存してください。無料版とWindows版CREATIVEはJSON形式が異なり、相互に読み込めません。

画面を開くにはJavaScriptを有効にしてください。スマートフォンでは編集欄の位置や幅が変わります。細かな調整はPCの広い画面でもお試しください。書き出したZIPは、読み込むエンジンに合う形式かどうかを確認し、同梱の導入手順に従ってください。

Game UI Atelier 無料版を開く

かこむくん：手元の文章を読む

1. かこむくんを開き、「文章を入れる」から、読みたい文章を入力欄に貼り付けます。
2. 「表示する」を押し、文字の大きさ・行間・配色などを調整します。最初は「行を見失う」「まぶしい」など、困りごとに合わせた設定から試せます。
3. 単語を押して読み上げるほか、順番に読む方法も選べます。音声が出ない場合は、端末の音量と日本語音声の設定を確認してください。

文章はブラウザ内で処理され、自動保存されません。「文章を入れる」の画面にある保存ボタンで、入力文をテキストファイルとして手元に残せます。外部AIによる文章処理や診断は行いません。読み上げや変換の詳しい設定は、ツール内の案内をご覧ください。

WEB Reader：公開ページを読む

1. WEB Readerに、読みたい公開ページのURLを入力して「読み始める」を押します。
2. 「設定を開く」からふりがなや読み上げ方を選びます。本文をクリック・タップすると読み上げ、マウスを重ねると部分ズームに表示されます。
3. 元のレイアウトや画像を確認したいときは「元のサイトを開く」を使います。

公開されたHTMLの文章に対応しています。ログインが必要なページ、PDF、操作後に表示される文章は読み込めないことがあります。画像は説明文で表示します。入力したURLと本文は読書用の表示を作るためにサーバーで処理し、閲覧履歴は保存しません。読み上げには端末内の日本語音声を使います。