微信小程序开发

Holdit微信小程序开发——实现背单词、外刊精读、听力等功能

本文主要介绍一些关于“Holdit小程序”想实现的页面以及功能模块——以实现前端页面为主。

---

---

一、项目分析：

项目名称：HoldIT
基于：微信小程序
开发周期：5周
期望实现功能：

1、 主体页面：背单词、外刊精读、个人主页。
2、 背单词：背单词页面3个、签到日历、单词书籍、学习情况。
3、 外刊精读： 外刊精读相关页面3个。
4、 个人主页：我的。

---

1.主体页面分析——单词：

1.1 背单词功能界面及其相关界面介绍

背单词
1、 首部欢迎语。
2、 中间三个功能模块对应三大类界面。
3、 按钮：Hold It——点击跳转背单词界面。
4、 tabBar：导航栏——切换到其他主页面。

---

1.2 背单词衍生界面——签到日历

签到日历
1、首部导入日历功能。
2、与日历的不同之处在于需要将签到日期圈出来。
3、 底部button要实现打卡到朋友圈、当日签到、返回背单词主页的功能。

---

1.3 背单词衍生界面——单词书籍

单词书籍
1、单词书籍分为两个选择页面：先选择学习范围（左边）、在选择具体的书籍（右边）。
2、左边是一个具有下拉功能的表单；右边具有缓存功能的按钮。
3、 右边最顶部按钮为可缓存全部。

---

1.4 单词衍生界面——学习情况

学习情况
1、学习情况又分为三个页面：遗忘曲线、总量统计、推荐复习。
2、遗忘曲线与总量统计页面需分别实现一个折线图和一个柱状图。
3、 推荐复习由一个文本框和一个可以随着用户每日背诵情况而改变的表单。
4、 顶部可以是tabBar之类。

---

1.5 单词衍生界面——背单词三步走界面

背单词三步走页面
1、背单词三步走分为三个页面：无中文释义页面、选择页面、完成打卡页面。
2、无中文释义页面主要顶部展示当前单词序号以及今日任务，中间展示所背单词。
3、 选择页面与无中文释义页面类似，在底部添加了认识、模糊、不认识的button（或者tabBar）。
4、 签到页面与之前“签到日历”页面类似，在底部添加了打卡到朋友圈、当日签到和不签到（返回）等功能。

---

2.主体页面分析——文章：

2.1 外刊精读功能界面及其相关界面介绍

外刊精读页面
1、外刊精读页面：由多种类文章表单组成。
2、右侧具有下拉按钮。
3、 展开后有细分的书籍名称，如：新概念英语：新概念英语一、新概念英语二、新概念英语三等。

---

2.2 外刊精读衍生界面——外刊精读三步走界面

外刊精读三步走页面
1、外刊精读三步走分为三个页面：外刊精读主页面、选择页面、收听页面。
2、外刊精读主页面2.1已展示。
3、 选择页面有多个表单项构成，右侧具有缓存按钮、最顶部的缓存按钮具有缓存整本的功能。
4、 收听页面较为复杂，具有多个功能按钮如音频倍速播放、展示音频对应字幕、缓存、快进五秒、倒退五秒、后台播放、展示全部句子等功能；底部的“此句没有听清”按钮可将当前正在播放的句子保留在上方空白处，“全部清除”按钮及清除保留的句子；顶部为音频文件播放器，其右下端具有选择当前播放课文的按钮。

---

3.主体页面分析——我的：

3.1 我的页面介绍

我的页面
1、我的页面顶部显示用户头像、昵称。
2、中间展示用户的相关数据，用表单。
3、 底部为tabBar。

---

二、总结

本文主要将“Holdit”小程序的页面布局与部分做了一定的拆解，具体的实现有待后文的继续更新。