前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >“冬奥智慧气象APP”的成果展示之一

“冬奥智慧气象APP”的成果展示之一

作者头像
用户1247399
发布2022-05-23 16:28:21
4150
发布2022-05-23 16:28:21
举报
文章被收录于专栏:编外气象人编外气象人

连续分享了两期“冬奥智慧气象APP”这款用于重大体育赛事期间决策气象服务产品的设计与实现,今天继续分享一点研发成果给大家,希望能给有需求的同行们一点参考。

“冬奥智慧气象APP”的定位很明确,面向国内外奥委会官员以及赛会服务人员使用的决策APP。整个APP的设计理念就是简单、实用,并尽量符合国外友人的使用习惯。我们详细对比并参考了BERG-SKI、Met-office、YR、Windy等国外冰雪项目的主流APP和常用的天气APP,摒弃了国内常见的模块化表现形式,并在“使用细节”上下功夫,采用信息流方式,让使用者通过“一张图、一页纸”就查看到所有气象信息,而并不需要去“寻找”!在服务的针对性上我们就侧重一个字“细”!因此站点天气是我们关注的重点。假如我现在就是延庆高山滑雪中心的一名冬奥赛事组织者,三天后在高山滑雪中心将迎来一场关键比赛,我想知道天气是否会影响比赛。就按照这个思路,给大家演示一下APP的使用。

“冬奥智慧气象APP”通过扫码进行安装,在服务器上我们部署了安卓版和苹果版的安装包,采用同一个二维码,扫码后自动识别手机的中英文操作系统,如果是英文将自动切换到英文版。双击打开冬奥APP:

这就是APP的首页,总体布局分为四部分,分为搜索区、功能区、地图区和信息区。最顶端搜索区有三个功能,快速搜索比赛场馆和赛事举办时间,我的关注和用户信息。右侧为可伸缩的功能区,进行要素切换和交通信息的快速转换。中间最大的地图区显示了用户定位和三大赛区主要天气情况,通过手指点击和手势操作(放大、缩小)可查看任意点天气。这么多信息,但是我只想看我最关注的高山滑雪中心的天气,先找到最想看的信息,其他的功能等有时间再看。这个时候,就想快速进入高山滑雪中心,点击一下延庆赛区,立刻进入到国家高山滑雪中心了。如果你不知道高山滑雪中心在什么地方,有一个方法可以一步定位,那就是快速搜索功能。只需要输入“滑雪中心”,就可以匹配出所有与滑雪中心相关的场馆信息,点击之后将直接定位到场馆级别地图上。如果想返回赛区,直接点复位键就可以。如果您不想输入文字搜索,就想在地图上找,那好,放大,由赛区进入到场馆,找到高山滑雪中心,点击一下也能够快速进入到赛道级别的地图显示。

在这一张地图上,力求做到快速定位与分级浏览。手机有横屏和竖屏之分,当前设计采用竖屏设计,目的就是方便一只手操作。地图显示区从赛区到场馆再到赛道逐级放大,让用户从宏观到微观的不同视角查阅到自己最关注的信息。还是回到我模拟的用户和使用场景上,通过这“一张图”进入到延庆赛区的高山滑雪中心,所有国家高山滑雪中心的天气情况将“尽收眼底”。这时候,信息区将提供出我想查阅的全部天气信息。整屏是一个可伸缩的信息展板,通过上下滑动进行显示和隐藏。信息展板共分为五个部分,从上到下依次为时间轴、当前天气、逐日天气、实况预报一体化详情信息和赛区天气综述。利用时间轴将实况到预报无缝连接起来,并且设计了自动播放和手动播放的功能,让气象信息可以动态展示。这个时间轴的作用很大,既能控制地图上的信息,也能控制信息区内实况和预报的数据切换。时间轴下是国家高山滑雪中心的当前天气,紧接着是滑降起点1逐日天气,再下面是实况到预报的一体化显示区,最后就是赛区的天气综述。

其中,逐日天气和一体化详情信息是联动的。大家看一下这个功能,非常直观。我选择任意一天,下面也会跟着变化。例如我选择今天,我们可以从1分钟实况、10分钟实况、逐小时实况一直到逐时预报、逐天预报全部在这里看到。同时展现形式上既有表格的方式,也有图表的方式。这个联动实现了时间维度上的一体化,也是我们“一页纸”设计思想的集中体现。除了时间维度,在空间上也进行了一体化设计和实现。

当通过地图进入到某个赛区之后,有个小箭头,点开这个小箭头之后会显示三大赛区所有的场馆和赛道,体育场馆和赛道站点一目了然,无论是看单点的天气还是多点的天气,在这里都能快速找到。还是以延庆赛区为例,国家高山滑雪中心下的所有站点全部罗列出来,即可单点查看,也可以多点查看,只需要点击站点右侧的小五星即可。返回来大家看一下,首先显示的是我刚点击的滑降起点1,在这个点的右侧有个开关,这个开关打开后你刚才关注的不同点在这“一页纸”上就可以全部展现出来了。向下滑动您就可以看到,我们刚才选的延庆赛区高山滑雪中心赛道上的几个点都在这里了,点开这个箭头就可以看到详细天气信息,你滑动时和逐日天气也是联动显示的。在图表形式下,还可以查看不同要素。这就是多站对比功能,在空间维度上也实现了一体化。通过以上的联动展示和多站对比,实现了“一张纸”的设计思路和展现方式。这样设计和实现,就是为了让用户不要去通过多余的互动操作以及到处去找,在一个页面上通过科学布局和逻辑设计就看到所有想看的信息。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2022-05-07,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 编外气象人 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档