Express Multi Event App Graphics Guide

The PSD template folder has all of the customisation design elements in your app, including an application icon, splash pages, background images, header logos, colour palette and the event box icons. 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.

Any content within the cropping area cannot be transparent.

Asset

PSD Template File

Required Size

Format

Application Icon

Application Icon.psd

1024 Width x

1024 Height px

PNG

Favicon

Favicon is the icon that user will see in the browser tab. It’s usually the same iamge as the app icon. Please use online favicon generator to convert PNG to the proper .ico format. (eg. http://www.favicon.cc/).

Splash Pages

The splash page is the loading screen when an app is launched.

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 (1468 Width X 2750 Height px) The portrait splash page PSD contains the safe zone area. Any content that sits outside of the safe area is cropped on all devices.

Asset

PSD Template File

Required Size

Format

Portrait Splash Page

Splash_Portrait_ME.psd

2304 Width x

3072 Height px

PNG

Landscape Splash Page

Splash_Landscape_ME.psd

3072 Width x

2304 Height px

PNG

Background Images

The background images are displayed on all pages in the app, shown behind the events list. 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.

Portrait	Landscape
The QuickMobile Platform will resize the portrait background image to comply with various mobile device sizes in portrait orientation and web app platform.	This image is displayed on tablets in landscape orientation.

Asset

PSD Template File

Required Size

Format

Portrait

Background_Portrait.psd

2304 Width x

3288 Height px

PNG

Landscape

Background_Landscape.psd

3072 Width x

2304 Height px

PNG

Header Logos

The header logo is the image used at the top of the app home screen to brand the container. Please do not add any pattern or gradient as Android platform uses 9 patch images. Please read detailed information available on Android studio website regarding 9 patch images, https://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch.

Please provide us with the header logos in the dimensions listed below. We will create the necessary 9-patch images for the Android platform.

Asset	PSD Template File	Required Size	Format
iPhone	Header_logo_iPhone.psd	1242 Width x 291 Height px	PNG
Tablet (Landscape)	Header_logo_landscape_tablet.psd	3072 Width x 200 Height px	PNG
Tablet (Portrait)*	Header_logo_portrait_tablet.psd	2304 Width x 200 Height px	PNG
Android (XXHDPI)	Header_logo_xxhdpi.psd	1080 Width x 256 Height px	PNG
Android (XHDPI)	Header_logo_xhdpi.psd	642 Width x 150 Height px	PNG
Android (HDPI)	Header_logo_hdpi.psd	480 Width x 114 Height px	PNG
Android (MDPI)	Header_logo_mdpi.psd	320 Width x 74 Height px	PNG

*Web App platform uses tablet (portrait) header logo

Please include transparency with Android 9-patch header logos when saving as a PNG format

Event Box Icons

The event box icons are used to identify QuickEvent to be added, deleted, or reloaded.

Asset	PSD Template File	Required Size	Format
Add Event	Add_event.psd	90 Width x 90 Height px	PNG
Delete Event	Delete_event.psd	90 Width x 90 Height px	PNG
Reload Event	Reload_event.psd	90 Width x 90 Height px	PNG

Visual Style + Color Schemes

You can customise your app’s colour palette. See how these colors will be applied to your app below.

Transparent Visual Style

A Multi-Event App is set to transparent by default and the background image is blurred. The main customisable colour is the Bar Tint colour. All other colours will be skinned white and displayed on black semi-transparent cards.