网络工程 巫璟足球资讯半岛体育官方平台_英超NBA赛事直播_电竞赛事数据分析小程序的设计与实现
体育赛事直播,英超NBA直播平台,电竞赛事数据分析,赛事回看下载,半岛体育官网在当今快节奏的社会,人们希望避免复杂繁琐的事情,更喜爱和接受轻松而便捷的东西。鉴于时间问题、生活问题,足球爱好者无法去现场观看球赛或观看球赛直播,而一些APP又有占用内存大和需要下载独立软件等的缺点。小程序的优势就体现出来了,本论文设计了一款足球资讯小程序,能为足球爱好者们提供更快速更方便的服务。
本论文的主要目标是解决足球爱好者无法获取最新足球资讯的问题,为此设计了一个能够轻松、便捷、快速地获取最新的足球新闻、足球比分和足球数据的足球资讯小程序。在微信开发者工具的环境下,通过小程序的WXML标签语言和WXSS设计视图层,运用JavaScript技术设计逻辑层,以及调取API接口获取数据从而开发完成足球资讯小程序。结果表明该小程序能够解决足球爱好者在没有条件情况下想了解足球资讯的问题。小程序对比起普通的APP程序有更方便更快捷的特点。
以前人们想要获取信息都是通过报纸、电视、收音机等的渠道。现在,互联网已经迅速成为了人们获取信息的重要渠道,新闻资讯则是获取信息的重要内容之一。
中国的球迷人数已经达到了1.87亿,在中国所有的男性中,有45%是球迷,在中国所有的女性中,有20%是球迷。据统计,从2013年的27%增加到2017年的32%是中国人对足球感兴趣的人数的增长率。在球迷人口分布中,中国城市球迷有32%,在中国16到24岁年龄段的年轻人中,42%是球迷。这些数据在2018年《nielsensports》公布的一份世界足球报告里都有显示[1]。从上面的数据可以看出中国的足球爱好者数量庞大,并且每年都在不断增加,这说明对足球资讯的需求越来越大,对足球资讯的软件要求越来越高。
在当今的社会,智能手机不断更新换代,很多人都用上了智能手机,所以就有了很多的手机网民。《中国互联网络发展状况统计报告》有一项数据说明了手机上网已经成为中国人最主要的上网方式,在中国有7.51亿的手机网民和电脑网民,而手机网民的人数就有7.24亿,已经达到了96.3%的占比。不仅中国手机网民的人口多而且几乎每个网民的手机都有微信软件,这就说明微信平台有着庞大的用户基础[2]。腾讯公司在2017年发布了微信小程序,微信用户不需要下载任何软件或插件就可以在微信中直接使用小程序。有两种方式找到小程序,一是扫描小程序二维码,二是搜索小程序名字。极大地提高了用户的使用效率和避免了复杂繁琐的使用体验。
综上所述,设计一款足球资讯小程序是非常符合市场需求和符合社会潮流的。一方面是让大量足球爱好者随时随地能获取到足球相关的信息,另一方面是使用符合现代潮流的技术,让人们感受科技的发展以及科技所带来的轻松和便捷。
在过去,人们想获取到足球新闻就只能通过传统媒体,例如报纸、杂志和电视体育新闻。但是时代在不断进步,科技在飞速发展,就出现了很多新的获取足球信息的渠道,例如门户网站、在线体育社区、新媒体、移动APP等,然后就是到现在的足球新闻小程序。
中国足球的迅速发展是在2015年,因为2015年足球改革,所以中国足球和很多体育相关的领域都进入到了互联网+时代,互联网+足球催生了一些像懂球帝APP、肆客APP之类的垂直平台。在资讯类的行业中有两种形式,第一就是新浪、腾讯、乐视这种资讯多涉及不同领域资讯的网站;第二就是只做一方面体育的资讯的垂直平台,他们的数据更全面、更精美。像新浪、腾讯这样的大网站最大优势就是他们的渠道很广、流量也很大、而且他们有直播版权,但是这些大网站的不足之处就是内容多但不细致、社群管理庞大但用户链性不强等,所以这就给一些只做体育方面资讯的垂直平台有了快速发展和崛起的机会[3]。
足球资讯的发展我是一步步经历过来的,在获取足球资讯这方面本人还是接触比较多。因为我也算是一名资深足球爱好者,从以前的买报纸、买杂志或看电视获取足球新闻,到在电脑上从腾讯体育、新浪体育等网站获取足球新闻,然后是刷微博,再到近年来的懂球帝、肆客、虎扑等APP获取足球新闻,最后到现在自己尝试设计一款足球资讯小程序。从传统媒体、新媒体、到APP再到小程序,足球资讯的发展也是一直跟随着时代的潮流,跟随着科技的发展。从以前的不能随时随地获取到资讯,到现在的不需要下载安装,只需要一个微信APP就能获取到,方便快捷,轻松自在。
要之即来,挥之即去,免下载、免安装描述的就是小程序,它是一种手机应用,和APP不同,小程序不会占用手机内存,所以用户不需要担心这个问题。用户能扫描二维码、搜索名字或附近搜索来使用小程序。小程序刨除了一切繁杂的程序,将用户的操作变得更加灵活快捷,大大提高了用户体验,使用量也大大增加[4]。
2017年1月微信推出了小程序,从2017到2019年,微信小程序不断快速的发展,取得不错的成绩。《微信就业影响力报告》是微信公布的,报告显示,截止到2018年12月,2018年微信小程序数量比2017年增长了75%,总数量已超过100万个,细分行业已经覆盖200个,以及182万个就业机会是微信小程序带来的,还有创造70万个直接就业机会,累计商业价值5000亿元 [5]。对于微信来说,小程序肯定是下一个重点发展的目标。在当今的社会下APP应用已经占有了大量的用户,这个新兴应用让很多创业者看到了希望。从一开始所有行业都在看看的状态,到现在大部分的行业开发商都不断加入,机会变得越来越多,未来也越来越明朗。无论是已经投资的创业者,还是与之相关的用户和服务提供商,我们都需要用新的视角和多维的视角来观察小程序。
小程序不用安装和不用下载的特点适合很多行业。小程序帮助餐饮业解决了排队、点菜、取餐、付账等服务,可以使线下门店的运营效率大大的提高。而且不仅是提高了运营效率还节约了很多人力成本。小程序拥有很多功能,其中一些功能比如附近的小程序,可以看到附近有什么线下门店的小程序,还有就是领取会员卡和领取代金券功能,这些功能都更好地帮助了零售业连接线上和线下的用户,可以说小程序能帮助新零售业快速发展。社交小程序的优势来源于微信庞大的社交流量,因为微信用户数量庞大所以微信群和朋友圈能带来巨大的流量,让社交小程序在市场上大受欢迎[6]。
(1)认知度方面:小程序的认知度还是很高的,根据统计,商户对小程序的关注度已经超过了五成。
(2)普及度方面:根据统计,在开通了微信公众号的商户中,也已经有超过五成开通了微信小程序,可以说普及度很高了。
(3)应用目的方面:根据调查,商户开通微信小程序的目的是为了提升客户的服务和体验,增强自己品牌的传播以及更好的连接线上和线)推广和营销方面:营销的方式有很多,比如拼团和砍价,还有就是直播。而推广方面大多数都是用微信公众号导流。
(5)推广意愿方面:根据统计,超过九成的商户愿意把营销推广预算给小程序,但是也有五成的商户的预算不高却对小程序有强烈推广投入意愿。
(6)运营方面:根据调查报告显示,大部分商户运营方式是自主运营和让第三方公司代运营,只有一小部分的商户没有任何运营。
微信小程序是一个全新的东西,是微信在2017年推出的。因为小程序的特点就是快速开发,所以用户可以很快地开发出一个小程序。在微信APP中就能使用小程序,就能知道免下载和免安装是微信小程序的特点。微信小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验[7]。想要开发小程序的开发者只需要通过简单的学习过后就能够开发,因为小程序不需要巨大的成本而且短周期内就能完成。
开发小程序的第一步是打开网页,进入微信公众号平台,注册一个开发者账号,如果是自己开发小程序就注册个人号就行了,也没有什么条件(要满18岁才能注册)不需要费用,企业号则需要一定费用。注册好后,登录填写一下小程序信息就可以下载微信开发者工具开始开发小程序了。
开发者可以选择自己熟悉的框架开发小程序。例如Mpvue,如果开发者没有熟悉的框架,可以学习官方提供的框架,然后在微信开发者工具中开发。微信小程序和普通网页开发是不一样的,普通网页一般都是HTML+CSS+JavaScript,而小程序采用的是WXML+WXSS+JavaScript模式,WXML和WXSS组成小程序的视图层,逻辑层则由JavaScript完成。WXML是微信开发者工具中提供的标签语言,可以用各种标签设计小程序的页面。WXSS是微信开发者工具中提供的样式语言。WXSS可以让WXML的组件变得更不一样,可以设置他的位置、颜色等等。微信小程序可以说是非常的良心了,考虑到了前端开发者的适应问题,CSS的很多特性WXSS都是具备的。在这基础上,WXSS还修改和扩展了CSS,加入了尺寸单位和样式导入[7]。
开发者开发微信公众号和微信小程序可以使用微信官方提供的微信开发者工具。微信开发者工具有两种开发模式,第一就是公众号网页调试,第二就是小程序调试。公众号网页调试就是用来开发公众号的,小程序调试就是用来开发小程序的,用微信开发者工具开发小程序有代码编辑和查看,对小程序的预览和发布等功能,微信为了让开发者有更好的开发体验,从视觉、交互、性能等方面对开发者工具进行了更新和升级 [7]。
在微信公众平台注册了账号的开发者都拥有一个AppID,这个很重要,因为创建项目时要用到它。创建好项目后就能开发小程序了,模拟器是微信开发者工具中的一个功能,可以很好地模拟小程序在微信客户端中是怎么样的,而且还有不同的手机型号和不同的尺寸选择,让你的小程序能适配所有的手机型号和尺寸,可以说微信开发者工具的功能挺强大。
微信官方提供开发小程序的框架叫MINA应用架构(见下图2-1)。如果开发者使用微信开发者工具开发小程序就需要用到这个框架。
文件系统、网络通信、数据以及安全等这些基础功能是MINA框架通过封装微信客户端提供的,还提供一系列的组件和API。微信团队自己研发的WXML和WXSS,在MINA框架中构成视图层。WXML可以让开发者用来搭建基础的页面。小程序的WXML和普通网页的HTML差不多,他们都是标签语言, 可以通过很多标签来设计小程序。小程序的WXSS和普通网页的 CSS差不多, WXML组件的页面位置, 图片大小, 文字颜色等都可以用WXSS来改变。MINA框架的服务中心是AppService应用逻辑层,在AppService中能实现页面渲染所需的数据、页面交互处理的逻辑。MINA框架的核心也是逻辑层,交互逻辑、网络请求、数据处理是MINA框架中的AppService使用JavaScript来编写的 [2]。
如果开发者熟悉Vue语法和Mpvue框架的可以选择不适用微信开发者工具开发小程序,这样开发者就不需要重新学习微信小程序的语言再去开发小程序。Mpvue框架是用Vue.js开发小程序的前端框架。框架修改了Vue.js,这样就能在小程序的环境中运行了,为小程序开发引入了整套Vue.js开发体验。小程序提供的官方框架就是MINA框架,这个框架类似于Vue框架。一整套JavaScript API是框架对上层提供的,因此微信客户端提供的各种基础功能和能力可以让开发者能够非常方便地使用,能快速完成一个小程序 [8]。因此开发者可以选择自己熟悉的框架来开发小程序,可以说自由度是挺高的。
JavaScript是用来完成微信小程序的逻辑层。小程序的JavaScript和普通网页开发的JavaScript是差不多的,只是小程序还加入了一些API。JavaScript是一种头等函数语言,它的特点是轻量的、解释型的、面向对象的。JavaScript也是一种动态的基于原型和多范式的脚本语言,支持面向对象、命令式和函数式的编程风格。通过翻查资料,我了解了JavaScript在不同框架中组成也是不一样的。ECMAScript、DOM以及BOM是JavaScript在浏览器中的组成;ECMAScript、Native和Npm是JavaScript在node.js中的组成;而ECMAScript、小程序框架以及小程序API则是JavaScript在小程序中的组成。小程序的JavaScript缺少了像Node.js中的Native模块和Npm模块,所以无法使用原生库和包管理工具[10]。小程序的很多功能都是通过逻辑层来实现,比如跳转功能,登录功能等等。
在不同平台JavaScript的运行环境也不同,在IOS平台运行在JavaScriptCore中。在Android平台运行在X5 avaScriptCore中,由X5内核进行解析渲染。在微信开发者工具中则是运行在Nwjs中。因此我们了解了一些内核就能更有效帮助我们设计小程序的逻辑层。
WXML和WXSS这两个是微信自己研发的语言可以用来完成微信小程序的视图层。
WXML是微信团队自主研发的标签语言,它可以用各种标签来设计出一个小程序的页面。数据绑定、列表渲染、条件渲染是WXML的基本功能,而模板和引用也是WXML的功能。数据绑定就是用变量名加双括号的语法绑定属性,获取动态数据来自JS页面。 列表渲染就是在标签中绑定wx:for属性,它是一个数组,然后数组数据也是来自JS页面的Page的data对象,就可以重复渲染组件。item是当前项的默认变量名,而如果我们想获取数组的当前项下标,我们就需要了解index是默认变量名。我们可以使用 wx:for-item属性来帮当前项改名,同样也可以使用wx:for-index属性来帮当前项下标改名。wx:if属性就是条件渲染,判断这个代码块是否渲染,wx:if 的模板也是可以用来数据绑定的,当 wx:if 的条件值切换时,框架就会有一个局部的渲染过程,它会保证条件块在切换时是否销毁或者重新渲染[7]。
WXSS是微信团队研发的样式语言,WXSS和CSS差不多,具有CSS大部分的特性,WXSS拥有全新的特性,就是尺寸单位和样式导入。
随着科技的不断进步,从电脑软件到手机APP再到现在的小程序,科技让人们的生活变得越来越方便,越来越轻松。目前微信的日活量约10亿,小程序日活用户量超过2亿,面对小程序的天然优势,很多创业者对小程序表现了不同寻常的热情,这直接催生了目前小程序开发市场的热度[11]。
如今处于互联网+时代,催生了很多新型的产业,小程序的出现让许多行业免去了烦恼。例如餐饮业,很多线下的门店的拿号排队等服务都要去到现场,十分的不方便,小程序就解决了这一烦恼。但如果是APP,很多人不愿意为了一两次的使用就下载APP,既占用空间也麻烦,而小程序显然让人们更易接受,因为它无需下载,无需安装,直接搜索就能使用,方便了店家,也方便了用户,可谓一举两得。资讯类的公司也都看到了小程序的好处,利用人们的心理,因为小程序轻松便捷,省去了很多麻烦,所以小程序的需求也越来越大。
根据数据可以知道,我们国家的足球爱好者每年都在增加而且基础人数也庞大。因为我本身也是足球爱好者,也有幸生活在一个有职业足球队的城市,每次到比赛日就能在街上看到很多穿球衣的人,每场到现场观看的人数也有三到四万人,再加上许多不能来现场的人,可想而知一个城市的足球爱好者数量是非常庞大的。所以对于足球资讯类的不管是APP还是小程序的需求都是很大的。
资讯类的APP有很多,例如资讯比较集中的腾讯新闻、新浪新闻之类的。但是缺少单独的详细资讯和相关数据。而单独做足球方面的就有如懂球帝APP、肆客足球APP。而他们都存在着需要下载安装以及占用空间大的缺点,所以我觉得把APP转换成小程序是能够大大提高用户的人数,而且极大地方便人们阅读资讯和查看数据。
一个资讯类的小程序需要具备的功能就是新闻和数据,所以一个足球资讯小程序需要的基本功能就是可以查看足球新闻、足球比分以及足球数据。
在基本功能中, 足球新闻功能应该能查看新闻的详情页;足球比分功能则需要能查看比分和查看比赛的详情;足球数据功能需要能看到积分榜数据,球员的数据以及赛程数据;用户中心功能就是查看用户的信息;还有反馈小程序的意见的功能和能够分享小程序的功能。足球资讯小程序的功能需求分析基本就是这几个功能了。
我设计的这个足球资讯小程序总共拥有新闻、比赛、数据、用户、互动以及反馈六大功能。不同的功能有不同的操作,下面介绍一下各功能的具体操作。
比赛功能的两个具体功能就是查看实时比分和查看比赛详情,比赛详情能够查看这场比赛的赛况,比赛的阵容和对这场比赛的分析,分析功能有一个趣味的预测和能够查看两队的交锋记录和两队最近五场的比赛记录。
数据功能则能够查看到中国超级联赛、英格兰超级联赛、西班牙甲级联赛、法国甲级联赛、德国甲级联赛和意大利甲级联赛这六大联赛的数据。能够查看六大联赛的积分榜、射手榜、助攻榜和赛程,其中赛程还能查看这场比赛的比赛详情。
足球资讯小程序分为了四个页面,分别为首页、比赛、数据和我的页面。主要分为了两层。见图3-3。小程序的整体颜色为天蓝色。
第一个页面为首页页面,主要就是用来查看足球新闻的,所以我分为两部分:轮播图和新闻列表。轮播图由新闻图片和新闻标题组成,放在顶部,每5秒切换一次新闻;新闻列表由新闻图片和新闻标题以及新闻来源组成,用一条细线分隔每一条新闻。点击轮播图和新闻列表都能跳转到对应的新闻详情界面,用户向下滑动会加载更多的新闻。