Apple iOS App Branding and Images Apple iOS App Branding and Images
  1. Zype Help Center
  2. Archived: Zype Configured Apps
  3. iOS

Apple iOS App Branding and Images

Lauren Weis Lauren Weis

Below we’ve outlined both optional and required image assets. We've also included a checklist at the end of this article so that you can make sure to have all the necessary assets ready when you build your Apple iOS app.

Dark or Light Theme (Required)

Please choose between our standard dark theme (dark background with light text on top) OR our light theme (white background with dark text on top).

Dark Theme, Gallery Layout Light Theme, Non-Gallery Layout
Image_from_iOS__4__copy.png Screen_Shot_2017-03-13_at_9.32.15_PM.png

    

Brand Color (Required)

Please choose a brand color (hex #) that will be used sparingly throughout your app. You can expect to see this color as button states throughout the screens.

Teal brand color on Search icon

Teal brand color on Sign In button
isn-2.png isn-3.png 


Image Assets (Required)

Channel Store Icon 

  • Multiple Sizes; take advantage of this icon resizer for the App Icon images. Best results with images at 1536 x 1536px
  • Please note that this icon should NOT have a transparent background or rounded corners
  • For more information on best practices, visit iOS Interface Design Guidelines

isn-4.png 

 

Launch Screen

The launch screen, also known as splash screen, appears during app launch and is a brief placeholder that displays while the app loads content. The launch screen is replaced with the first screen once content loads. We recommend a simple, branded image for the launch screen. 


Launch Screen First Screen
isn-5.png isn.png

 

Hero Slider Images

Hero slider images, also known as top playlist images, appear at the top of the application in the Gallery Layout. You can read about how to configure these HERE.

Without Hero Slider With Hero Slider
isn-7.png isn-8.png

 

Company Logo

The company logo appears on the sign in screen if you require users to sign in to your app to gain access to content. 

  • Suggested Dimension: 756 × 582px 
isn-6.png

 

Playlist Thumbnail Images

Each of your playlists has a thumbnail associated with it in the Zype platform. These thumbnails will appear as background images in your iOS app (see image below). These are designated within the playlist thumbnail view and can be edited following guidelines HERE.
  • Apple TV Layout Disabled / Non-Gallery Layout
    • Playlist titles and right-hand side arrows will automatically populate on top of your images within your app.
  • Apple TV Layout Enabled / Gallery Layout
    • In order to enable the Apple TV / Gallery layout, navigate to Zype > Utilities > ZypeCommon.h and set "kAppAppleTVLayout" to <YES>:
      • #define kAppAppleTVLayout YES
    • In order to enable set titles on top of the playlist thumbnail images, navigate to Zype > Utilities > ZypeCommon.h and set "kAppAppleTVLayoutShowThumbnailTitle" to <YES>:
      • #define kAppAppleTVLayoutShowThumbnailTitle YES

 

Gallery Layout Disabled Gallery Layout Enabled Show Thumbnail Title Enabled
Screen_Shot_2017-03-13_at_9.32.15_PM.png isn.png Simulator_Screen_Shot_-_iPhone_7_-_2018-02-22_at_12.00.18.png

  

Playlist Thumbnail Images for Non-Gallery Layout

This is only applicable if you have the Apple TV Layout Disabled. If you would like to have specific playlist thumbnails in your iOS app that are independent of other playlist images you might have for additional endpoints (ex. Roku), you may achieve this using the Related Images section of the playlist thumbnail view.

We recommend you upload an image with a 3:1 aspect ratio. Keep in mind, the larger the pixel size of the thumbnail, the slower the load time. So we suggest approximately 1242px x 414px in dimension while maintaining a 3:1 aspect ratio. Once uploaded, title your custom image "mobile" to ensure that this playlist thumbnail appears on your mobile app(s) only.

Related_Images.png


Custom Video Thumbnail Images

Video thumbnails are automatically generated for Zype-hosted content (this is done during Zype's transcoding process). You have the option to use the auto-generated thumbnails or upload a custom thumbnail for each of your videos through the Zype platform. Custom Thumbnails give the app a polished look (see below). 

  • 16:9 ratio required
  • Suggested Dimension: 480 x 854px, JPG or PNG [minimum size: 250 x 141px]
Auto-generated Thumbnail

Custom Thumbnail
Screen_Shot_2017-03-13_at_9.51.29_PM.png

Screen_Shot_2017-03-13_at_9.51.41_PM.png

Note: You only need to add custom thumbnails to the platform once. If you’ve already added them to the video for display on another application or endpoint, you don’t need to add them again.    

Asset Checklist

Asset

Suggested Dimensions

Transparent?

Required?

App Icon

Multiple Sizes

Take advantage of this icon resizer for the App Icon images

 No

 Yes

Launch Screen Image

1125 x 2000px; JPG or PNG

 No

 Yes

Company Logo

756 x 582px, PNG

 Yes

 No

Hero Slider Images (applicable for Gallery Layout iOS template)

1740 x 700px, JPG
Max. 5 images

 No

  No

Custom Playlist Thumbnails (applicable for non-Gallery Layout iOS template)

 

1242px x 414px (maintain 3:1 aspect ratio)

 No

  No

 

 

Was this article helpful?

0 out of 0 found this helpful

Articles in this section