Single Event App Graphics Guide

sea1


The PSD template folder has all of the customizable design elements in your app, including splash pages, background images, logo, colour palette and the component icon set. 

Download the templates from the link below.




Application Icon

This icon is used as the launch icon on the device’s home screen. Users select this icon when they wish to open the application.

Asset PSD Template File Required Size Format
Application Icon Application Icon.psd

1024 Width x

1024 Height px

PNG

  1. After logging into the App Manager and opening your event, click Manage Event to open the Manage Event page.
  2. In the Manage Event page, click Brand to open the Brand page.
  3. Expand the Application Icon section and define the app's icon.
    • The icon used to open the Single Event app. The image must be a .png image 1024 x 1024 pixels in size. To define the image, click the Select an image button and use the file browser to select an appropriate image.
  4. Click Save.




Splash Pages

Asset PSD Template File Required Size Format
Portrait Splash Page Splash Portrait(mobile&tablet).psd

1536 Width x

2192 Height px

PNG
Landscape Splash Page Splash Landscape(tablet).psd

2048 Width x

1536 Height px

PNG

 

Landscape Splash Page

The landscape splash page is displayed only on tablets when the app is opened in landscape orientation.

Portrait Splash Page

The portrait splash page is displayed on different resolutions of iPhone, Android and tablets while in portrait orientation.

* Safe Area (970 Width X 1840 Height px)

The portrait splash page PSD contains the safe zone area. Any content that sits outside of the safe area is cropped.

* “Powered by Lumi“

The “Powered by Lumi” text should be placed as it is displayed on the provided PSD template.

sea2-1




Background Images

The background images are displayed on all pages in the app. We recommend not adding logos or text to the background images as they are supporting graphics and they are likely to interfere with the content of the app.

Asset PSD Template File Required Size Format

Portrait (Mobile)

bg_portrait_mobile.psd

707 Width x

1096 Height px

JPG, PNG
Portrait (Tablet) bg_portrait_tablet.psd

1080 Width x

1920 Height px

JPG, PNG
Landscape (Tablet) bg_landscape_tablet.psd

1600 Width x

1920 Height px

 JPG, PNG



Event Logo

The event logo is the image used at the top of the navigation menu as well as at the top of the Activity Feed feature to identify the event.

Asset PSD Template File Required Size Format
Event Logo event_logo.psd

640 Width x

200 Height px

PNG



Icons

The component icons are used to identify each feature within the app. We will color treat the existing default icon set if no custom icons are provided.

Asset PSD Template File Required Size Format
Component Icon icon_main{component name}.psd

200 Width x

200 Height px

PNG



Visual Style

Your Single-Event app will utilise one of the following two styles: Transparent or Opaque.

Select Transparent to make text boxes semi-transparent, revealing the Background Image beneath, or Opaque for opaque text boxes with the Background Image showing around the sides.

Transparent Opaque
The background image is blurred.  The background image is not blurred. 
Not all colours are fully customisable on mobile devices and tablet; the titles, sub titles, and body text on the listing and the detail page will be skinned white and displayed on semi transparent black cards Full control over the colour palette in this mode. All colours will be pulled from the colour palette chosen on the QP


sea3         sea3

 

Color Schemes (Transparent Visual Style)

You can customize your app’s color palette. See below for an example of how your color selections will be applied in “Transparent” visual style. Not all colors are fully customizable on mobile devices and tablet: the titles, sub titles, and body text on the listing and the detail page will be skinned white and displayed on semi-transparent black cards. However, selecting “Transparent” visual style

sea5sea6

 

 

Colour Schemes (Opaque Visual Style) 

You can customize your app’s color palette. See below for an example of how your color selections will be applied in “Opaque” visual style.

 

sea7

sea8

 

Event App  by Lumi dark

Reveiwed and Approved by Product Team