Empty state for learning mobile app

Empty State Overview for eLearning Mobile App: "No Courses Found"

1. Illustration:

  • Visual: A friendly, engaging illustration that resonates with the learning theme.

2. Headline:

  • Text: "No Courses Yet"
  • Style: Clear, bold, and concise. Use a font size slightly larger than the body text to draw attention 20px.

3. Call-to-Action Button:

  • Text: "Discover Courses"
  • Style:
  • Use the app’s primary color for the button background.
  • Make the button large enough to tap easily on mobile devices.
  • Add a slight shadow or rounded corners to make it visually appealing.

4. Additional Features (Optional):

  • Search Icon or Link: Include a small search icon or text link below the button, saying "Or search for specific topics" to guide users further.

Reviews

Lorem ipsum dolor sit amet consectetur. Pretium pulvinar odio aliquet condimentum suspendisse nibh vel arcu. Bibendum in imperdiet sapien quisque odio gravida. Malesuada aliquet elit egestas placerat amet. Ornare in scelerisque ut gravida amet. Tristique amet amet bibendum enim cursus. In vehicula mauris tincidunt arcu aliquam nunc. Tincidunt vitae netus ante eu et bibendum. Eget amet nibh vel est congue tellus tortor gravida nascetur. Ut vestibulum elit pulvinar netus in ante
Lorem ipsum dolor sit amet consectetur. Pretium pulvinar odio aliquet condimentum suspendisse nibh vel arcu. Bibendum in imperdiet sapien quisque odio gravida. Malesuada aliquet elit egestas placerat amet. Ornare in scelerisque ut gravida amet. Tristique amet amet bibendum enim cursus. In vehicula mauris tincidunt arcu aliquam nunc. Tincidunt vitae netus ante eu et bibendum. Eget amet nibh vel est congue tellus tortor gravida nascetur. Ut vestibulum elit pulvinar netus in ante lectus turpis auctor. Nulla purus morbi adipiscing quisque in sodales aliquet. Ultricies a elit quis metus. Aliquet cras pretium platea lacinia mi et orci volutpat vulputate. Bibendum massa fusce...

Great work, Doha! I appreciate your thoughtful choice of colors and the simplicity and cleanliness of your design. It’s evident that you’ve put in a lot of effort, and the overall result is quite appealing.

Here are a few observations and suggestions for improvement to further refine your design:

  1. Completed Tab on the Third Screen: It seems the "Completed" tab is not selected on the third screen. It would be great to ensure the correct tab is highlighted for clarity.
  2. Consistency in Terminology: I noticed that the term "course" is used instead of "courses" in some places. Changing this to "courses" throughout would maintain consistency in the application.
  3. Active State in the Navigation Bar: For the active state in the bottom navigation bar, consider using a filled icon for the active tab. This would provide a clearer visual cue for users to identify the currently selected tab.
  4. Color Consistency for the Ongoing Tab: The color used for the "Ongoing" tab appears to differ from its appearance in other parts of the application. Aligning this color across all screens will enhance consistency.
  5. Back Button and Navigation Flow: I noticed a back button at the top of the screen for the "Courses" tab. Since "Courses" is part of the bottom navigation menu, it might not require a back button, as there shouldn't be a prior screen leading to it.

Your design is already impressive, and with these small adjustments, it will be even more polished and user-friendly. Keep up the great work!

thank you for your review... I will modify them .
10
Claps
Average 3.3 by 3 people
5 claps
4 claps
3 claps
2 claps
1 claps
Create your very own Empty State Design for Education App project and get mentor feedback.
<?xml version="1.0" encoding="utf-8"?>
<?xml version="1.0" encoding="utf-8"?>