Color

  • Updated

Color is an important part of every Quickify AI learning program. We use color to convey information, create visual distinction, and establish a clear visual hierarchy within the interface. 


Background

The Quickify AI default system color palette follows best practices from the Material Design standards, for our color selection in UI/UX (user interface/user experience) design.

This approach helps promote accessibility, consistency, usability, and a harmonious design across the interface, ultimately contributing to a better user experience. 

Material Design is a design system built and supported by Google designers and developers that includes in-depth UX guidance and UI component implementations for Android, Flutter, and the Web.


Quickify AI Color Palette

Quickify AI uses primary colors and varying tones that have been chosen to add variety to the color palette, but also prompt specific user interaction. 

course-color-palette-quickify-ai.png


Accessibility

Quickify AI uses color combinations that ensure readability and usability for all users, including those with visual impairments. Default system colors support compliance with accessibility standards.

For accessibility reasons, the system colors can not be changed.


Usability

Our color palette emphasizes responsiveness and adaptability to various screen sizes and devices, including:

  • Desktop
  • Laptop
  • Tablet
  • Mobile

By implementing Material Design standards, Quickify AI allows you to create a multi-platform learning program for anyone on any device. 


Layout

We use different light tones to define the layout in our interface. Users can clearly see each section and know where to focus on each piece of information.

interface-color-contrast-quickify-ai.png


User Interaction

Items that require a user to click or tap, like buttons and answers, have the same blue for consistency. Interactions that require a click and drag action are a darker shade of blue.

Screenshot (3280).png
Action - Click or Tap 

drag-action-quickify-ai.png
Action - Click and Drag


User Feedback

In an activity, correct answers will turn green, while incorrect answers will be red, giving clear and instant feedback to your user.

multiple-choice-correct-quickify-ai.png
Correct Answer - Green

incorrect-answer-quickify-ai.png
Incorrect Answer - Red

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request

Comments

0 comments

Article is closed for comments.