Skip to main content

Image guidelines for Cogniss Creator

Your guide to uploading images in the right dimensions and size into Cogniss Creator so that they are compatible across various devices

Raymond Gerardino avatar
Written by Raymond Gerardino
Updated over 3 weeks ago

Introduction

Editing in Cogniss Creator will require you to upload images in order to enhance your Mobile and Web app's experience for your users. For Creator, you can upload images that are in .png, .jpg, and .gif formats.

There are different image guidelines for different sections of your app:


Below are the recommended sizes and where in your Mobile or Web app these images would appear.

Home tab

  • Icon (Mobile app only)

    • Context: App icon/logo

    • Recommended size: 1024 x 1024 pixels

    • Location: Discover menu when opening your app from super app

    • You can also use this online tool to design your Icon/logo: Link

  • Web favicon (Web app only)

    • Size: 16x16 pixels

    • Location: Web browser tab

  • Header icon (Cogniss Creator)

    • Recommended size: 70x70 pixels

    • Location: Top header bar

    • Tip: Best presented as a white logo on a transparent background (.png)

  • Page Banner (Web app)

    • Recommended size : 800x300 pixels

    • Used as a header for the following web screens:

      • Sign-in / Create account

      • Forgot password

      • Password reset / update

  • App Launch Splash Screen (Mobile app only)

    • This is the screen your users will see the moment they click to open your app.

      • Recommended size: 1300x1300 pixels

      • Location: Main screen that displays app identity and leads to initial action (create an account & sign in)

      • Use the template above to ensure your images appear in the safe area and are compatible across various devices.

      • Important note: The App Splash Screen is only displayed for mobile apps with their own standalone build—specifically, your live app from the app store. It does not appear within the Community app or Super app

  • App Launch Splash Screen - About app (Mobile app only)

    • This page shows your app description.

    • Recommended image size: 540 x 180 pixels

    • Location: Mobile app splash screen > About app


Dashboard tab

  • Featured Apps widget (Super App only)

    • Recommended size: 800 x 450 pixels

    • Location: Home dashboard

    • Tips

      • Your app name should be included in the image

      • Use a minimum of font size 16 for accessibility

  • Featured Activities widget (All apps)

    • Recommended size: 800 x 450 pixels

    • Location: Home dashboard

    • Tips

      • Your Activity name should be included in the image

      • Ensure the image you use for your featured activity button, stands out from the background

      • Use a minimum of font size 16 for accessibility

  • Image Header widget (All apps)

    • Recommended size:

      • Small: 800 x 180 pixels

      • Medium: 800 x 280 pixels

      • Large: 800 x 420 pixels

    • Transparent background and .gif are supported

    • Location: Home dashboard


Style tab

  • General background (Mobile app only)

    • Recommended size: 834x1112 pixels

    • Location: Home dashboard only

    • Tips:

      • Use the template above when creating your general background image to see if it's within the safe area and to ensure it is compatible across different-sized devices.


Content tab

  • Subjects and Activity icons (All apps)

    • Recommended size: 40x40 pixels

    • .gif supported

    • Location: Explore page

  • Activity Launch Screen image (default/ small size)

    • Recommended image size: 1300 x 500 pixels

    • Safe area size: 1140 x 355 pixels

      Ensure to place your key elements (ie. text, logo, and images) inside the safe area. The safe area is the space inside the image where it will not be cropped when your image is viewed across different devices.

  • Activity Launch Screen image (large size)

    • Recommended image size: 1300 x 650 pixels

    • Safe area size: 600 x 650 pixels

      Ensure to place your key elements (ie. text, logo and images) inside the safe area. The safe area is the space inside the image where it will not be cropped when your image is viewed across different devices.

  • Content and Survey template: Image content (All apps)

    • Recommended size:

      • In-text banner: 800 x 230 pixels

      • Landscape image(3:2): 800 x 533 pixels

      • Full feature image(2:3): 800 x 1200 pixels

    • Transparent background and .gif supported

  • Content and Survey template: Multichoice and Multiselect Content Block type (All apps)

    • Recommended size: 300x300 pixels

    • Content Block type display supports:

      • ICON_SELECT

      • ICON_ONLY_SELECT

      • GRID_ICON_SELECT

      • GRID_ICON_ONLY_SELECT


Virtual goods

  • Badges, Profile Avatars and Stickers

    • Recommended image size: 300 x 300 pixels

    • Transparent background and .gif supported


Image file size

Please note that uploading large image files to Cogniss can impact loading times and the app's performance, creating a poor experience for your users.

It's always best practice to compress your files wherever possible.

For more information and links to some of our recommended tools for doing this, please see our article on File size and compression.

Did this answer your question?