StepWise 预览 1 StepWise 预览 2

项目概述

StepWise是一款面相英国人的中文学习APP,用户群体为英国的学生/以及少数汉语教育的老师。具备生词本/词汇学习/游戏/小测试等汉语学习功能。

Branding & UX Strategy

品牌设计和用户体验设计策略

Trust And Dependability

信任与可靠

Calm And Focus

冷静与专注

Professionalism

专业性

Universality

普遍性

# Slogan #

With StepWise, You can learn Chinese step by step

StepWise slogan visual

Design Creative Draft

创意草稿

Design Creative Draft preview

Final Design

最终的设计稿

Final Design preview
Final app screens preview

System Colors

这款语言学习应用面向英国的学生, 对外汉语教育的老师这样的用户群体 在StepWise品牌和APP的设计中采用黑色作为主色调, 有助于创造一个可靠、冷静和专业的学习环境。

System Colors palette preview
Font
Helvetica Neue
Regular Medium Bold

这样使用“Helvetica Neue”字体:
在提供清单、专业、统一等产品层面具有现代感的视觉体验;
从而增强用户的学习效果和产品价值。

Icon

轻拟物风格

使用轻拟物风格的图标
在提升图标的易识别性和理解性,减少视觉干扰,增强用户体验,适配白天与黑夜模式
同时创造出现代、美观和一致的视觉效果

Icon design preview

App Design

产品设计原则
Information Architecture
信息架构
课程流程设计

清晰流畅的课程结构,“课程—单元—单元”记述:从拼音、基本汉字、日常用语到复句,层层递进。

信息设计

采用前置的导航设计,用不同配色按听取内容分类,配合明确的页面布局,帮助用户迅速理解学习路径。

Interactive Design
交互设计
游戏化学习设计

游戏化学习切入,如看图识字、进度正确发音、语音练习,让用户保持持续动力并形成反馈闭环。

即时反馈

在用户完成练习后,立即提供反馈,指出错误并给出正确答案,提升学习效率与体验。

渐进式数据呈现

逐步呈现信息,避免一次性提供过多内容,帮助用户稳步推进学习,降低认知负担。

UI Design
界面设计
视觉设计

在UI界面中至少三种元素,符合五方面用户审美。采用简洁、现代的设计风格,使用更柔和的色彩与精细的字体。

可用性

确保App在不同设备(手机、平板、电脑)上都能良好显示和操作。提供明确反馈,如点击或输入无响应/无反馈提示。

一致性

确保不同界面间的交互与视觉规则统一,减少学习成本;通过一致的排版与组件来提升整体专业感。

Interaction

交互设计

UI Design

界面设计

StepWise汉语学习APP品牌 UX/UI Design

从到全流程设计
Jul. 2023 — Jan. 2024
Client
Xiao Jia
DK CREATIVE
Research / LiuYinKui
UX/UI Designer / LiuYinKui
Branding / LiuYinKui
PD / Xiao Jia
Client Developer / Xiao Jia