Talkie这套语言学习App设计,有趣的是题目一直在变,页面的节奏却很熟悉。浅绿底色、珊瑚红选项和底部的Continue,从入门选择延续到练习,让人容易找到下一步。
先问一件事,再给一颗明确的按钮
水平页没有直接抛出专业等级,而是用几句简短的话描述能说到什么程度。选项纵向排列,选中项变成珊瑚红,下面留出较大空白。这种安排适合初次使用:先理解问题,再比较答案,不必同时学习一组陌生缩写。
顶部进度条旁写着步骤数,返回箭头在左边。它把“这一页该做什么”和“还剩多少”放在同一个视野里。每日目标页沿用这套位置,时长选项改变,操作方法没有改变。
目标页在继续按钮下面还写着可到个人设置修改。这个不显眼的小句子很有价值,它让每日目标更像一个可调整的选择。借鉴这类入门流程时,应把与当前选择相关的说明放在附近,而不是让人完成设置后再去帮助页找答案。

兴趣标签允许用户停在不确定的位置
兴趣页把Reading、Psychology和Design等选中项标红,其余标签为白色。选项像一组小纸片,长度跟随文字变化,几行排布比把每项做成全宽大按钮更轻巧。标题下的多选说明也解释了为什么可以同时出现多块红色。
界达设计更看重底部的Skip for now。首次使用时未必知道自己想聊哪些话题,跳过让这个问题不至于挡住学习。自填入口也在同一页,已有分类和补充内容都有位置。
图里Fitness出现两次,Add other也用了与选中项相同的红色。若继续打磨,可以先去掉重复分类,再给新增入口更明确的动作样式。这样保留了标签的活泼感,也能区分“这是我的兴趣”和“我要增加一种兴趣”。

四种题型共享页面骨架,各自保留表达空间
图片题用四格插画让人辨认动物,选词题把选项排成纵向条目。口语题中央留给句子和麦克风,组句题则把已选词放进白色区域,下方是候选词块。不同练习用不同的作答方式,这比强行套成相同卡片更贴近内容。
这些屏幕仍然保留顶部进度,反馈语和Continue靠近下方。看完题目、得到回应、继续下一题的视觉顺序是稳定的。对语言练习反馈设计而言,统一的应是任务阶段,题目区域可以自由变化。
口语页在肯定反馈下面补了句意,回应比单独一句“很好”多了一点学习内容。后续评审可沿着这个方向检查错误答案、重试和词块撤回;它们是否存在、点击后怎样出现,当前静态图无法确认。
图片题的动物都画在相似浅绿方块里,选中的猫多了一圈深色边界。红色在发音按钮上,边框在答案上,两个动作没有抢用完全相同的样式。相邻的两只猫形象接近,正式题库还需要检查图像能否对应唯一答案,这属于内容检查,不能靠漂亮反馈替代。
组句题的已选词从左向右排在白色区域,候选词中的已用位置则变成浅色块。空白与占位表现了词块的来去关系。若再补一个移回候选区的画面,设计师和开发者就能一起确认撤回方式,避免只有正确完成时的好看状态。

让角色活泼,让选择可以复述
浅绿背景让大段空白显得柔和,珊瑚红集中在选项、发音和录音等位置,插画的黑色线条又把轻松感拉回来。题目中文字没有沿用夸张造型,因此角色与教学信息各有自己的语气。
目标后的庆祝页写着时长与词汇数量的关系。这可以作为文案排布来观察,不能当成实际学习效果。教育产品借鉴这种奖励页时,更适合告诉人刚完成了哪些设置、接下来会练什么,让鼓励有可核对的内容。
设计检查清单
- 连续翻看入门页,确认返回、进度和继续的位置一致。
- 把新增兴趣和已选兴趣做成可区分的状态。
- 为图片题、口语题分别补齐错误与重试画面。
准备做一款学习产品?
课程内容、首次使用设置和练习反馈,需要一起放到真实屏幕里看。界达设计工作室(JVDS)提供UI/UX设计与网站设计、开发服务,可协助梳理学习产品的界面与介绍网站。