Configuring App Images and Icons in MemberPress App

Custom logos, splash screens, and icons enhance brand identity and user experience within mobile applications. MemberPress App supports image customization for home screens, login pages, app icons, and launch screens. This document explains recommended image specifications, branding guidelines, and configuration steps for all visual assets.

Understanding App Visual Assets

Visual assets create branded experiences across iOS and Android platforms. Different asset types serve specific purposes, including navigation branding, authentication screens, launch animations, and device home screen icons. Proper asset configuration ensures consistent branding throughout member interactions with the app.

Recommended Image Specifications

Different visual elements require specific dimensions and formats for optimal display.

Element	Size (pixels)	Format
Home Screen Logo	1200 × 180	PNG or PSD
Login Logo	1200 × 774	PNG or PSD
Login Background	2732 × 2732	PNG or PSD
Registration Background	2732 × 2732	PNG or PSD
Launch Screen Background	2732 × 2732	PNG or PSD
iOS App Icon	1024 × 1024	PNG
Android App Icon	1024 × 1024	PNG
Android Adaptive Icon	1024 × 1024	PNG
Android Notification Icon	256 × 256	PNG

Remarque : All images should use PNG format with 32-bit color depth and sRGB color space for consistent display across devices.

Understanding App Icon Requirements

Standard MemberPress App Icon (iOS and Android)

• Size: 1024 × 1024 px
  
• Safe Zone: 682 × 682 px center
  
• Format: PNG (32-bit), sRGB
  
• iOS: No transparency
  
• Android: Transparency allowed

Android Adaptive Icon

Required on Android 8+ for shape flexibility and parallax.

• Foreground: Transparent logo, 1024 × 1024 px
  
• Contexte: Opaque image, 1024 × 1024 px
  
• Safe Zone: 683 × 683 px center (170 px margin)

Launch / Splash Screen

Displayed instantly on the MemberPress App startup.

• Size: 2732 × 2732 px
  
• Safe Zone: 1200 × 2732 px center
  
• Format: PNG (32-bit), sRGB

Login Screen

• Logo: Max 200 × 150 px within background
  
• Contexte: 2732 × 2732 px
  
• Format: PNG (32-bit), sRGB

Accessing Branding Settings

All image and icon configuration occurs within the branding settings interface.

1. Naviguez jusqu'à Dashboard > MP App > Branding > Images.

2. Verify all configuration sections appear:
   • Home Screen for navigation logo;
   • Login Screens for authentication branding;
   • Register Screens for registration branding;
   • Launch Screen for splash screen configuration;
   • App Icons for home screen icons;
   • Android Adaptive Icons for adaptive icon layers;
   • Notification Icon for the notification tray display.

Remarque : All sections must be configured before submitting the app to app stores.

Configuring Home Screen Logo

The home screen logo displays in app navigation headers.

1. Naviguez jusqu'à Dashboard > MP App > Branding > Images.
   
2. Localiser le Home Screen section.
   
3. Cliquez sur Upload Image.

4. Select the logo file from the device or media library.
   
5. Resize the image using the cropping tool if needed.

6. Cliquez sur Fin to complete the upload.
   
7. Review the logo in iOS and Android preview mockups.

The home screen logo appears consistently across all app pages in the navigation header.

Configuring Login Screen Assets

Login screen assets include the logo and background images for authentication pages.

1. Naviguez jusqu'à Dashboard > MP App > Branding > Images.
   
2. Localiser le Login Screens section.
   
3. Cliquez sur Upload Image next to the Login Logo.

4. Select the logo file and click Fin after any adjustments.
   
5. Cliquez sur Upload Image.
   
6. Select the background file and click Fin after adjustments.
   
7. Toggle between the Connexion et Forgot Password page previews.

Login assets display on authentication pages, including login, forgot password, and password reset screens.

Configuring Registration Screen Assets

Registration screen assets include background images for account creation pages.

1. Naviguez jusqu'à Dashboard > MP App > Branding > Images.
   
2. Localiser le Register Screens section.
   
3. Cliquez sur Upload Images.

4. Select the background file and click Fin after adjustments.
   
5. Review the background in the registration page preview.

Using the same image for login and registration backgrounds creates consistent authentication branding.

Configuring Launch Screen Assets

Launch screen assets display during app initialization before content loads.

1. Naviguez jusqu'à Dashboard > MP App > Branding > Images.
   
2. Localiser le Launch Screen section.
   
3. Cliquez sur Upload Image.
   
4. Select the background file.
   
5. Vérifier le Show Spinner checkbox to enable the loading animation.
   
6. Sélectionner Spinner Color using the color picker.

7. Review the animated preview showing spinner behavior.

Remarque : Spinner color should contrast strongly with the background color for clear visibility during loading.

Configuring App Icons

App icons display on device home screens and in app stores.

1. Naviguez jusqu'à Dashboard > MP App > Branding > Images.
   
2. Localiser le App Icons section.
   
3. Cliquez sur Upload Image.
   
4. Cliquez sur le bouton Upload Image next to the Android App Icon.

5. Resize if needed and click Fin.
   
6. Review icons in iPhone and Android device mockups.

Separate iOS and Android icons allow platform-specific transparency handling.

Configuring Android Adaptive Icons

Android adaptive icons provide foreground and background layers for flexible display.

1. Naviguez jusqu'à Dashboard > MP App > Branding > Images.
   
2. Localiser le Android Adaptive Icon section.
   
3. Cliquez sur Upload Image.

4. Cliquez sur Fin after any adjustments.
   
5. Review the adaptive icon preview showing layer behavior.

Remarque : Adaptive icons appear only on Android 8 and later devices. Earlier Android versions display the standard Android app icon.

Configuring Android Notification Icon

Notification icons display in the Android notification tray.

1. Naviguez jusqu'à Dashboard > MP App > Branding > Images.
   
2. Localiser le Notification Icon section.
   
3. Cliquez sur Upload Image.

4. Cliquez sur Fin after any adjustments.
   
5. Review the icon in the notification tray preview.

Notification icons should use simple, recognizable designs visible at small sizes.

Saving Configuration Changes

All image and icon uploads must be saved before taking effect.

1. Scroll to the bottom of the Dashboard > MP App > Branding > Images page.
   
2. Cliquez sur Enregistrer les modifications.

3. Wait for the confirmation message indicating successful save.

Remarque : Navigating away from the page without saving causes all unsaved uploads to be lost. Changes must be explicitly saved to persist.