【CDC TALK】第五期:第一现场

【CDC TALK】第五期:第一现场

CDC是腾讯的公司级设计团队,一直致力于用户研究在互联网方面的探索和发展,如设计、体验、产品、运营、市场品牌、投资战略、互联网生态行业、社会产业和研究工具平台等方向。

CDC TALK的举办已持续了三年的时间,每年都会邀请来自CDC设计、用研、品牌、开发等岗位的6位达人,带来CDC在互联网跨界实践中的第一手专业分享,为同行提供满满的学习干货。

本期先带大家走入第五篇:

第一现场
郑焕义|腾讯CDC设计研发中心高级工程师

下面内容是我在 2019 CDC Talk 上的讲稿,主要分享在前端开发这个岗位上,我感受到愉悦的几个时刻,希望给有志加入这个职业或者正在这个岗位上工作的人,带来一点前进的动力。

想了解全部内容可查看的我的 Keynote 和 现场回放

一/成就感

        十年前,大三的暑假,因一个偶然的机会,我拿到了阿里的的实习 offer,一个人来到杭州实习,那里是国内第一批前端开发工程师诞生的地方,但是和大多数新人一样,除了切页面,做动效,调数据,其实我并不清楚前端开发具体的角色。

        我带着疑问,虚心地请教了我的导师,我希望他从整个公司的运作,从研发流程,从行业的现状和发展,里里外外跟我解释一遍前端的角色,没想到的是,他只是抛下一句,前端开发就是第一现场,就打发我走。

前端萌新请教导师

        2009年,我实习的第一个任务是做淘宝社交社区(当时叫淘江湖)的一个运营活动,活动本身并不复杂,需要我做一个拼图游戏,用户邀请好友加入社区,获得拼图的碎片,挤满碎片拼出公仔的图案后,就能获得公仔。

好友总动员

        当年淘宝做社交社区的竞争对手是QQ空间,运营的 KPI 压力非常大,当我还在潜心研究如何实现业务逻辑时,活动的方案因为各种原因,已经改了不下数十遍,直到上线前一晚,才最终敲定,这时的我,虽然还不知天高地厚,但也能明显感觉到身上的压力,产品口头一说,设计师 Photoshop 一画,后台配置一改,万事俱备,只缺前端。

        除了上线的压力,更大的压力还来自于空气中凝漫着的,对一个实习生不信任的气息,对于一个没有经验的实习生来说,除了埋下头,重新切图,专注码码,看着接口套模板外,好像没别的事情能做了,凌晨5点,当我第一次调通流程时,我差点喊了出来,但我还是故作镇定的说了一句,”可以了”。

第一次经历发布

        项目组所有人马上围了过来,我现在还能感觉到他们当时从焦虑,不安变成异常的期待和兴奋。

        这是我第一次感受到的第一现场,是产品诞生第一刻的现场。前端开发,把需求,逻辑,设计,数据变成用户真正看得见摸得着的产品,在产品诞生的一刻,收获他人的认同,收获从虚无缥缈到实际落地的快感。

        活动按时在早上9点上线,最终带来了 1.45 亿用户,我还记得那天杭州在下雪,对于一个广东人来说,第一次产品发布和第一次看雪一样难忘。

二/责任感

        毕业后我到了腾讯,我不断在工作中学习知识和积累经验,在业务上,我总是想扩展前端开发的边际,2010年,智能手机刚兴起,HTML 5 还在草案,移动端浏览器已经能比较好地支持了 Geolocation API,我为 QQ 电影票做了第一个移动端的 demo,当 Hybrid 混合应用开始出现时,我和客户端开发的同学一起封装了基于 Webkit 内核的腾讯视频 Mac 客户端

这是一系列没上线的DEMO

        很快,我的虚荣心和成就感已经得不到满足,前端的角色只是在实现产品吗,前端能否做得更多?

前端开发能否做更多?

        我辗转从出去创业到创业失败回流腾讯,我需要负责的业务也从 C 端产品转到了内部系统,2014年,公司内部的项目管理系统进行改版,改版的目标是实现一套更现代的 UI,同时对积累已久的体验问题进行一次优化,我有意识的观察了身边同事使用的习惯,我想当然的做出了一个当页面滚动时,把一级和二级导航融合在一起置顶的体验,没想到的是,上线后就收到一大堆吐槽,原来导航合并置顶后,用户找不到自己工作台的入口了,也没法回到首页,产品经理非常强烈地要求我改回去。

