结对第一次——疫情统计可视化(原型设计)
这个作业属于哪个课程 | 2020软件工程w班 |
---|---|
这个作业要求在哪里 | 作业要求 |
这个作业的目标 | NABCD模型的学习、原型设计 |
作业正文 | .... |
其他参考文献 | 《构建之法》 |
结对学号 | 221701303 221701326 |
一.NABCD模型描述
1.N(Need,需求)
目前新型冠状病毒肺炎疫情到了非常关键的时期,学校仍然是严阵以待。继续沿用疫情统计的问题,有一家统计网站每天都会提供一个对应的日志文本,记录国内各省前一天的感染情况,上次的疫情统计结果只是通过文字来显示,不够直观、具体,对用户不够友好,我们希望可以通过地图的形式来直观显示疫情的大致分布情况,还可以查看具体省份的疫情统计情况。
具体需求
-
在全国地图上使用不同的颜色代表大概确诊人数区间
- 文字数据显示现有的感染患者人数、疑似患者人数、治愈患者人数、死亡患者人数,并显示与昨日数据比较的增减趋势。
- 颜色的深浅表示疫情的严重程度,可以直观了解高危区域;
- 鼠标移到每个省份会高亮显示;
- 点击鼠标会显示该省具体疫情情况;
-
点击某个省份显示该省疫情的具体情况
- 显示该省份对应的感染患者人数、疑似患者人数、治愈人数、死亡人数;
- 该省份到目前为止的新增确诊趋势、新增疑似趋势、治愈趋势和死亡趋势
-
需求思维导图
-
扩展需求:同程查询和当代疫情热搜
- 能够查询自己所乘坐的航班或火车是否有确诊人员或者疑似病人
- 能够及时了解疫情相关新闻及群众所关注的时事
2.A(Approach,做法)
这次疫情数据展示平台,各大IT公司已经为我们提供好了蓝本。我们的做法就是制作一个方便获取数据的平台,可以直观的反应本次疫情的变化趋势,并通过地图的颜色深浅来反应全国各省的疫情严重程度,同时为用户提供了查询自己以往的行程同行乘客中是否有确诊人员。
- 我们通过Axure制作一个简单的web原型,打开网页就是最直接明了的数据展示,并且配有更加浅显易懂的地图可以更加方便明白的获得当下疫情的具体数据。
- 利用web网页前端直接展示当前数据和地图高亮,通过点击地图不同省份查询该省份疫情详情,跳转新的页面展示。
- 全国疫情详情配有曲线图,不同的数据比对,更加明了疫情的变化趋势。
3.B(Benefit,好处)
- 平台优势
- web网页不用下载,无论是移动端和pc端,都只需要访问一个网址,就可以使用相关功能。
- 用户可以不需要下载任何软件就可以体会到最新的功能以及得到最新的信息。
- 功能优势
- 用户可以在网页里面找到关于疫情所有的基本信息,历史情况,每日的变化。
- 通过地图上的颜色可以了解到具体数据情况,不需要去看文字信息,直观明了的情况展示,为用户了解相关情况节省了时间,提高了效率。
- 特殊功能
- 同程查询。为用户提供了查询自己以往的行程同行乘客中是否有确诊人员。这对用户对于自身的防疫工作提供了良好的情报与参考。
- 热搜展示。展示当下最热门的实时热搜,比如武汉疫情详情等等,可以让用户在使用该网页时最大程度的满足想要了解的详情,或者可以第一时间了解到哪些是谣言。
4.C(Competitors,竞争)
- 使用优势
- 由于是Web网页,无论是移动端或PC都可以随时随地访问。
- 访问用户可以及时使用新功能,无需更新或者升级版本。
- 不需要下载软件或者别的硬件要求,只需要访问网址,就可以使用相关功能
- 不用登陆与注册。
- 了解疫情情况
- 拥有全面且准确的数据
- 简洁又不失基本功能的界面,操作简单
- 特色功能
新型冠状病毒的传播感染能力如此之强,以至于潜伏期达到了惊人的最长可能为14天,令人防不胜防。且此次的高发期正好与春运重叠,每个人都很担心自己的同乘人员是否有病毒的携带者。为此我们为用户提供了查询自己以往的行程同行乘客中是否有确诊人员。这对用户对于自身的防疫工作提供了良好的情报与参考。 - 劣势
- 使用周期短,疫情结束该网页就失去价值。
- 相似网页很多,竞争激烈。
5.D(Delivery,推广)
- 可以在社交软件上进行介绍与推广,起初可以在与自己紧密相关的群里推广,如同学群,家族群,同事朋友群等,在得到最初一批用户的反馈意见后,进行针对性的修改与更新,再在更广的圈子里介绍与推荐
- 请各个领域的大v或者有影响力的人进行推广宣传,利用粉丝效应,也可以使我们的应用得到有效的传播
- 自己在生活中口头的宣传,主要是同学和朋友。
二.原型工具描述
1、使用的原型工具
Axure RP 9
2、原型项目地址
原型(有点慢~)
3、原型展示
-
全国疫情数据展示
- 显示全国感染患者、疑似患者、治愈患者、死亡患者实时数据
- 显示全国各数据较昨日增减数量
-
全国疫情地图显示
- 显示全国疫情地图,鼠标移动高亮显示。
- 点击省份可以跳转到省份的详情界面。
- 不同数据曲线变化趋势对比。
-
省份疫情数据显示
- 显示省份具体实时数据,包括现有确诊、现有疑似、现有重症等
- 显示各个数据较昨日增减数据
- 该省份新增确诊、累计确诊等曲线变化图
-
同程查询
- 输入姓名车次或航班号查询该航班号的具体确诊人数等
-
热搜显示
- 显示当下实时热搜具体,类似微博热搜。
三.结对过程展示
相关聊天记录
四.困难及解决办法
- 困难一
- 困难描述:第一次接触到原型设计的软件,不明白如何使用,在做地图高亮时不知道该如何显示高亮。
- 解决尝试:使用js代码实现地图高亮,通过在网上找到中国地图的源码,使用js接入解决地图高亮问题。
- 是否解决:是
- 有何收获:第一次尝试到了做高亮地图,收获到了不少知识。
- 困难二:曲线问题
- 解决尝试:通过网络查询,发现可以使用echart绘制曲线图,最终使用echart
- 是否解决:是
- 有何收获:学习到了使用echart绘制更多图标。
- 困难三:地图跳转
- 困难描述:不知道该如何实现地图跳转
- 解决尝试:既然上面echart可以实现地图高亮和折线,那就尝试一下地图跳转,然后百度查了相关函数。
- 是否解决:是
- 有何收获:echart学习的更加深入。
五.PSP表格
PSP2.1 | Personal Software Process Stages | 预估耗时(分钟) | 实际耗时(分钟) |
---|---|---|---|
Planning | 计划 | 40 | 60 |
Estimate | 估计这个任务需要多少时间 | 30 | 40 |
Development | 开发 | 480 | 500 |
Analysis | 需求分析 (包括学习新技术) | 120 | 150 |
Design Spec | 生成设计文档 | 30 | 50 |
Design Review | 设计复审 | - | - |
Coding Standard | 代码规范 (为目前的开发制定合适的规范) | - | - |
Design | 具体设计 | 120 | 150 |
Coding | 具体编码 | 180 | 200 |
Code Review | 代码复审 | - | - |
Test | 测试(自我测试,修改代码,提交修改) | - | - |
Reporting | 报告 | 40 | 80 |
Test Report | 测试报告 | - | - |
Size Measurement | 计算工作量 | 20 | 40 |
Postmortem & Process Improvement Plan | 事后总结, 并提出过程改进计划 | 30 | 30 |
合计 | 1090 | 1300 |