Design Language

Building Audienti, we follow some key design patterns and language.

What things are called

Design these 5 States

For each view we have, we should have a design for the following:

• Empty state - generally speaking, this will be a notification card that states there are no items in this list.

• Loading State - indicates that something is happening, usually a single spinning circle. Though, we might and likely will change this out, so this should be a component. It also can be "paragraph" looking component that is shimmering.

• Full state - the layout of the page

• Error State - The page when there was an error retrieving content.

• Offline state - we do not have access to the Internet.

Design for Mobile(ish)

We are using Bootstrap 4 and have a design for mobile philosophy. That said, if there are opportunities to make the UI more user friendly for desktop users which WILL Be the most common use case, then we should take these steps.

Use minimal number of external plugins/libraries/modules

We hope to move to a Native version of the application. Given this, we should try to NOT use too many external plugins or dependencies, as they reduce the flexibility of of the front end.