Configurable Settings

Chore Scout Configurable Settings

Manifesting Your Brand

 

ChoreScout is a white label app for financial institutions to help kids and parents have conversations around money, acquiring customers in the process.

Banks who deploy ChoreScout get to determine their own brand narrative and configure ChoreScout to convey this.

Partners call the app what they like and have it in the app stores as a unique brand identity. There are numerous graphical elements in the apps, presented below,  that can be configured to further align and manifest a brand. A headless SDK option is also available for those who want broader flexibility.

General Requirements
  • All images must be in PNG format.
  • Optional: Vector assets in SVG format for best results.
  • App name: Provide a name for both the junior and guardian apps (e.g Chore Scout Junior, ChoreScout Guardian). Moroku will use these as the name on the app and on any emails/web pages sent to the parent for managing their account.

Web & Emails

Required Assets

App Name – This should be the app name chosen for the parent app and will be shown on:

  • Emails to new parents signing up to use the app. These are only used to ensure parents sign up with a valid email address.
  • Emails to parents who wish to reset their password.

App logo: A logo for the app used to customise emails sent to to parents. This should be similar to the parent app icon

  • The image should be suitable for displaying in the user’s web browser and email client
  • If you provide us with URL here, we can link directly to this, otherwise Moroku also can also host the image in a private AWS S3 bucket

Company logo: A logo which identifies your brand/financial institution and is used to customise emails sent to to parents.

  • The image should be suitable for displaying in the user’s web browser and email client
  • If you provide us with URL here, we can link directly to this, otherwise Moroku also can also host the image in a private AWS S3 bucket

‘From’ email address – This will be used to send the confirmation/verification mail

Junior

Required Assets

App Launch Icon

  • Aspect Ratio: 1:1
  • Provide one or two PNG assets for the Junior app and Moroku will generate app icons of the sizes required for each platform (Android & iOS)
  • These icons should follow the respective OS guidelines which can be found here:
  • For best results, provide separate App launch icon assets for Android and iOS as both platforms have different design guidelines
  • Android status bar icon
    • This is only for Android
    • Image should be of 48×48 pixels.
    • It should be a white on transparent background version of the app icons.
    • They can be anything but ideally they should ideally look like the app icon of the app launching the notification. iOS uses the resized app icons for this purpose, so it is all good there. Android just requires a different colour coded version of the app icon in a smaller size.
    • Please look into the android guidelines for more details https://developer.android.com/guide/practices/ui_guidelines/icon_design_status_bar

Splash Screen

Splash Screen Image

  • This is a static image to be displayed in the centre of the screen against the chosen solid background color (see below)
  • Please provide a square launch image 4096 * 4096 to cater for the largest screens across Android and iOS and we will downsize the image as appropriate.

Optional Assets

The following assets are not required and if not supplied, the corresponding image shown in the screens to the left will be used instead.

Goal Creation

The image, below the “Proceed” button, when setting the goal name during goal creation

  • Aspect Ratio: 2:1
  • The image must be transparent so that it overlays on the background
  • Image should be at least 2160px wide, thus 2160×1080

Goal Amount

The image when setting the goal amount during goal creation. This is just the image below next button.

  • Aspect Ratio: 5:3
  • The image must be transparent so that it overlays on the background
  • Image should be at least 2160px wide, thus 2160×1080

Dashboard

The coin menu item image on the dashboard. It is a small icon on the top action bar.

  • Aspect Ratio: 1:1
  • Coin bar button icon should be at least 75×75 (if circular)
  • iOS – if not circular see https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/custom-icons/

The dragon image on the dasboard when the child does not have any chores due today.

  • Aspect Ratio: 2:1
  • The image must be transparent so that it overlays on the background
  • Image should be at least 2160px wide, thus 2160×1080

Allocation

The scout alternative image on the allocation screen. Image on top which the coin icon is displayed.

  • Aspect Ratio: 5:3
  • The allocation screen scout should be 2160 wide so (2160×1296)
  • The coin (or an alternative) must be part of this image and should be reasonably large in proportion to the coin holder alternative image so that the amount text can be overlayed on top of it (see the screen for reference).
  • The image must be transparent so that it overlays on the grey background.

The draggable coin image on the allocation screen

  • Aspect Ratio: 1:1
  • The coin icon should be at least 512×512
  • Moroku will overlay the amount on top of this image in white text

Goal Completion

