> For the complete documentation index, see [llms.txt](https://docs.studio.uzu-app.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.studio.uzu-app.com/basic-features/effect/background.md).

# 背景画像

背景画像は2025年12月より「画面デザイン」モードに組み込まれ、以下は旧編集モードとなりました。旧編集モードは徐々にサポートが終了するため、画面デザインモードへの切り替えをお願いいたします。詳細は[こちら](/basic-features/effect/screen-design.md)から。

プレイ画面の背景画像を設定できます。

### デフォルト背景

<figure><img src="https://1279302283-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgOyErfAjeKrNXFgLBxtx%2Fuploads%2Fgit-blob-d7957f03ab5a72bf4c93e0c00afb673be228cb54%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-31%2014.53.39.png?alt=media" alt=""><figcaption></figcaption></figure>

デフォルト背景は、条件付き背景が設定されてない、または条件付き背景の条件を満たしてないときに表示され続ける画像です。画像は、ドロップまたはクリックで設定できます。

デフォルト背景を設定していない作品では、カラーテーマに合わせた無地の背景が自動的に適用されます。

画像を設定すると下記のようになります。動作確認を行うと背景画像が設定されていることが確認できます。

背景画像にはカラーテーマに合わせたカラーぼかし（ライトモードなら白、ダークモードなら黒など）が自動的にかかります。ぼかしは、どのような背景画像をアップロードしてもテキストが読める濃さで設定されています。マダミスアプリとしてテキストが読めることが前提にあるため、**ぼかしをOFFにすることはできません**。

<figure><img src="https://1279302283-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgOyErfAjeKrNXFgLBxtx%2Fuploads%2Fgit-blob-4e9899e8c8d11f0793633708a03f318d2c0281f1%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-31%2015.04.30.png?alt=media" alt=""><figcaption></figcaption></figure>

<div align="left"><figure><img src="https://1279302283-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgOyErfAjeKrNXFgLBxtx%2Fuploads%2Fgit-blob-e680e86611f381a275d6d9ed1cafe4446c37f5bb%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-31%2015.05.58.png?alt=media" alt="" width="179"><figcaption></figcaption></figure></div>

### 条件付き背景

条件付き背景は、任意の条件を満たした時に表示される背景です。

「条件付き背景」の所に画像を設定すると条件が設定できるようになります。

<figure><img src="https://1279302283-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgOyErfAjeKrNXFgLBxtx%2Fuploads%2Fgit-blob-b75bf7a48282f32913cf46c80624db59b0d26634%2Fimage.png?alt=media" alt=""><figcaption></figcaption></figure>

今回は、オープニングのみ条件付き画像を表示するという設定にしました。

<figure><img src="https://1279302283-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgOyErfAjeKrNXFgLBxtx%2Fuploads%2Fgit-blob-dd3a51a6528bdfcab04838084d621092d8dbb309%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-31%2015.17.19.png?alt=media" alt=""><figcaption></figcaption></figure>

動作確認をすると、オープニングフェーズのみ画像が変わっていることがわかります。

<div><figure><img src="https://1279302283-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgOyErfAjeKrNXFgLBxtx%2Fuploads%2Fgit-blob-5524ba3e457baa3aefa179017eac94da4866acec%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-31%2015.18.44.png?alt=media" alt="" width="182"><figcaption></figcaption></figure> <figure><img src="https://1279302283-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgOyErfAjeKrNXFgLBxtx%2Fuploads%2Fgit-blob-f2f92485a8033e46e2d87415a919e6c11069543a%2F%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88%202024-01-31%2015.18.51.png?alt=media" alt="" width="176"><figcaption></figcaption></figure></div>

条件付き背景は複数設定することができますが、**優先度は左から**になります。

### 設定したタイミングで背景が変わらない？ <a href="#why-not-change" id="why-not-change"></a>

背景アップロード画面の左から順に、「背景A：フェーズ１が開始した」、「背景B：フェーズ２が開始した」という背景を設定しているとします。

フェーズ２開始時点で背景Aから背景Bに変わってほしいですが、この設定では変わりません。

フェーズ１→フェーズ２と進んだ場合、「フェーズ１が開始した」という条件はフェーズ２が開始しても満たしていることになるからです。条件は、より左にある画像が優先なので、背景Aの条件が満たされている限りずっと、背景Bには変わりません。

改善方法

* 背景Aの条件を「フェーズ１が進行中」に変える
* 背景Aの条件を「フェーズ１が開始した　かつ　フェーズ２が踏まれなかった」に変える

Tips

背景画像に設定しても、上の部分はキャラクター表示で隠れるためプレイヤーに見えることはありません。\
プレイヤーに見える部分の比率を意識することで背景画像が変な場所で切られることがなくなります。\
以下の画像にある黒い部分が隠れてしまう部分です。\
![](https://1279302283-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgOyErfAjeKrNXFgLBxtx%2Fuploads%2FO4EvLSskxzbspuaaqmiT%2Fimage.png?alt=media\&token=3ca40dca-d9b4-4ebe-ae9a-4bb6833373ff)