查看原文
其他

《华尔街日报》用互动地图做新闻,调查报道变得更“移动友好”了! | 独家编译

2015-10-16 腾讯传媒 全媒派

大众汽车丑闻发生后,《华尔街日报》在数据报道上再出“神作”!一款互动地图轻量化呈现海量数据信息,他们是怎么做到的?




本文由腾讯旗下产品“全媒派”独家编译。作者系Mădălina Ciobanu,原文载于journalism.co.uk。未经授权,谢绝转载。授权合作请联系quanmeipai0321@qq.com。


路媒体在移动端的动作简直是“兵不血刃”,移动端编辑法则、H5制作秘笈层出不穷。而《华尔街日报》再次发力,又一次把同业者甩到了身后。


这一次,《华尔街日报》操心的是,如何在移动端呈现调查报道?大量数据如何更“轻量化”呈现在读者眼前?


前段时间大众汽车丑闻事件不断发酵,《华尔街日报》独家采用互动地图形式,为读者带来了更友好的移动阅读体验。


这场“先锋之役”如何打响?先看看他们是怎样把移动端页面开发和互动系统相匹配的。




互动地图设计初衷更直观、更友好的移动阅读体验


日前,大众汽车被报道在汽车尾气排放测试结果中作弊,近年来涉及排放作弊的柴油车辆共1100万辆。



大众汽车总裁文德恩


“不明真相”的读者需要知道更多数据,更多直指事实的证据。《华尔街日报》记者Elliot Bentley为了跟踪报道尾气排放丑闻事件,提出以“互动地图”的形式进行核心数据报道。


“我们一直在研究两个问题:为何柴油车在欧洲卖得更好,那些车的排量是否较高。”Bentley说,“当我们快速查阅欧洲环境署的数据库时,我们眼前一亮, 觉得应该设计一个互动型地图。”


这个互动地图是专门为此报道而创造的,是Bently用了四天半的时间去了解熟悉一个从未涉及的领域后研制的。



《华尔街日报》空气污染地图界面


这款“互动地图”在报道上有以下特点:


1. 读者感受更为直观


这款地图在制作时使用了Leaflet JS、Leaflet KNN和Mapbox等工具,显示了欧洲各地二氧化碳排放以及个别国家汽车尾气排放导致空气污染的最新情况。


地图可以让读者以更大的画面角度比较各国的污染程度,或准确查明一个详细地点的污染状况。表明空气污染程度的蓝色和棕色给读者十分直观的感受。各城市的空气污染数据点击对应图标时就会弹出。


Bentley说:"地图上的图标如果足够大,就能拥有极强的读者互动性,用起来也会非常有趣。但有时候那些大图标会遮挡一些内容,影响我们查看地图。我想这款地图在这方面还是取得了一定进步。"


这种简单,直观,易懂而又信息量大的的特性正是《华尔街日报》所看重的,他们希望让读者同时掌握各种不一样的资料。


2. 更友好的移动体验


除了页面设计的简洁明了,能在手机移动端打开也是地图的最大特色,而这正是《华尔街日报》的设计初衷。



《华尔街日报》空气污染地图手机端截图


这款地图包含了一个搜索框,让读者通过搜索来对比不同城市的结果。


Bentley认为,手机端上的全屏地图并不够移动友好,无论是拖动地图还是点击某处查看详情,都不方便,因此他们最初的设想就只有一个搜索框,让用户自行搜索,对比数据。然而,他们最后还是放弃了这个设计,因为他们意识到:地图本身才是关键所在。


我认为现在最大的挑战就是如何在移动端上为读者呈现海量数据,因为手机屏幕太小了,发挥的空间并不多。因此产品必须要足够智能。


对此他拿《卫报》最近推出的房价地图来举例,这款地图在移动端打开时包含一个按钮,帮助读者随时切换至全屏地图。



《卫报》的 Recent Property Prices Map (近期资产价格地图)


互动地图设计思路借鉴Google Map和Airbnb


这个设计本身堪称是一个脑洞大开的示范。互动地图同时从严肃模式的Google Maps App和新颖的Airbnb App中汲取灵感,Bentley 表示:“这些系统是成功在地图上进行巧妙互动的典范。”


仔细分析来看,Google Maps App的特点在于内容更新快、实时搜索效率高,并包含离线地图、商家信息、路线计算和卫星定位服务。




而Airbnb的特点则在于各式实用信息新颖的页面布局。




《华尔街日报》借鉴了Google Maps App的快速移动定位技术,加上Airbnb提供各式服务信息的产品理念,把欧洲空气质量监测局的数据集合成互动式地图。


此外,《卫报》的一则资产价格地图也给予Bentley以启发,这则资产地图设计了一个按钮,能够让读者在“完整版”或“简洁版”之间随时切换。


“我认为现在的挑战是你如何在手机上呈现大的数据库信息”Bentley说,“手机屏幕如此之小,而你又不能在页面上放上工具栏,所以,你要对数据足够敏感,也要擅于总结信息”。


设计元素简洁至上重复使用“模板”时,不妨换上新衣


尽管地图设计面临重复应用的问题,Bentley还是竭力避免拼凑感和模板,“除非某种类型真的非常突出,或具有普遍应用性”,这是他的建议。


Bentley总结自己的经验,他认为,如果需要重复用某种地图模式,在底层设计没有完善解决前,不妨给旧套路换上新装——起码让它看起来是新的。

《华尔街日报》互动地图最重要的界面呈现在于“简洁”:并不需要多么复杂的界面设计,它基于有趣而丰富的数据,设计者只要做到让界面足够简单,用一种清晰的呈现方式引导受众阅读即可。


互动地图在报道诸如大众汽车丑闻事件等需要大量数据支撑、并以数据源做深度分析时,可谓报道“神器”。《华尔街日报》以移动友好为设计出发点,为此类调查性稿件提供了更轻量化的数据处理方式。


...

点击图片阅读我们的推荐



Buzzfeed移动端主编:要在更小的屏幕上做更核心的内容!



点击关键词查看对应内容:

长期加班 | GoPro转型 | 社交媒体 | 记者薪水 | 大神公关稿 | TED演讲 | 高温天 | VOX | 二战电影 | 美食剧 | FT易主 | 电竞主播 | 媒体团灭 | 秘密花园 | 卫报 | 华尔街日报 | 本土港媒 | 创业公司死法 | 新视野号 | Vice纪录片 |

点击阅读原文或点击头像查看历史消息


您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存