The goal completion dialog image

  • Android – Aspect Ratios: 9:16, 5:8, 3:5, 3:4, 1:2 (separate images are required for each aspect ratio)
  • Ideally include an image for all types of iPhones with the correct resolutions as noted in (https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/launch-screen/).
  • In iOS the top status bar is displayed over the screen so some of the contents needs to be below the status bar height. The image itself should be fullscreen and the background will be visible through the transparent status bar.

Please leave 1/3 empty space at the bottom for the award message which says “Well done!”. Moroku will overlay this message over the image you provide us in white text.

Guardian

Required Assets

App Launch Icon

  • Aspect Ratio: 1:1
  • Provide one or two PNG assets for the Junior app and Moroku will generate app icons of the sizes required for each platform (Android & iOS)
  • These icons should follow the respective OS guidelines which can be found here:
  • For best results, provide separate App launch icon assets for Android and iOS as both platforms have different design guidelines
  • Android status bar icon
    • This is only for a Android
    • Image should be of 48×48 pixels.
    • it should be a transparent and white version of the app icons.
    • They can be anything but ideally they should ideally look like the app icon of the app launching the notification. iOS uses the resized app icons for this purpose, so it is all good there. Android just requires a different colour coded version of the app icon in a smaller size.
    • Please look into the android guidelines for more details https://developer.android.com/guide/practices/ui_guidelines/icon_design_status_bar

Guardian Splash

Splash Screen Image (Full Screen)

  • This is a static image to be displayed in the centre of the screen against the chosen solid background color.
  • Please provide a square image 4096* 4096 to cater for the largest screens across Android and iOS and we will downsidze the image as appropriate.

Registration Screens

The banner and bank logo on all steps during registration

  • Aspect Ratio: 3:1
  • Bank logo image and banner should both be 2160×720
  • The region below the bank logo is configurable according to the colour and font rules below

Dashboard when no children

Banner image at the top.

  • Aspect Ratio: 3:1
  • banner image and bank logo should both be 2160×720

App logo

  • Aspect Ratio: 1:1
  • App logo image should be 1440×1440. Optionally if not provided we can reuse the app icon for this purpose

Payment

Coin Alternative Image

  • Aspect Ratio: 1:1
  • Coin should be 512×512
  • Moroku will overlay the amount to pay the child as white text on top of the image you provide us.

Allowance Setup

Coin Alternative Image

  • Aspect Ratio: 1:1
  • Coin should be 512×512
  • Moroku will overlay the amount onto the coin image in white text

Goal Completion

The goal completion dialog image

  • Android – Aspect Ratios: 9:16, 5:8, 3:5, 3:4, 1:2 (separate images are required for each aspect ratio)
  • Ideally include an image for all types of iPhones with the correct resolutions as noted in (https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/launch-screen/).
  • Additionally, launch image with height 4096 px can help if we need to resize for supported other devices
  • In iOS the top status bar is displayed over the screen so some of the contents needs to be below the status bar height. The image itself should be fullscreen and the background will be visible through the transparent status bar.

Please leave 1/3 empty space at the bottom for the award message.

Colours and Fonts

  • A new font family can be provided which will be used as the font throughout the app. This font must have regular, bold and light variants
  • The following colours can be provided which will be used throughout the app:
    Colour Name Description Default Value
    Primary The color displayed most frequently across the app’s screens and components #1578FF
    On Primary The colour of text on the primary colour (should be optimised for legibility, usually black or white) #FFFFFF
    Secondary The secondary branding color for the app #BD9871
    On Secondary The colour of text on the secondary colour (should be optimised for legibility, usually black or white) #000000
    Background The background colour appears behind scrollable content and is the general background of the app #FDFAF7
    On Background The colour of text on the background colour (should be optimised for legibility, usually black or white) #000000
    Surface Surface colors affect surfaces of components, such as cards, sheets, and menus. #BFDAFF
    On Surface The colour of text on the surface colour (should be optimised for legibility, usually black or white) #000000
    Error Error colour indicates errors components, such as text fields. #D94A3E

Configurable settings

  • Terms and conditions URL if required
  • Customer Support contact number and support email
  • Chore Scout registration password requirements – so that the app password strength is in accordance with security standards
  • Maximum goal amount for child saving goals
  • Direct bank integration
    • API documentation for registration, create account and internal member transfers
    • Whether Two factor authentication is to be supported (Yes/No)
    • Validation requirements for Two factor authentication codes (if applicable).
  • Redi2Pay integration
    • Respective Redi2Pay bank app access and content sharing details.

Subscribe to our mailing list

 

To learn how you can make banking fun

CONTACT US TODAY!