【第13回 アプリ背景画像編】

 

たけやん ： こんにちは、アプリデザインチームです。みなさん、アプリの背景はどうなさっていますか？背景色をブランドイメージに合わせて設定されている場合が多いかと思いますが、実は背景には画像も設定できます！
今回は、アプリをより素敵にする背景画像の設定方法とデザイン例をご紹介します。

あかちゃん：こちらが背景画像を設定したアプリですね。スクロールによって背景とコンテンツに動きが生まれて、よりアプリらしい表現になっています！

 

たけやん：そうですよね。また単色の背景色設定と違い、お好きな画像を設定できるのでブランドの世界観もアプリ全体で表現することができます。

 

 

背景画像の設定方法

 

【STEP１】画像を用意する

 

たけやん：それでは実際に背景画像を設定してみましょう。用意する画像の推奨サイズは、縦2688px × 横1242pxです。今回はこちらの画像を用意しました。

 

 

あかちゃん：背景に画像を入れてもテキストが読みやすいように、画像に白色を重ねて加工していますね。

 

たけやん：はい。背景画像を設定しても読みやすいかどうか、実際に設定して確認してみることがポイントです。

 

 

【STEP2】「デザイン設定」で画像を入稿する

 

たけやん：では実際に画像を入稿してみましょう。

① 管理画面の「デザイン設定」画面に入ります。

② 「背景」の「背景画像」の箇所をクリックしてSTEP1で用意した画像を入稿します。

③ 「保存」をクリックで設定完了です。

 

あかちゃん：とても簡単ですね、すぐに実践できそうです。

 

たけやん：是非、色々な画像で試してみてくださいね。ここからは、背景画像の例をご紹介します。

 

 

アプリ背景画像のデザイン例

 

① 写真背景画像

 

たけやん： 先ほどご紹介した、写真を使った背景画像です。

 

あかちゃん： ブランドイメージに合わせた画像にすることで、世界観を表現することができますね。

 

 

 

② グラデーション背景画像

 

たけやん： こちらはグラデーションを使った背景画像です。

 

あかちゃん： 写真素材がない場合でも、グラデーション画像を使用するだけでアプリに奥行きが出ますね。

 

 

 

③ パターン背景画像

 

たけやん： 続いては、パターンを使った背景画像です。ストライプの他にも水玉やタイルなど、様々なバリエーションがあります。

 

あかちゃん： パターンの柄や配色によって、アプリの雰囲気を大きく変えることができますね。

 

 

 

④ ロゴ背景画像

 

たけやん： 最後は、ブランドロゴを中央に配置した背景画像です。

 

あかちゃん： 背景にロゴが表示されることで、認知度をあげたりアプリ全体のイメージを統一することが出来ますね。

 

 

 

 

 

たけやん： いかがでしたでしょうか？アプリ背景画像は、簡単な設定方法でアプリの印象を大きく変えることができます。

 

あかちゃん： 時季ごとに背景画像を更新して、季節感を演出するのもいいですね♪

ぜひ色々な背景を試してみてください！

 

デザイン設定についてはこちら＞

※ご不明点は担当のカスタマーサクセスにお問い合わせください。

 

 

それでは次回の更新をお楽しみに！