案例对比：《你被谁代表了？》VS《Who runs China》 #48
Replies: 4 comments
-
Beta Was this translation helpful? Give feedback.
-
|
他们究竟是谁？ 代表名单江苏(144人)马秋林王卫东王天琦王立峰王吉永王 江王红军王 芳(女)王连春王利平王贻芳王 秦王常松王维峰王 超王强众王静成王嘉鹏王 巍车 捷尹中卿龙 翔史立军付红玲(女)邢青松吉炳轩吉桂凤(女)权太琦(女)吕 建朱小坤朱 晶(女)庄毓敏(女)刘 华(女)刘怀平刘忠斌(回族)刘锦兰刘 璠齐家滨闫丽娟(女)孙桂泉孙景南(女)孙飘扬杜小刚李叶红(女)李亚平李学勇李承霞(女)李鸿彬李甦雁(女)李 晴李楠楠(女)李 薇(女)杨庚豹杨恒俊杨 震肖 伟吴向东吴国平吴政隆吴惠芳何健忠佘才高余瑞玉(女)冷 溶汪 泉沈仁芳宋 勇张叶飞张立祥张近东张春生张 勇张晓北张爱军张常宁(女)张道衡张 雷陆永泉陆亚萍(女)陈 立陈丽芬(女)陈 杰陈蒙蒙陈锦石陈静瑜陈震宁陈 澄(女)陈 鑫招启柏欧阳华周立成周素明周铁根周善红郑葵阳项雪龙赵 伟(女)胡 冶胡明春柯 军段 俊(女)皇甫立同侯学元昝圣达娄勤俭费少云秦光蔚(女)聂永平莫元花(女)夏道虎钱加艳(女)钱凯法徐一平徐华勤徐 莹徐郭平殷 勇翁孟勇凌 屹高苏娟(女)高毅进郭新明唐金海唐慧娟(女)曹鸿鸣崔桂亮崔根良银 燕葛 菲(女)葛道凯蒋宇霞(女)韩立明(女)焦新安鲁培军鲁 曼(女)谢志成窦希萍(女,满族)蔡达峰蔡 昉熊思东潘雪平戴元湖戴雅萍(女)戴 源 |
Beta Was this translation helpful? Give feedback.
-
|
Beta Was this translation helpful? Give feedback.
-
|
data https://news.cgtn.com/event/2019/whorunschina/js/data.js |
Beta Was this translation helpful? Give feedback.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
-
《你被谁代表了？2666位全国人大代表身份大全》
作品链接：https://mp.weixin.qq.com/s/s5HIxhauiHmXQfRiCkNFjg
一、作品内容
文章围绕人大代表的身份画像，上升到在民主集中制体制下，谁在代表了广大人民的问题。文章包括了人大代表的籍贯、代表影响力（某籍贯人大代表在异地当选）、代表包容性（本地人大代表的异地籍贯）、性别比（横向、纵向比较）、年龄分布、民族、学历、党派、职业等信息。
在综合分析以上诸多信息后，文章得出结论：中共党员多、非中共党员少；干部多、群众少；男的多、女的少；经营管理者多、普通职工少；个体私业主多、社会弱势群体少。同时，文章发现了女性代表占比提升，年轻代表中女性比例较高的趋势。
二、数据获取和文章形式
数据获取方式：在中国人大网确定名单，核真录的记者们联系读者，一起人工爬取。每个人负责几个省份，在百度百科和维基百科搜索代表的各维度信息，确认好数据后，记者利用花火Hanabi作图（静态图 https://hanabi.data-viz.cn/templates?lang=zh-CN）最终制作成word文档，排版至微信公众号。
问题：
静态图，缺少互动，每张图能展现的内容有限
冗长 ，不方便读者查找
Who runs China？
作品链接：https://news.cgtn.com/event/2019/whorunschina/index.html
一、内容介绍：
1、引入
大数据交互可视化网络报道《Who Runs China》于2019年3月4日全国两会期间在CGTN官网、客户端、脸书、推特、微博、微信等平台同步上线，不到24小时便获得200万浏览量；上线两周，全平台单帖浏览量超过2000万，其中海外用户访问量超过80%。
作品从年龄分布、民族情况、教育程度、政治面貌等人文视角做了全国人大代表信息可视化呈现和分析。
2、数据处理
搜集：部分人工搜索核对，大部分来自于使用python爬取全国人大代表信息库http://www.npc.gov.cn/
作者tips：先对于基本数据进行分析，得出若干数据结论，再根据主题想表达的内容叙事线进行数据结论以及数据的详略分配。
（1）人大代表画像
女性占比提升显著
第十三届全国人民代表大会实有代表2975人。其中，男性2233人，女性742人，女性占比24.94%，仅是男性代表的1/3；但相较于第十届全国人大代表，女性20.23%的占比有所增长。
同时，全国人大代表越年轻，性别比例越均衡。50后男女比例超过7:1，60后接近4:1，80后比例接近持平。另外，本届还有28名全国人大代表是90后，其中女性比男性多出8人。
顶梁柱——上世纪60年代人
他们的平均年龄是53.77岁。其中有超过一半的代表出生在上世纪60年代，占比最多。----社会掌握权力的群体集中在这一年龄段。
各民族均有一席之地
全国人大代表来自全国56个民族，其中汉族代表人数遥遥领先，占全国人大代表总人数的85%，而代表人数占本民族总人数比例最高的民族是塔塔尔族，大约每3600人中就有1人是全国人大代表；比例最低的是拉祜族，平均100万人中只有2.06人是全国人大代表。
大部分人拥有高学历
2975名全国人大代表中，90%都拥有学士学位及以上学历，其中，硕士836人，博士584人。其中，文科生人数远超理科生，人数几乎是理科专业代表的两倍。另外，这些全国人大代表中有1/5都是管理学相关专业的毕业生。（其次是工程、经济、法律...）共有122名全国人大代表拥有海外留学经历。
就政治面貌而言，这2975名人大代表中既有中国共产党员（2172名），也有无党派人士（423名），还有部分来自8个民主党派（共380名）。受教育程度最高的党派是九三学社，84%的成员拥有硕士和博士学位。
（2）政府工作报告分析
（3）法院检察院工作报告分析
二、可视化效果分析
（1）图表格式
在人大代表画像部分，每个点象征一个人物，随着学历、性别等等分类移动。
民族的展示：不同民族人大代表的数量对比+民族的多元。
籍贯和党派部分：桑基图
人民法院&人民检察院工作报告：复合树状图 超大信息量
手机端：对密恐人士不太友好
作者tips：首先绝大部分时间要保证清晰可读，特别偶尔可以“炫技”，“炫技”的可视化是一种强调，可视化方式根据数据和设计师的创作灵感。
（2）互动
体验：H5（手机端）&竖屏滑动
在手机端，用户竖屏上下滑动来感受图表、原点的变化--增强了视觉冲击感---容易接受信息&提升用户体验感
政府工作报告：字数统计&词频统计 变化过程：下滑网页-从1993年的发展指标过渡到2018年
用PC端观看时，鼠标点击每个小圆点--出现相对应的代表信息--满足不同受众对于不同信息的需求&提升受众在获取信息时的趣味性
三．主题升华
定位：政治色彩+对外
1随着互联网技术的发展，国家主流媒体对“两会”的报道更趋多元化、技术化，以此来满足我国社会群众及海外受众的需求。
2对外宣传我国的两会代表来自人民，具有广泛的人民性及代表性，并且随着时代的发展，我们的代表组成结构更趋于合理化全面化。
3它的内容涵盖方面较广，使受众增强了对“90后”以及“女性”这两个长期以来被特殊化了的群体的正面认识，同时增强了民族自豪感。
4中国政府和司法体系越来越关注普通公民的福祉。
四．技术实现方式（作者特供+学习笔记）
明确几个概念
语言：JavaScript 前端语言 Java后端语言
前端：用来表示点一下鼠标会发生什么（表面）
后端：表示它会怎么处理你的请求，帮你读取什么数据（深层）
语言特质：一个交互机制，不像python一样按顺序运行，可以同时实现一个东西在移动，另一个东西在响应你的鼠标点击（一般能够设计界面的语言都有这个特质）
代码分成两部分：动画&交互
动画：显示粒子及其运动
交互：读者如何与网页进行交互，比如说点击触发弹窗
canvas：js的一种用来绘图的组件，一种画布，可以在屏幕上框出一个区域，通过写代码置入图片/调整位置
Svg：可以被显示在canvas上的一种图片格式，可以添加交互事件，d3和svg是差不多的东西
可以转成txt-读txt解析颜色形状位置大小-通过代码调整位置…
scrollama.js是一个js的插件（需要下载），是用来控制页面滚动的，鼠标滚动让页面来到某个地方的时候会触发什么事件
fsm是有限状态机
eg：网购商品-在商店/在购物车/已经下单，有限：状态数是有限的，而不是说是有无限多个状态
状态机：能够根据确定的事件去获得确定的结果 一些事件触发一些状态
滚动触发渲染
问题：
写好了一堆渲染-屏幕一次只能装一个渲染-滚动太快-前一个渲染没结束就触发下一个渲染（顶替）
布局：
Div:一个结构布局的概念
scaleToWindow库：把一些其它组件放进去来进行布局，提供了很多功能
Who runs china 实现方式简介 1.pdf
思考
*课程上学到的东西和业界作品有什么联系？
*新闻专业的学生如何在短时间内掌握代码并做出交互式作品？
Beta Was this translation helpful? Give feedback.
All reactions