Empty State For Educational Platform - YouXcel

Update 18/10/2024: Added a new page in the design

Thank you all for your valuable feedback and recommendations! I've added some new screens, including a recommendations section, and made adjustments to the microcopy for better clarity. I’d love for you to check out the updates and share your thoughts when you have a moment. Your insights are greatly appreciated!

Update 16/10/2024: Aligning the wording more closely to the CTA for clarity

To address the feedback about aligning the wording for clarity, here's a revised version of the microcopy:

Check your wishlist or browse our catalog. Remember, every expert was once a beginner!

Check your wishlist or find courses in our catalog. Remember, every expert was once a beginner!

--------------------------------------------------

The goal of this project was to create an engaging and user-friendly educational platform empty state screens that motivates users to start their learning journey. The design aims to be visually appealing while ensuring ease of navigation and clarity in communication, especially in key areas like course discovery and wishlist management.

Design Inspiration: Uxcel Color Palette from Uxcel UI Kit

Color Selection:

• Primary Colors: The Uxcel color palette features vibrant and inviting colors that resonate with creativity and learning. I chose a mix of bright hues inspired by this palette to evoke a sense of enthusiasm and curiosity, which are essential for an educational platform. The primary color serves to draw attention to key features, such as call-to-action buttons (e.g., "Find Courses").
• Secondary Colors: Soft and neutral colors were selected for backgrounds and secondary elements. These colors help create a calm and focused environment, reducing visual clutter and allowing users to concentrate on their learning without distraction.

Accessibility Considerations:

I ensured that the chosen colors maintain high contrast to support readability and accessibility. This is particularly important in educational contexts where users may have varying levels of visual ability. Colors were tested against accessibility standards (WCAG guidelines) to ensure that all users can engage with the platform comfortably.

User Experience (UX) Considerations

User-Centric Design:

I conducted some research to understand the needs and preferences of learners on educational platforms using Mobbin and Uxcel project examples. Insights from this research guided the design decisions, ensuring that the features and layout align with user expectations. The focus was on creating an intuitive experience that minimizes friction and enhances engagement.

Microcopy and Messaging:

The microcopy was carefully crafted to be clear, encouraging, and motivational. It addresses users directly, fostering a sense of connection and support. For example, the empty state messages in the course and wishlist sections were designed to prompt users to take action without feeling discouraged. This approach aims to create a positive feedback loop, motivating users to explore and engage with the platform.

Navigation and Layout:

The layout was designed with a clear hierarchy to guide users through their learning journey.

Visual Design Elements

Typography:

A clean and sans-serif typeface was chosen to ensure legibility across all devices. The use of varying font sizes and weights helps establish a visual hierarchy, making it easy for users to identify key information quickly.

Imagery and icons:

Engaging imagery and icons were incorporated to create a visually stimulating environment. These elements not only enhance the aesthetic appeal but also serve functional purposes, guiding users through the platform.

As for the color, I used the Uxcel UI Kit icons that fit well with the purpose.

For the illustrations, I found some free vector graphics on Figma and Illustrations | unDraw that allowed me to change their color and create a sense of harmony and consistency.

Final Thoughts

The design of this empty state for an educational platform is a result of a thoughtful and user-centered approach, heavily influenced by the vibrant and inspiring Uxcel color palette. The combination of appealing visuals, motivational messaging, and intuitive navigation aims to create an inviting space for learners to explore, engage, and grow.

It is positioned to foster a positive learning experience that encourages users to embark on their educational journeys with confidence and enthusiasm.