ログイン画面の変更方法

はじめに

Shell App Framework for iOS 1.1.9 および Shell App Framework for Android 1.0.8 よりゲーム開発時に起動時の

  • スプラッシュ画面 (こちらは以前からになります)
  • ログイン画面

に任意の画像を設定できるようになりました。

画像の入れ替えを行わない場合、apk ファイル、app ファイルのダウンロードが行えません。

 
また、Shell App Framework for iOS 1.1.10 より、iPhone 6 / 6 Plus 用のスプラッシュスクリーンも設定できるようになりました。

iPhone 6 / 6 Plus 用のスプラッシュスクリーンの設定は任意設定です。設定されない場合は、iPhone 6 / 6 Plus に対応していない app ファイルがダウンロードできます。

入れ替えの必要な画像ファイルの名前と対象の画面は下記のようになっています。

必要なファイル

Android

画像ファイル名画像サイズ
mobage_custom_splash.png640x960
mobage_custom_button_game_start_tablet.png920x200
mobage_custom_button_game_start.png460x100
mobage_custom_login_img_tablet.png1120x1760
mobage_custom_login_img.png560x880

iOS

画像ファイル名画像サイズ補足
Default.png320x480 
Default@2x.png640x960 
Default-568h@2x.png640x1136 
Default-375w-667h@2x.png750x1334iPhone 6 用です。設定しない場合は、iPhone 6 非対応の app ファイルがダウンロードされます。
Default-Portrait-414w-736h@3x.png1242x2208iPhone 6 Plus 用です。設定しない場合は、iPhone 6 Plus 非対応の app ファイルがダウンロードされます。
mobage_custom_button_game_start.png460x100 
mobage_custom_login_img.png560x880 

 

iPad にも対応させる場合(Universal App)

画像ファイル名画像サイズ
Default-Portrait.png768x1004
Default-Portrait@2x.png1536x2008
mobage_custom_button_game_start_tablet.png920x200
mobage_custom_login_img_tablet.png1120x1760

スプラッシュ画面(Android)

以下の画像ファイルがアプリケーション起動時に全画面表示されます。

画像ファイル

補足

mobage_custom_splash.png

縦画面アプリケション用

mobage_custom_splash_landscape.png

横画面アプリケーション用

スプラッシュ画面(iOS)

以下の画像ファイルがアプリケーション起動時に全画面表示されます。

画像ファイル

補足

Default.png

3.5インチ non Retina 用

Default@2x.png

3.5インチ Retina 用

Default-568h@2x.png

4インチ Retina 用

Default-Portrait.png

iPad(non Retina) 縦画面アプリケーション用

Default-Portrait@2x.png

iPad(Retina) 縦画面アプリケーション用

Default-375w-667h@2x.png

iPhone 6 用

Default-Portrait-414w-736h@3x.png

iPhone 6 Plus 用

 
 

ログインダイアログ

ログインダイアログに表示される画像となります。下記画像の背景とゲームスタートボタンが対象となります。

表示箇所

画像ファイル

補足

ゲームスタートボタン

mobage_custom_button_game_start.png

スマートフォン用

ゲームスタートボタン

mobage_custom_button_game_start_tablet.png

タブレット用

背景

mobage_custom_login_img.png

スマートフォン縦画面アプリケーション用

背景

mobage_custom_login_img_tablet.png

タブレット縦画面アプリケーション用

また、ダイアログ下部には規約・ボタン等を表示する為の領域を確保して頂く必要があります。
規約・ボタン等は下記、"規約・ボタン表示エリア" よりも下に表示されます。

画像ファイル

画像サイズ(px)

規約・ボタン表示エリアの開始位置

mobage_custom_login_img.png

560x880

縦490px開始

mobage_custom_login_img_tablet.png

1120x1760

縦980px開始

指定の位置からグラデーションをかける等を行い、可読性を損なわない画像を準備してください。

 

Developers Site への設定方法

【Android の場合】

『Android』タブをクリック後、『APK作成』をクリックすると、以下の様な Login Image 設定画面が表示されますので、『Login Image を編集する』ボタンをクリックします。各画像を設定できる画面が表示されますので、前述の記載に沿った画像を設定して下さい。

iOS の場合】

『iOS』タブをクリック後、『APP作成』をクリックすると、以下の様な Login Image 設定画面が表示されますので、『Login Image を編集する』ボタンをクリックします。各画像を設定できる画面が表示されますので、前述の記載に沿った画像を設定して下さい。

PREVIOUS

アプリケーションの審査と公開

NEXT

アプリケーションの公開審査に提出する