この記事では、Designerアプリを使用してデザインに追加できるさまざまなウィジェットについて説明します。
Designerを使用すると、ウィジェットを追加してデザインをよりダイナミックにできます。 ウィジェットは、他のアプリを含むさまざまなソースからの複雑なコンテンツを表示し、デザインに比類のないカスタマイズを可能にします。
Designerアプリの一般的な情報については、Designerの使い方 ガイドを参照してください。
ウィジェット タブには、Designerサイドメニューからアクセスできます。
ウィジェットはデザインの上に重ねて表示され、レイヤー化できません。
任意のウィジェットをクリックすると、設定 と 位置 オプションが表示されます。
設定 ではウィジェットごとに異なるオプションが表示されます。 位置 ではウィジェットの位置を設定できます。
以下では、このタブ内のすべてのオプションと、それらをデザインに追加する方法について説明します。
オーバーレイ画像
オーバーレイ画像 では、アカウントからアセットを選択するか、ファイルをアップロードして、デザインの残りの部分の上に配置できます。 これらには、サポートされているすべての画像タイプが含まれます。
設定 をクリックすると、書式設定オプションサイドメニューが開きます。
- スケール - 画像の拡大縮小には、「フィット」、「ズーム」、「ストレッチ」から選択します。
- ソース - オーバーレイ画像のソースを変更します。 デフォルトでは、これは選択した初期アセットです。
位置 オプションをクリックすると、画像のレイヤーを変更して背景として設定できます。
- 前面に移動 - 選択した図形または要素を最前面に移動します
- 前方に移動 - 選択した図形または要素を1つ上のレイヤーに移動します
- 背面に移動 - 選択した図形または要素を最背面に移動します
- 後方に移動 - 選択した図形または要素を1つ下のレイヤーに移動します
-
ページに合わせる - 選択した図形または要素の配置を変更するオプション
- 左
- 中央
- 右
- 上
- 中央
- 下
-
均等に配置 - 大きなボックス内で図形または要素を整列します
- 縦
- 横
-
反転 - 選択した図形または要素を反転します
- 水平
- 垂直
- 位置 - デザイン内で図形または要素を特定の位置に配置できます
- サイズ変更 - 選択した図形または要素のサイズを正確に変更できます
アスペクト比を維持 - チェックすると、サイズを変更するときにアスペクト比が自動的に維持されます。
背景として使用 - チェックすると、オーバーレイ画像をデザインの背景として使用できます。
ビデオ
ビデオ では、アセットからビデオを選択するか、ファイルをアップロードして、デザインに配置できます。 これらには、サポートされているすべてのビデオファイルタイプ、Canvaビデオなどが含まれます。
| 注意 |
| 書式設定オプションメニューは、アセットによって多少異なる場合があります。たとえば、Canvaの書式は少し異なります。 |
位置 オプションをクリックすると、ビデオのレイヤーを変更して背景として設定できます。
- 前面に移動 - 選択したビデオを最前面に移動します
- 前方に移動 - 選択したビデオを1つ上のレイヤーに移動します
- 背面に移動 - 選択したビデオを最背面に移動します
- 後方に移動 - 選択したビデオを1つ下のレイヤーに移動します
-
ページに合わせる - 選択したビデオの配置を変更するオプション
- 左
- 中央
- 右
- 上
- 中央
- 下
-
均等に配置 - 大きなボックス内でビデオを整列します
- 縦
- 横
-
反転 - 選択したビデオを反転します
- 水平
- 垂直
- 位置 - デザイン内でビデオを特定の位置に配置できます
- サイズ変更 - ビデオのサイズを正確に変更できます
アスペクト比を維持 - チェックすると、サイズを変更するときにアスペクト比が自動的に維持されます。
背景として使用 - チェックすると、ビデオをデザインの背景として使用できます。
ドキュメント
ドキュメント では、アセットからドキュメントを選択して、デザインに配置できます。 これらには、WordやGoogle Docs、プレゼンテーション、Canva、ExcelやGoogle Sheets、PDFなどが含まれます。
アプリ
アプリ では、作成したアプリをアセットからデザインに配置できます。 これらには、Webサイトアプリ、データ可視化アプリ、ソーシャルメディアアプリなどが含まれます。
ソース - 選択したアプリのソースを表示し、置き換えることができます。
フォーマット - アプリを編集 をクリックすると、編集画面が表示され、Designer内からアプリの詳細を変更できます。
プレイリスト
プレイリスト では、作成
この記事では、デザイナーアプリを使用してデザインに追加できるさまざまなウィジェットについて説明します。
デザイナーを使用すると、ウィジェットを追加してデザインをより動的にすることができます。ウィジェットは、他のアプリを含むさまざまなソースから複雑なコンテンツを表示し、デザインの比類のないカスタマイズを可能にします。
デザイナーアプリの一般的な情報については、デザイナー入門ガイドを参照してください。
ウィジェット タブは、デザイナーのサイドメニューからアクセスできます:
ウィジェットはデザインの上に重ねられ、レイヤー化できません。
ウィジェットをクリックすると、設定 と位置 のオプションが表示されます:
設定 をクリックすると、ウィジェットによって異なるオプションが表示されます。位置 では、ウィジェットの位置を設定できます。
以下では、このタブ内のすべてのオプションとデザインへの追加方法について説明します。
オーバーレイ画像
オーバーレイ画像 では、アカウントからアセットを選択するか、ファイルをアップロードしてデザインの残りの部分の上に配置できます。これには、サポートされているすべての画像タイプが含まれます。
設定 をクリックすると、フォーマットオプションのサイドメニューが開きます。
- スケール - 画像のスケーリングには、フィット、ズーム、ストレッチから選択します。
- ソース - オーバーレイ画像のソースを変更します。デフォルトでは、最初に選択したアセットになります。
位置 オプションをクリックすると、画像のレイヤーを変更し、背景として設定できます。
- 最前面に移動 - 選択した図形または要素を最上位レイヤーに移動します
- 前面に移動 - 選択した図形または要素を1つ上のレイヤーに移動します
- 最背面に移動 - 選択した図形または要素を最下位レイヤーに移動します
- 背面に移動 - 選択した図形または要素を1つ下のレイヤーに移動します
-
ページに合わせる - 選択した図形または要素の配置を変更するオプション
- 左揃え
- 中央揃え
- 右揃え
- 上揃え
- 中央揃え
- 下揃え
-
均等に配置 - 図形または要素を大きなボックス内に配置する
- 縦方向
- 横方向
-
反転 - 選択した図形または要素を反転する
- 左右反転
- 上下反転
- 位置 - デザイン内の図形または要素の特定の配置を可能にします
- サイズ変更 - 選択した図形または要素の正確なサイズ変更を可能にします
アスペクト比を維持 - チェックを入れると、サイズ変更時にアスペクト比が自動的に維持されます。
背景として使用 - チェックを入れると、オーバーレイ画像をデザインの背景として使用できます。
動画
動画 では、アセットからデザインに配置する動画を選択したり、ファイルをアップロードしたりできます。これには、サポートされているすべての動画ファイルタイプ、Canvaの動画などが含まれます。
| 注意 |
| フォーマットオプションメニューは、アセットによって多少異なる場合があります。例えば、Canvaのフォーマットは少し異なります。 |
位置 オプションをクリックすると、動画のレイヤーを変更し、背景として設定できます。
- 最前面に移動 - 選択した動画を最上位レイヤーに移動します
- 前面に移動 - 選択した動画を1つ上のレイヤーに移動します
- 最背面に移動 - 選択した動画を最下位レイヤーに移動します
- 背面に移動 - 選択した動画を1つ下のレイヤーに移動します
-
ページに合わせる - 選択した動画の配置を変更するオプション
- 左揃え
- 中央揃え
- 右揃え
- 上揃え
- 中央揃え
- 下揃え
-
均等に配置 - 動画を大きなボックス内に配置する
- 縦方向
- 横方向
-
反転 - 選択した動画を反転する
- 左右反転
- 上下反転
- 位置 - デザイン内の動画の特定の配置を可能にします
- サイズ変更 - 動画の正確なサイズ変更を可能にします
アスペクト比を維持 - チェックを入れると、サイズ変更時にアスペクト比が自動的に維持されます。
背景として使用 - チェックを入れると、動画をデザインの背景として使用できます。
ドキュメント
ドキュメント では、アセットからデザインに配置するドキュメントを選択できます。これには、WordやGoogle ドキュメント、プレゼンテーション、Canva、ExcelやGoogleスプレッドシートなどが含まれます。
アプリ
アプリ では、アセットから作成したアプリをデザインに配置できます。これには、ウェブサイトアプリ、データ視覚化アプリ、ソーシャルメディアアプリなどが含まれます。
ソース - 選択したアプリのソースを表示し、置き換えることができます。
フォーマット - アプリを編集 をクリックすると、編集画面が表示され、デザイナー内からアプリの詳細を変更できます。
プレイリスト
プレイリスト
プレイリストでは、作成済みのプレイリストをデザインに配置できます。
プレイリストを選択し、設定ボタンをクリックすると、書式設定オプションサイドメニューが表示されます。
ソース- 現在選択されているプレイリストのソースを表示し、それを置き換えることができます。
書式
- 再生コントロール - チェックすると、選択したプレイリストの再生コントロールが有効になります。以下のオプションを表示するには、チェックする必要があります。
- ナビゲーションバーを表示- プレイリストのナビゲーションバーの表示/非表示を切り替えます。これにより、プレイリストの画像やアイテム間を移動できます。
- 背景色- ナビゲーションバーの背景色を設定します。
- 不透明度- ナビゲーションバーの不透明度を設定します。
- アイコン位置- ナビゲーションバーの位置を設定します。
位置オプションをクリックすると、ビデオのレイヤー順を変更し、背景として設定できます。
- 前面に移動- 選択したプレイリストを最前面のレイヤーに移動します
- 前方に移動- 選択したプレイリストを1つ上のレイヤーに移動します
- 背面に移動- 選択したプレイリストを最背面のレイヤーに移動します
- 後方に移動- 選択したプレイリストを1つ下のレイヤーに移動します
-
ページに合わせる - 選択したプレイリストの配置を変更するオプション
- 左
- 中央
- 右
- 上
- 中央
- 下
-
均等配置 - 大きなボックス内でプレイリストを配置します
- 垂直方向
- 水平方向
-
反転 - 選択したプレイリストを反転します
- 水平方向
- 垂直方向
- 位置 - デザイン内でのプレイリストの特定の配置を許可します
- サイズ変更 - プレイリストのサイズを正確に変更できます
縦横比を維持- チェックすると、サイズ変更時に自動的に縦横比を維持します。
背景として使用- チェックすると、プレイリストをデザインの背景として使用できます。
詳細については、プレイリストの作成と使用方法の記事をご覧ください。
時刻
時刻ウィジェットは、デザインに時計を配置します。
選択した状態で設定ボタンを押すと、以下のオプションが表示されます:
- タイプ- デジタルとアナログの時計スタイルから選択します。
- スタイル- ベーシックとクロックバーのスタイルから選択します。
- 24時間表示- チェックすると、24時間表示の時計に変更されます。
- 日付を表示- チェックすると、日付も表示されます。
- タイムゾーン- 時計に表示するタイムゾーンを選択します（デフォルトはデバイスの既存のタイムゾーン）。
- テキストの変形- 大文字、小文字、文章のケーステキストスタイルを切り替えます。
- フォントサイズ- カスタムのフォントサイズを選択します。
- フォント名- カスタムのフォントを選択します。
- テキストの色- テキストの色を選択します。プリセットカラー、このデザインですでに使用されている色、カラーピッカーから選択します。
- 背景色- 背景の色を選択します。プリセットカラー、このデザインですでに使用されている色、カラーピッカーから選択します。
- 不透明度- 背景色の不透明度を変更します。
天気
天気ウィジェットは、デザインに天気予報を配置します。
選択した状態で設定オプションをクリックすると、以下のオプションが表示されます:
- デバイス設定の位置情報を使用- チェックすると、ウィジェットはデバイス設定の位置情報を使用して、関連する天気情報を取得します。
- 位置情報- 天気を表示する位置を設定します。デバイス設定の位置情報を使用がチェックされている場合、これはデバイスの位置情報が利用できない場合のフォールバックとして使用されます。
- 温度単位- 華氏と摂氏の温度単位を選択します
- スタイル- デフォルト、プレーン、カラーのアイコンスタイルから選択します。
- 言語- 天気アプリを表示する言語を選択します。
- テキストの変形- 大文字、小文字、文章のケーステキストスタイルを切り替えます。
- フォントサイズ- カスタムのフォントサイズを選択します。
- フォント名- カスタムのフォントを選択します。
- テキストの色- テキストの色を選択します。プリセットカラー、このデザインですでに使用されている色、カラーピッカーから選択します。
天気ウィジェットは動的に更新され、選択した場所の正確な天気情報を常に提供します。
日付
日付ウィジェットは、デザインに日付を配置します。これは時間の経過とともに自動的に更新されます。
選択した状態で設定ボタンをクリックすると、以下のオプションが表示されます:
- タイムゾーン- 日付のタイムゾーンを設定します。デフォルトでは、デバイスのタイムゾーンが使用されます。
- フォーマット- 日付の書式を変更します。
- テキストの変形- 大文字、小文字、文章のケーステキストスタイルを切り替えます。
- フォントサイズ- カスタムのフォントサイズを選択します。
- フォント名- カスタムのフォントを選択します。
- テキストの色- テキストの色を選択します。プリセットカラー、このデザインですでに使用されている色、カラーピッカーから選択します。
- 背景色- 背景の色を選択します。プリセットカラー、このデザインですでに使用されている色、カラーピッカーから選択します。
- 不透明度- 背景色と日付のテキストの不透明度を変更します。
- 言語- 日付アプリを表示する言語を選択します。
スクロールテキスト
スクロールテキストは、デザインに水平方向にスクロールするテキストを挿入します。テキストの内容や書式を変更するには、テキストを選択して設定をクリックします:
内容
- ここにテキストの内容を入力します。
書式
- 方向- 横向きを維持するか、テキストを90度または270度回転します。
- スクロール方向- 左または右へのスクロールを選択します。