UI/UX
Your submission should prove that a user can understand and use the app. Do not only say what the app does. Show the screens and states that make it usable.
Pick at least 3 working screens or flows from your project. A flow can be login to dashboard, search to results, or add item to confirmation.
Each chosen screen should show the design work from this track: hierarchy, spacing, readable type, contrast, empty or error states, and clear UI copy.
0 of 7 lessons done · proved by a submitted hackathon project
Do each one yourself, then tap it to tick it off. The ticks are only a checklist for you: they are not marked or scored.
0 of 5 done
Add a small section like this to your public repo README. It helps judges, mentors, and recruiters review your work fast.
## Interface design proof
Project: Campus Lost and Found
Working screens / flows:
1. Home to item details
- Clear main action: "Report found item"
- Cards use consistent spacing and readable titles
2. Search results
- Empty state shown when no item matches
- Empty copy: "No items found. Try a different keyword or category."
3. Report item form
- Error state shown for missing photo
- Error copy: "Add a photo so others can identify the item."
Design checks:
- Main headings are larger than body text
- Buttons have visible contrast against the background
- Form labels are clear without placeholder-only text
- Screens work on mobile width
Screenshots:
- /docs/screens/home.png
- /docs/screens/search-empty.png
- /docs/screens/report-error.pngYou can ask ChatGPT, Gemini, or Claude to review your README and screenshot notes. Paste only public details. Ask it to find missing proof, vague labels, and unclear error copy.
Do not accept generic praise. Check if its suggestions match your real screens. If it mentions a screen or feature you do not have, remove it.
Many teams submit a GitHub link and a demo video, but no design proof. The reviewer then has to guess what improved.
Make it obvious. Name the 3 screens. Mention the empty and error states. Add screenshots in a docs/screens folder or include them in your README.
Do each one yourself, then tap it to tick it off. The ticks are only a checklist for you: they are not marked or scored.
0 of 5 done
Do each one yourself, then tap it to tick it off. The ticks are only a checklist for you: they are not marked or scored.
0 of 5 done
Answer the quick check to finish this lesson.