screenroveSCREENS WORTH STUDYING
Screenrove / Design references

Duolingo Product Screens

Explore captured product screens and their navigation.

Duolingo Learn path (guest)

Learn path (guest)

Reached with Later on the create-profile prompt, still without an account. A fixed left sidebar (Learn, Leaderboards, Quests, Shop, Profile, More) with Learn active in a light-blue pill; a green unit banner (Section 1, Unit 1, Order at a café) with a Guidebook button; a winding path of round lesson nodes (the active one has a progress ring and a START tooltip, the rest are grey, with a chest and a trophy); and a right rail with course, streak, gems and hearts counters, Unlock Leaderboards, Daily Quests and a Create a profile card.

Duolingo Lesson start popover

Lesson start popover

Clicking the active node opens a green popover under it: "Order at a café", "Lesson 2 of 3" and a white START +10 XP button. The rest of the page is unchanged and not dimmed.

Duolingo Unit guidebook

Unit guidebook

"Unit 1 Guidebook" with "Explore grammar tips and key phrases for this unit", then a KEY PHRASES list of speech-bubble cards: a blue speaker icon, the Spanish phrase with dotted underlines on hint words, and the English translation in grey. The sidebar and right rail stay in place.

Duolingo Match pairs exercise

Match pairs exercise

"Select the matching pairs": two columns of five word tiles (English left, Spanish right), each with a number key badge. Two pairs are already matched and greyed out; "water" is selected in light blue, waiting for its partner. CHECK stays disabled because matching is judged per pair. Captured in the first lesson; the lesson opened from the popover starts with a different exercise.

Duolingo Correct answer feedback

Correct answer feedback

After Check on the "cat" question, the chosen gato card turns green and a light-green banner rises across the footer: a green check in a white circle, "Nice job!", Too easy / Too difficult / Report links and a green CONTINUE. The progress bar has advanced. Same exercise as the flow's first-exercise step, in its answered state.

Duolingo Incorrect answer feedback

Incorrect answer feedback

A deliberately wrong pick (agua for "dog"): the banner turns light red with a red X, "Correct solution:" and "perro", and CONTINUE turns red. The heart counter drops from 5 to 4. The same question returned later in the lesson tagged PREVIOUS MISTAKE.

Duolingo Lesson complete

Lesson complete

Duo and a character at DJ decks with a looping sparkle, a yellow "Lesson Complete!" and two stat cards with coloured header strips: TOTAL XP 15 (yellow) and GREAT! 92% (green). REVIEW LESSON and CONTINUE sit in the footer. Captured after the count-up animation finished; the sparkles loop continuously.

Duolingo Day streak

Day streak

An orange flame, a large "1" and "day streak" in orange, then a card with a Th to M week row (Thursday checked) and "But your streak will reset if you don't practice tomorrow. Watch out!". CONTINUE is blue here.