Codify - Empty State Design
I've designed this empty state design for an app called "CODIFY" where the users earn points for completing coding quizzes and challenges.
Reviews
3 reviews
It looks good that you've provided guidance on the screen and a button for the primary action that users can take. This helps them understand their next steps.
Here are a few ideas to make the design even more intuitive:
- Page Title: Consider using a title that clearly conveys the message, such as "No Challenges Yet" or "Start New Challenge." This might enhance clarity.
- Copy Tone: Words like "Oops" can sometimes confuse users, as they may imply an error. Aim for words that evoke positive emotions and encourage users to take action.
- Navigation Icons: Ensure the icons are of uniform proportions, and consider slightly increasing the size of the supporting text.
Great work, Marek! The visuals are appealing, and the CTA clearly guides users on what to do next. To make it even stronger, consider refining the copy to be more positive and action-oriented, standardizing icon styles, and adjusting text alignment and spacing for a cleaner layout. Overall, it’s a solid and engaging empty state design. 🚀
You've done a great job with the visuals (illustration, color palette, typography). Providing an action button is also a great practice. And I have a few more suggestions to make the design even better:
- Overall white space can be adjusted - the padding around the text for example.
- Icons - the icons currently seem to have different styles, some have rounded corners other have square corners. It's best to keep a consistent style for each icon set.
- In my opinion, the body text being left aligned doesn't work too well here. The title is the same length as the button and you can't tell if it is centered or left aligned, so it looks confusing with the body text being left aligned.
- The copy text can also be improved - aim for simple, clear and short text.
But well done!
You might also like

Fundraising Website

Mobile onboarding flow

NEWFASHON™ - Landing page

HR Management App

Docto
