# 少儿英语App设计：角色之外写清反馈

原网页：https://www.jvds.cn/share/ui-design/english-learning-answer-record-u100
语言：zh-CN
发布：2026-10-18
作者：界达设计工作室（JVDS）

这组英语学习App用黄色角色、紫色背景与粉色卡片形成亲切语言。头像、题目、学习日历和完成页都延续相同风格，学习过程因此有连续感。角色负责鼓励，题目答案、进度和记录则需要自己的明确表达。

## 核心结论

- 角色在不同任务中改变大小，保留学习内容空间。
- 答案判定、日期和指标单位需要独立于表情解释。

## 角色大小随任务调整

个人页用圆头像确认Jacob身份，头像选择页把粉色角色放大，日历则以小表情组成记录。相同角色语言在不同场景里改变规模，没有要求每一屏都重复一张大插画。

用户头像与引导角色应有区别，换头像之后，黄色讲解角色不该让人误以为身份被重置。界达设计更偏好给长题目保留完整视野，角色用表情和姿态补情绪，必要时主动缩小。

学习日历的表情颜色很多，但日期定位较弱。月份、日号和当天摘要需要保留，[灰杠、黄色和蓝色](https://www.jvds.cn/share/ui-design/semantic-color-tokens-design)各表示什么也应说明，才能从“记录很多”走到“找到某一天”。

![个人资料、角色日历及头像选择并列，头像与陪伴角色具有不同用途](https://www.jvds.cn/upload/2026/1008/d187-tp/u100-i1.webp)

个人设置｜看身份、记录和个性选择的职责

## 选中和答对需要不同状态

题目页上方是举手角色与进度条，下方有题干、多项答案和绿色Continue。紫色填充说明某项被选择，不能仅由这个颜色认定它已经答对。

未选、已选、提交后正确与错误可分别呈现。判定时保留原选择，再给正确写法与短解释，允许重试或继续；角色表情只补充反馈，不代替文字结果。

日历下Activity、Discipline和Energy使用不同单位。分钟、专注分数或其他状态应各有定义，外形相同的卡片也不能自动变成同一种能力评分。

进度条可以用“第几题/共几题”配百分比，正确率另在本轮结果里呈现，避免上方数字同时像完成度又像成绩。错误解释尽量围绕这一题的词或句式，保留题干和原选择；[长帮助可以展开](https://www.jvds.cn/share/ui-design/progressive-disclosure-complex-product-ux)，短反馈不必要求离开题目。

![三张手机展示个人进度、紫色选项与角色日历](https://www.jvds.cn/upload/2026/1008/d187-tp/u100-i2.webp)

练习页面｜看选中状态是否与判定结果清楚区分

## 完成页回到下一次学习

完成页提供Home、Rating、Share等入口，庆祝姿态与鲜色背景形成情绪节点。它可以再补本轮反馈、错题回看和下一次练习方向，分享保持可选。

登录、课程卡和头像设置采用同一语言，具体任务仍需不同说明。课程的年龄范围、内容和费用周期应靠近选择入口，账户操作则应区分学习者与管理者。

年龄跨度很大时，题干语言、帮助长度和账户动作需要分别核对。统一品牌可以贯穿，不能因角色一样就假设每个年龄阶段使用方式也一样。

完成页若连接错题回看，可逐题打开本轮记录，明确哪些已经纠正、哪些仍待练习。回到主页后，日历再记录这次学习的日期和内容。庆祝不会消失，但孩子也能知道下一次练习为何与这轮有关。

![注册、祝贺、练习、年龄课程和头像选择共用彩色角色](https://www.jvds.cn/upload/2026/1008/d187-tp/u100-i3.webp)

多个状态｜看角色语言怎样跨阶段延续

## 常见问题

### 紫色答案就代表正确吗？

应由明确状态说明。选中、已提交、正确与错误需要分开，表情只能辅助反馈。

### 表情学习日历需要日期吗？

需要月份、日号和状态图例，点开后能找到当天任务，才具有可查阅价值。

## 设计检查清单

- 长题干不被角色挤出视野。
- 选中与判定状态明确。
- 记录有日期、单位和说明。

## 连接练习反馈与学习记录

少儿学习产品可先整理答案状态、错题回看和日历定位，再建立角色与跨年龄界面规范。

界达设计工作室（JVDS）提供UI/UX设计与网站设计、开发服务，可一起梳理页面内容、界面结构与实现需求。

[联系界达设计，聊聊你的项目](https://www.jvds.cn/contact)