前端开发背锅现场

        这是我第二次感受到的第一现场,产品体验问题暴露后第一时间背锅的现场。除了背锅,我感受更多的是前端的责任,作为与用户最贴近的角色,不管是交互操作的问题,还是视觉风格的问题,还是产品性能,系统稳定,数据准确等等的问题,用户所有的体验问题都与前端开发有关,所谓背锅的现场其实是第一责任现场。

产品问题暴露后第一时间需要负责

三/幸福感

        我开始系统性的学习交互,学习信息架构,看各类用户研究的分析,虽然都只是些皮毛,但是我能真切地感觉到自己回到了原点,重新探索前端开发的边际,也是从那时起,我开始承担团队负责人的角色。

系统化学习

        我和交互设计师一起重新梳理了系统的信息架构,设计上左内容的结构,和用研同学一起走访内部同事,按类别逐一分析问题。

        新版本灰度发布,我们同时给用户提供了切换回旧版的功能,我小心机地在按钮上做了埋点,每当有用户切回旧版,我就会亲切的到 RTX 上问候他是什么原因。

        虽然最终花了很长时间,我们才完成整个新版的上线,新版的数据也平平无奇,但每当我发现用户说出跟我理解的不一样的问题时,我心中总是有点小确幸,因为我知道我离用户又更进了一步,此时我第三次感受到的第一现场,是实实在在和用户在一起的现场

和用户在一起的现场

四/自豪感

        2016年,我们开发公司的投资并购系统,因为是内部系统,我们用户只有50多个投资经理和他们的老板,我们信心十足,因为与面向海量用户的产品相比,我们只需要服务好这50多个人就够了。

        由于每个投资项目的数据量非常巨大,为了提升用户打开项目列表和进入详情的速度,我们利用资源离线包和客户端缓存数据的技术,让用户打开的速度提升了80%,因为投资并购都是机密的信息,为了方便追查数据泄露的源头,一般产品都会在界面上用显性水印遮挡内容,我们为了不影响用户正常的浏览体验,发明了隐性水印的专利,把用户的身份信息隐藏在界面内。

        项目的另外一个挑战是,出于对数据安全的考虑,我们开发人员无法像一般产品一样体验到用户的正式环境,我们想尽办法希望能尽量贴近用户的真实场景,只是总有一些让我们想不到的情况发生,我们开始思考除了模拟用户的真实场景外,有没有办法把用户的操作和所有的行为都记录下来,还有更重要的,有没有办法更直观的把用户的行为还原出来,我们想到了在用户端录屏的方式,但显然这样做对用户端的的性能影响太大了。

        不断地尝试和摸索,我们想出了解决方案,我们把用户行为相关的信息分为五类,操作事件、界面变化、内容数据、路径、时间轴,每类信息有相应的数据流格式,用户在使用我们系统时,我们把收集的数据储放在用户的客户端,在空闲时我们再异步将数据同步到后端,数据在后台再组合到时间轴上,最后用逐帧播放的方式把用户的行为还原成直观的视频。现在我们有能力真正站在用户的视角观察和发现问题。

记录用户行为和还原

        当没有用户现场时,我们自己创造了用户现场,现在我们有能力真正站在用户的视角观察和发现问题,甚至是用户自己都没发现的问题,我没有参与这个项目的开发,我为我的小伙伴们感到骄傲,这是我第四次感受的第一现场,是开发者自己创造的第一人称现场

开发者自己创造的第一人称现场

        我为我的小伙伴们感到自豪,自豪的是我们始终坚持用户为中心,不断突破技术的瓶颈,开发者就是创造者。

        10年很快,一句不经意话,如何解读已经不再重要。我的故事没有惊涛骇浪的情节,没有意想不到的结局,只有对专业执念的探索,前端开发带给我快乐,给我带来成就感,责任感,幸福感和自豪感,也正是这些小小的快乐,不断推动我向前探索前端开发的无限可能。

        如果现在有人问我前端开发到底是什么角色,我会说:

  1. 前端开发是对产品的无限责任,时刻为出现的任何体验问题负责;

  2. 前端开发是对技术的极致追求,为用户的每一处方便耗尽的心血。

前端开发就是用户体验的第一现场。