この記事では、デザイナーで写真、GIF、QRコードを追加・編集する方法について説明します。
デザイナーを使用すると、豊富なストック写真、GIPHYのGIF、カスタマイズ可能なQRコードを使用して、デザインをより動的にすることができます。
デザイナーアプリに関する一般的な情報については、デザイナーの使い方ガイドをご覧ください。
これらのオプションは、デザイナーのサイドメニューからアクセスできます：
写真
写真オプションを選択すると、サイドメニューの写真セクションが表示されます：
ここでは、使用したいストック写真を検索できます。選択すると、デザインに配置されます。
写真を編集するには、写真を選択します。トップメニューのオプションが変更されます：
これらのオプションについて順番に説明します。
| 注意 |
| 以下の情報は、画像オプション経由で追加された画像（デバイスからアップロードされた画像やアセットとして追加された画像）にも適用されます。 |
背景
背景オプションを使用すると、写真の背景レイヤーを変更できます。
フィルター
フィルターオプションを選択すると、サイドメニューが表示され、写真に追加するさまざまなフィルターを選択できます：
切り抜き
切り抜きオプションを使用すると、選択した写真や画像を切り抜くことができます。
切り抜き領域は、ドラッグ、拡大、縮小でき、アスペクト比オプションと画像の反転・回転機能があります。切り抜かれた画像のプレビューが画面右上に表示され、画像のサイズも表示されます。最後に、切り抜き領域を長方形または円形に変更できます。
マスク
マスクオプションをクリックすると、サイドメニューでマスクオプションが開きます。
マスクメニューから形状を選択すると、その形状のマスクが自動的に画像に適用されます。マスクが適用された後も画像は移動できます。
マスクを編集をクリックすると、マスク自体を画像上で移動できます。反転をクリックすると、マスクされている領域が入れ替わります。マスクを適用をクリックすると、画像にマスクが再適用されます。
置き換え
置き換えオプションを使用すると、画像や写真を現在のデバイスの画像に置き換えることができます。これはトップメニューまたはクイックアクションバーからアクセスできます：
背景除去
背景除去オプションは、画像から背景を自動的に検出して除去します。現在、自動削除のみをサポートしており、カスタム消去や背景の復元はできません。
読み込みアイコンが終了するまで待つ必要があります：
完了したら、保存をクリックすると、背景が削除されます。
リンク
リンクオプションを選択すると、写真や画像をインタラクティブな要素に変換できます（主にキオスク用）。左側のナビゲーションバーでリンクオプションセクションが開きます：
リンクを追加をクリックすると、URLを入力するか、アセットを選択するように求められます：
リンクまたはアセットが選択されると、リンクオプションセクションに追加のオプションが表示されます：
スケールセクションを展開すると、アセット用のこのオプションが表示されます：
ここで、画像のスケール方法を選択します。3つのオプションがあります：
- フィット（デフォルト） - 画像を画面に合わせます。
- 引き伸ばし - 画像を画面全体を埋めるように引き伸ばします。
- ズーム - 画像をズームインして画面全体を埋めます。大画面に小さな画像を表示する場合は、ぼやける可能性があるため推奨されません。
| 注意 |
| URLが提供されている場合、スケールオプションは表示されません。 |
設定セクションを展開すると、リンク用のこれらのオプションが表示されます：
- 継続時間（秒） - リンクがクリックまたはタップされたときに、メインデザインに戻る前にリンクまたはアセットが表示される時間。これは、画面上の最後のタッチまたはリンクがクリックされた時間から始まります。
- プリロード - チェックすると、デザインの読み込み時にウェブサイトも読み込まれます。これにより、リンクがクリックされたときにウェブサイトがポップアップするまでの時間が短縮されます。ただし、多数のリンクを読み込む必要がある場合は、遅延が発生する可能性があります。
閉じる＆ナビゲーションバースタイラーセクションを展開すると、リンク用のこれらのオプションが表示されます：
このセクションは、画面にプッシュされたときに表示されるボタンを指します。このボタンをクリックまたはタップすると、元のデザインに戻ります。
- アイコン位置 - このアイコンが表示される場所を示します。デフォルトは下部中央ですが、上部または下部の任意の場所に配置したり、完全にオフにすることもできます。
- アイコンスタイル - アイコンのスタイリングを設定できます。ラベル、ソリッド、ラウンド、またはデフォルト（上記参照）から選択します。
- アイコンサイズ - アイコンのサイズを変更できます。小、中、大、またはデフォルト（上記参照）から選択します。
- アイコンカラー - デザインに合わせて、アイコンの16進HTMLカラーを変更します。
- 背景色 - デザインに合わせて、アイコン背景の16進HTMLカラーを変更します。
- 不透明度 - スライダーでアイコン背景の不透明度や透明度を変更できます。
- ナビゲーションバーを表示 - チェックすると、アイコンに小さなナビゲーション矢印が追加されます。複数のリンクを素早くナビゲートできます。次のように表示されます：
設定
設定ボタンを選択すると、サイドメニューでデータマッピングセクションが開きます：
データマッピングを作成をクリックすると、選択したテキストを動的にし、既存のデータソースの1つにマッピングできます。詳細については、OptiSyncを使用した動的データソースの記事をご覧ください。
エフェクト
エフェクトオプションを選択すると、テキストのさまざまな側面を変更できます。サイドメニューでエフェクトセクションが開きます：
ここには多数のオプションがあります。それぞれについて順番に説明します。
| 注意 |
| これらのオプションの多くは透明な背景で使用するのが最適です。そうでない場合、違いがあまり見えません。 |
カラーセクションを展開すると、写真や画像に色を追加できます。
プリセットカラー、このデザインで使用されているカラー、またはカラーピッカーから選択します。
背景セクションを展開すると、写真や画像が配置される特定の背景色を設定できます。これは、トップメニューの背景オプションと機能的に同じです。
不透明度セクションを展開すると、選択した領域（背景とテキストを一緒に）の不透明度を変更できます。
これはスライダーで調整できます。以下は半分の不透明度の例です：
アウトラインセクションを展開すると、写真や画像にアウトラインを追加できます。ドロップダウンから色を選択するか、カラーピッカーを使用し、スライダーで太さを変更できます。
シャドウセクションを展開すると、写真や画像に影を作成できます。デフォルトでは、すべてのスライダーは白になっています。
色を適用すると影が作成され、スライダーを変更することでぼかしを変更したり、X軸またはY軸に沿って影をオフセットしたりできます。
グラデーションセクションを展開すると、テキスト用のいくつかのグラデーションオプションが表示されます。これらのグラデーションオプションのいずれかをクリックすると、テキストに適用されます。
テクスチャセクションはグラデーションセクションと似ています。テキスト用のいくつかのテクスチャオプションが表示されます。これらのテクスチャオプションのいずれかをクリックすると、テキストに適用されます。
アニメーション
アニメーションボタンを選択すると、写真や画像にアニメーションを追加できます。クリックすると、サイドメニューでアニメーションエリアが開きます：
デザインにアニメーションを追加するための多数のオプションがあります。詳細については、アニメーションの記事をご覧ください。
位置
位置オプションを選択すると、サイドメニューの位置セクションが開きます。これにより、写真や画像を正確に配置したり、レイヤリングを変更したりできます。
- 最前面へ移動 - 選択した写真や画像を最上層に移動します
- 前面へ移動 - 選択した写真や画像を1つ上の層に移動します
- 最背面へ移動 - 選択した写真や画像を最下層に移動します
- 背面へ移動 - 選択した写真や画像を1つ下の層に移動します
-
ページに合わせる - 選択した写真や画像の配置を変更するオプション
- 左
- 中央
- 右
- 上
- 中間
- 下
-
均等配置 - より大きな選択範囲内で写真や画像を整列させます
- 垂直
- 水平
-
反転 - 選択した写真や画像を反転します
- 水平
- 垂直
- 位置 - デザイン内で写真や画像を特定の場所に配置できます
- サイズ変更 - 選択した写真や画像要素を正確にサイズ変更できます
- アスペクト比を維持 - チェックすると、サイズ変更時にアスペクト比が維持されます
ロック / スタイルをコピー
| 注意 |
| 「ロック」機能はPro Plusプラン以上のユーザーのみ利用可能です。 |
ロックボタンをクリックすると、選択した写真や画像がロックされ、変更できなくなります。
これは、デザイン上で多くの要素を扱う場合に便利です。
スタイルをコピーボタンを使用すると、選択した写真のスタイルを別の写真にすばやく適用できます。
これは、多数の写真をすばやくスタイリングするのに便利です。
GIPHY
サイドメニューのGIPHYオプションを使用すると、さまざまなステッカー、GIF、絵文字、アニメーションテキストオプションを選択してデザインに配置できます。
検索機能を使用すると、GIPHYから使用したいGIF、ステッカー、絵文字、またはアニメーションテキストを見つけることができます。選択すると、デザインに配置され、自動的にアニメーションします：
これらは位置ボタンを使用してさらに微調整できます。
GIFが選択されている状態でこれをクリックすると、サイドメニューで位置タブが開きます：
- 最前面へ移動 - 選択したGIFを最上層に移動します
- 前面へ移動 - 選択したGIFを1つ上の層に移動します
- 最背面へ移動 - 選択したGIFを最下層に移動します
- 背面へ移動 - 選択したGIFを1つ下の層に移動します
-
ページに合わせる - 選択したGIFの配置を変更するオプション
- 左
- 中央
- 右
- 上
- 中間
- 下
-
均等配置 - より大きなボックス内でGIFを整列させます
- 垂直
- 水平
-
反転 - 選択したGIFを反転します
- 水平
- 垂直
- 位置 - デザイン内でGIFを特定の場所に配置できます
- サイズ変更 - GIFを正確にサイズ変更できます
アスペクト比を維持 - チェックすると、サイズ変更時に自動的にアスペクト比が維持されます。
背景として使用 - チェックすると、GIFをデザインの背景として使用できます。
QRコード
サイドメニューのQRコードオプションを使用すると、任意のデザインにQRコードを追加できます。QRコードを追加をクリックすると、多数のオプションが表示されます：
選択：
- ウェブサイトURL - QRコードがスキャンされるとユーザーをウェブサイトに送ります
- メール - QRコードがスキャンされると、指定されたアドレスにメールを送信します。
- テキスト - ユーザーがQRコードをスキャンするとテキストを表示します
- 通話 - ユーザーがQRコードをスキャンすると電話をかけます
- SMS - QRコードがスキャンされると、特定の番号にテキストを送信します
- App Store - QRコードがスキャンされると、ユーザーをApple StoreまたはGoogle Playストアに送ります。
- Facebook - QRコードがスキャンされると、ユーザーをFacebookページに送ります。
- Instagram - QRコードがスキャンされると、ユーザーをInstagramページに送ります。
- X - QRコードがスキャンされると、ユーザーをXプロフィールに送ります。
- WiFi - QRコードがスキャンされると、ユーザーにWiFiネットワークへのアクセスを提供します。
- WhatsApp - QRコードがスキャンされると、WhatsAppでメッセージを送信します。
- アセット - QRコードがスキャンされたときにユーザーに表示するOptiSignsアセットを選択します。
QRコードを更新をクリックすると、QRコードのタイプを変更したり、情報を更新したりできます。
最後に、必要に応じて多数のQRコードをデザインに追加できます。
以上です！
OptiSignsは デジタルサイネージソフトウェアのリーダーです。OptiSignsについて追加の質問、懸念事項、フィードバックがある場合は、support@optisigns.comまでサポートチームにお気軽にお問い合わせください。