Pip
Designüberblick
Pip hilft Berufstätigen mit täglich zehnminütigen Minispielen beim Englischüben, mit gewundenem Lernpfad, Antwortfeedback und Lektionsergebnissen. Ein leuchtend gelber Vogel, abgerundete schwere Schrift und dicke schwarz umrissene Schaltflächen prägen die spielerische Oberfläche, während Mint Abschluss und Belohnungen kennzeichnet.
Prompt
Produkt: Pip, eine App, die Berufstätigen mit Minispielen zehn Minuten täglich Englisch vermittelt. Ihr Maskottchen ist ein ausdrucksstarker kleiner Vogel, gezeichnet in SVG mit drei bis vier Ausdrücken.
Gib ihr eine starke Persönlichkeit wie Duolingo: gesättigte Markenfarben, klobige dreidimensionale Schaltflächen, die beim Drücken einsinken, abgerundete schwere Schrift und übertriebenes, aber klares Feedback. Entwickle einen eigenen Ansatz, statt Duolingos Grün und Eule zu kopieren.
Entwirf drei zentrale Bildschirme:
- Lernpfad: eine gewundene Route aus Levels mit klar unterscheidbaren abgeschlossenen, aktuellen und gesperrten Levels. Zeige Streak, Erfahrungspunkte und Leben oben.
- Frage: eine Lückenaufgabe mit Wortauswahl oder eine Aufgabe zum Hören und Bildauswählen, mit Feedback nach einer richtigen Antwort.
- Lektion abgeschlossen: eine Ergebnisseite mit Erfahrungspunkten, Streak, Genauigkeit und feierndem Maskottchen.
Mach eine richtige Antwort einprägsam: Schaltfläche, Animationen mit Klangwirkung und Reaktion des Maskottchens sollen Lust auf die nächste Frage machen. Das soll in Screenshots erkennbar sein.
Entwirf die App-Bildschirme mit 390×844. Liefere `index.html` und `screens.html` mit den drei Bildschirmen nebeneinander.
Chinesischen Originalprompt ansehen
产品：「Pip」，一个用小游戏学英语的 App，面向上班族，每天 10 分钟。有一个吉祥物：一只会做表情的小鸟（用 SVG 画，有 3–4 种表情）。
风格要像多邻国那样有强烈的个性：高饱和的品牌色、厚实有立体感的按钮（按下去会陷下去）、圆润粗壮的字体、夸张但清楚的反馈。但不要照抄多邻国的绿色和猫头鹰，做出自己的一套。
设计 3 个关键屏：
- 学习路径：一条弯曲的关卡路线，已完成、当前、未解锁的关卡一眼能分清，顶部有连续天数、经验值、生命。
- 答题：一道选词填空或听音选图的题，展示答对后的反馈状态。
- 完成一课：结算页，经验值、连续天数、正确率，吉祥物在庆祝。
记忆点：答对那一下，按钮、音效感的动效、吉祥物反应要让人想再来一题。截图里要能看出来。
App 屏幕按 390×844 设计，交付 `index.html` 和把三屏并排的 `screens.html`。
