x
Menu

Mobile apps

Guidelines on how to maintain the Peel Region brand when developing mobile apps.

Developing apps

Apps may need to be built for the different platforms like iOS, iPadOS, watchOS, Wear OS, and Android. They should be optimized for smartphones and tablet and, must be determined if they should also render in landscape or be locked in portrait mode on devices.

Considerations include:
  • Data security and privacy
  • Reginstration authentication
  • Maintenance and updates
  • Technical support
  • Type of app (native, web, hybrid)
  • Webpages which trigger the app

Use Peel Region branding for header, logo, fonts and colour.

Native app

Native apps are apps developed specifically for one platform or operating system, using the development tools and language that the platform supports. For example, you might use Swift or Objective-C for iOS and Kotlin or Java for Android apps. Examples of native apps:

  • Instagram
  • Google Maps
  • Spotify

Web app

A native app is a website that is designed to look and feel like a native app but is accessed through a web browser, such as Chrome or Safari, on a mobile device. A web app is built using web technologies like HTML5, CSS, and JavaScript. Examples of web apps:

  • Google Docs
  • Trello
  • Canva.

Hybrid app

A hybrid app is a blend of native and web apps. A hybrid app is built using web technologies (like HTML, CSS, and JavaScript that you may use for a web app) and then wrapped in a native container using platforms like Cordova or React Native. This approach allows a hybrid app to be installed like a native app but still use web app technologies. Examples of hybrid apps:

  • Evernote
  • Uber

Splash and login screen

When the app is opened, it will feature a branded animated splash screen, followed by the login panel with sign-in and registration options.

intro spalsh

Sign-up

The sign-up process should be quick and simple. Do not make the user fill out lengthy forms. Any additional information required may be collected once the user has signed in.

This should be a 2-step process. Once the user enters their e-mail, send a confirmation to that email with a link to complete the registration.

If user enters an unrecognised email, take them to the sign-up page. Present them with an appropriate message, with the option to sign up.

Users should be given an alternative to email for sign in such as their social media accounts. The app should remember the sign in method until the user signs out.

Allow the use of Face ID.

Password recovery

Ask the user to enter their email address. A "reset" password link should be then sent to the registered email.

Privacy and support

Include a link to the terms of use and Privacy policy on login screen.

Home screen

The home screen will have a hero image and tiles for each of the services available through the app.

Scroll

Bottom navigation

The example presented is intended for conceptual purposes only. Actual app elements and specifications will depend on the platform and the function being performed at the time.

Bottom navigation

The example presented is intended for conceptual purposes only. Actual app elements and specifications will depend on the platform and the function being performed at the time.

Disclaimer: Technical sepcifications such as (but not limited to) icon properties, margins, spacing, and item sizing will need to meet each platforms specifications.