Sunbird UI/UX guidelines

User Experience Design for Sunbird is based on the core principle of User Centred Design - i.e. putting the user at the centre of all the design choices, his/her needs being the only true director of choices. The core principles guiding UX/UI of Sunbird apps (sourcing, consumption or administrative apps) are listed below. This is an evolving document, which will be contributed to as the adoption of Sunbird improves. 

Anchor on the familiar

For better adoption, “+1” changes are what work best. The new capabilities added to the platform should involve only an incremental change to a users’ existing behaviours. Additionally, the metaphors and task-flows should replicate/mimic existing apps that the target user base (teachers, students, parents, administrative officials) are used to. This ensures that users don’t need to form new mental models in order to use the app.

Generalise, reuse, recycle

Since Sunbird caters to a host of use cases and actors, for every design decision, one should try to make sure that the same design can be replicated and utilized for similar use cases. There are multiple UI components (cards, grids, layouts etc.) and UX paradigms that have been tried, tested and implemented into the Sunbird reference apps. These can be reused as-is - and should be reused, unless there is a critical reason not to. 

Design for multiple languages

All interfaces of Sunbird should easily be extensible for use in multiple languages, including RTL languages. All spacing/iconography/layouts should be sensitive to providing ample room to accommodate denser and lengthier language scripts. 

Design for the masses

Most design decisions are taken assuming the evolving smartphone experience of users in developing nations, like India. To this end, advanced interactions like tap-and-hold and UI elements like kebab menus have not been implemented as the mainstream Indian user might not explore these aspects. All possible actions are made highly visible and clear.

Make icons self-evident

At scale, users’ depth/ability of visual recognition of icons is debatable (most of the current icons are created for global audiences), hence it is safer to use type (eg. ‘Library’ under the icon) with the icon to  build familiarity with the icon. 

Keep it light 

Since most of the  end users have low-end phones, that brings with it limitations of processor speed, battery life, RAM and space on the device. It is critical that the design is light, so as to work seamlessly on most low-end devices - hence animations, heavy imagery etc. should be used sparingly. 

Lesser steps, better conversion

Complex workflows require training - and for anything that is consumer facing, training is usually not possible at scale. Hence, the workflows need to be intuitive by design and have minimum no. of steps to get to completion. The best way to figure out how to build these workflows is to do user testing.

First impression is the best impression

Users are more likely to return to the service if their first experience with it is valuable. Towards that outcome, the reference apps need to be made intuitive such that first-time/inexperienced users find it easy to consume content from the service without external guidance.

Reduce cost of failure

Users are not afraid of actions, they are afraid of bad consequences. Towards this end, wherever possible, if there is some risk to the user - put in necessary friction to ensure the user understands the pending decision. For e.g. include confirmation popups when user downloads, since mobile disk space is low on the average Indian user’s phone.

Style guidelines

Mobile app design and layouts:

Portal design and layouts:

Desktop app design and layouts:

Sourcing app designs and layouts: