精选最优秀的体育类网站与APP设计欣赏

UI / UI设计 / 网页设计 /      

uimaker
UI设计师 / 江苏 南京

来源:网络   作者:陈子木

在过去的几年当中,因为工作原因,我有幸参与了一些著名体育品牌的网站APP设计,在此过程中,我花费了大量的时间和精力来研究体育类网站APP,对于整个市场有了比较清晰的认知。通过对比,我发现绝大多数的英超、NFL和NBA的网站模板是如此的相似而过时,反而是有些球队和俱乐部的网站打破了常规,打造出令人耳目一新的优质产品。

今天这篇文章,我会将我最喜欢的体育类网站和APP都列出来,并对它们进行简要的分析。这些产品在排版布局,图片处理、用户体验、可用性和易用性上,多有其独到之处,希望我的这个列表能给你帮助!

在诸多体育类网站中,我关注得更多的是体育信息相对密集的站点,诸如俱乐部、球队和球员的个人网站,球迷可以在那里定期获得相关的信息更新、新闻和门票的相关资讯。

而诸如Reebok和Nike这样的品牌网站则往往能给你带来耳目一新的视觉设计。接下来,我们具体看看每一个网站都有什么亮点吧。

Manchester City Football Club

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

这是曼彻斯特城足球俱乐部的网站,也就是我们常说的曼城。作为一个有几年历史的专业足球网站,它至今没有广告,当然这得归功于它背后钱多得不得了的俱乐部老板。网站整体设计漂亮,大胆而明确,品牌感极其强烈,,很明显网站的设计者打一开始就在视觉和品牌营造上下了极大的功夫。

Arsenal Football Club

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

在设计技巧、可用性与内容构建上,令人印象最深刻的俱乐部网站应该就是阿森纳的了。网站使用了时下流行的响应式设计,而令人惊艳的地方在于,不论在什么设备上查看,网站内容排版设计都惊人的一致且赏心悦目,阅读体验极好,这一点非常难得。

FIFA 官方 app

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

FIFA的官方APP整体设计清爽,UI排版在同类产品中非常突出。清晰的大字体、帅气的大图和清爽的图标共同营造出APP的愉悦使用体验。值得一提的是,APP的设计给人的感觉和阿森纳的官网很相似,但是这并不是坏事——相似的美感并不会构成抄袭。

Formula 1 official website

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

这是一级方程式赛车的官网,整体设计漂亮,反应灵敏,视觉设计丰富而不单调,交互有趣而执行有力,动画元素的引入为整个网站创造出引人入胜的体验。

Adidas website

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

阿迪达斯的官网同样是使用大量精致而富有张力的影像来营造氛围,如果你仔细研究网站的每个Banner和每个标题,你会从中学到许多吸引用户注意力的设计技巧。

Lecoqsportif

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

运动品牌 le coq sportif 官网设计非常现代,扁平而干净的风格可能是这个列表中最清爽简约的一个。网站的整体结构温故,干净的排版设计和高品质的图片选取使得整个网站的可读性非常高。

Fight4pride.ca

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

大胆清晰的排版,在暗色调的背景衬托之下,让网站内容在视觉上脱颖而出,设计师还使用了大量的过度动效来呈现交互,为整个网站的气质加分不少。从网站设计和功能,我们可以清晰地观察到设计师和开发者在完成整个网站的过程中,有着高度协调的合作。

BBC Sport app

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

对于英国的体育迷而言,BBC的体育APP客户端让关注比赛成为了一件极为简单的事情。作为世界著名的媒体大鳄,BBC一直坚持不懈地完善他们的数字产品,而他们的这款APP也秉承着他们一贯的风格:清爽、实用、良好的用户体验。

Amir Khan World

精选最优秀的体育类网站与APP设计欣赏,PS教程,思缘教程网

 收藏
说点什么吧
  • 全部评论(0
    还没有评论,快来抢沙发吧!