Branding specifications

 

(The Home and Header logos are available on the Starter and Plus plans)

Recommendations, measurements are in pixels. Images can be .jpg, .jpeg, .png, or .gif.

Important: This article details measurements and specifications for building a theme in Award Force, for instructions on how to put your theme together, please see the supporting article Theme configuration guide

 

Home: Registration page
  Width (px) Height (px) System treatment
Home logo (desktop): 700 250 Does not scale, displayed at size of upload.
  Note: the header image can be designed as a banner running the full width of the screen (i.e. W:2000px), however the 'logo' etc should remain in the recommended safe area to avoid cropping on smaller screens.  
  Note: the height can be more or less than 250px, our recommendation is not greater than 250px. If the height is more, then the registration and login forms will get pushed further down the screen.     
 

To view the following image: Right click on the image and open in a new tab. AF_theme-specs_home-header_v1.jpg  

Consider a standard large monitor size is 1920 x 1080px
It's then possible for a web browser to be sized to full-screen
Therefore, to cover most large monitor sizes and therefore the potential for browsers to be fullscreen, the Home page header image, as a full-width banner, needs to be wider than the largest possible fullscreen size.

Example A: Right click on the image and open in a new tab. 

AF_Designing-Home-header-banner.jpg

Example B: Right click on the image and open in a new tab. 

AF_EXAMPLE_Home-header-banner_v1.jpg

Home logo (mobile):  300    200  
Home background image 1900  1000

This image does resize with the browser. The background image will show behind the header image.

 

Header: Entrant/Judges home page
  Width (px) Height (px) System treatment
Header logo (desktop): 300   150 Does not scale, displayed at size of upload. 
  Note: the awards program will automatically apply 30px padding to the left margin of this asset. This asset can be aligned left, centre or right.   
  Note: the height can be more or less than 150px, our recommendation is not greater than 150px. If the height is more, then other important information and the button to start an entry will get pushed further down the screen.   
       
Header logo (mobile):  300  150 Does not scale, displayed at size of upload
       
Header background image:

 1800+ 
But can depend on design

150 
But can depend on design 

This repeats on both X and Y axis, so can be a repetitive pattern, or a larger solid image designed to exact measurements (i.e. W:1800 x H:150)

  Note: If no image is used, a HEX colour can be applied to the theme area of the awards program.     

 

Footer: A single composite of sponsor logos
  Width (px) Height (px) System treatment
Footer logo (desktop): 700 up to 1000  Does not scale, displayed at size of upload.
       
Footer logo (mobile): 300 up to 1000 Does not scale, displayed at size of upload.
       
Footer background image:

1800+
But can depend on design

up to 1000
But can depend on design

This repeats on both X and Y axis, so can be a repetitive pattern, or a larger solid image designed to exact measurements (i.e. W:1800 x H:150)
  Note: If no image is used, a HEX colour can be applied to the theme area of the awards program.

 

PDF
  Width (px) Height (px) System treatment
PDF header (only): 1200 180 dpi can be set high (i.e. 180 or 300 dpi) for printing purposes.

 

Email
  Width (px) Height (px) System treatment
Email header image 580 up to 400

Displayed at size of upload, no scaling unless the height is more than 400, then it will scale down proportionally.

Email footer image  580 up to 400  

 

Favicon 
  Width (px) Height (px) System treatment
Favicon 16 16 This can be an .ico image

 

Read more about Theme configuration guide