前言:

如果你碰巧是一名前端开发,而又碰巧在维护着一个对可用性有极高要求的站点,那么也许你我有过共同的苦恼:如何在第一时间发现线上出现的前端异常?毕竟前端不是每天都可以过网页裸奔节,线上的Javascript错误也足以让用户抓狂地拿起他们的投诉电话。。。每天心惊胆战发布的日子不好过吧?

是时候改变下了,让心惊胆战见鬼去吧!我的目标很简单:要在用户和boss发现异常之前就彻底修复问题,其余的时间充分地享受高质量生活:)

一:前端异常监控系统的构建目标

在对被监控页面无侵入的前提下,提供7*24小时全天候的监控任务,第一时间发现“裸奔”、“半裸奔”页面或是有Javascript异常抛出的页面,并给网站前端负责人提供短信、邮件等方式的报警服务。

可以说,前端异常监控系统主要是解决两大异常情况:a. 页面上有javascript异常  b. 各种因素造成的页面的样式丢失。我先分别介绍下两种这两种异常的解决思路:

二:Javascript的异常监控

由于客户端浏览器环境的不同,在开发环境中能够工作的代码,并非就能够在用户的电脑上正常运行,各种畸形浏览器造成的问题弄得我们很头大,如果能像后端开发那样可以随时地查看服务器端错误日志就好了!可为什么不呢?

Javascript语言自身就提供了try catch的异常处理语法,我们假以利用的话,就能够在增强前端应用鲁棒性的同时,又可以把捕获到的异常抛送给前端异常监控系统,以错误日志的形式记录到数据库中。

给应用添加异常处理功能,我们是可以充分发挥javascript语言是动态语言这一优势的。我可不想为了添加异常处理而在代码中写N多的try-catch语句。 我的思路是:通过Javascript类模块在应用中注册的时候,遍历类模块中的每个函数,然后统一的加上try-catch处理,这样前端里面的所有函数就都在异常处理的范围之内了。怎么样,是不是要比Java等静态语言cool很多? 代码示例如下:
查看更多

如何拓展设计思维


近期参加小组周会,其中一个环节是营销设计组的作品点评,虽然自己有很长一段时间没有设计这类需求,但一直在关注,平时不定期的收藏了一些图片和网页,拿出来与大家分享,并且从几个方面来谈谈怎样的设计能给人留下深刻印象。

什么是设计?
关于“设计”的含义有着许多种解释,每个人对设计都有自己的理解和体会,甚至具体到一个点,一个色块。百度说,设计是一种计划、规划、设想通过视觉的形式传达出来的活动过程。也有人说设计是把自己的想法直接呈现出来的手段。甚至还有人说…
总之,我认为无论设计是以何种形态出现,目的都为了更好地传递背后的信息,给用户留下深刻的视觉印象。要想给人留下深刻印象最好的办法就是视觉冲击力,运用视觉艺术,通过造型、颜色等展现出来,形成独特的视觉魅力,直达视觉感官,从而吸引用户使他们愿意停留较长时间进行阅读,也就是说设计是为了更好的传播信息而使用的一种手段。

怎样的设计能给人留下深刻印象?

名人效应(借助名人或明星效应,产生不言而喻的说服力)
每人内心都有自己仰慕或效仿的对象,而且有一种想尽可能地向他靠近的心理欲求,从而获得心理上的满足。在选择人物形象时必须要与产品的品格相吻合、使用户快速理解产品传递的特点和价值,比如我们以往的设计作品中经常会使用到马云的形象,他在互联网具有极高的话语权,选择用他的形象来推广产品能产生不可言喻的说服力,当然你不能滥用。 查看更多

插播一段广告:本项目10月10日第一期删减版公映!10月底会发布完整无删减版,敬请期待!发布地址:info.1688.com

 

序:

2年前,刚入职阿里还没转正就有幸参与了资讯改版项目,那可是我的产品处女秀,出演视觉设计师一角,当时拿到手的就已经是一份未上色的黑白稿以及一份飞机稿。不知道监制是谁,也不知道导演是谁,更不知道其他演员是谁,老板说交给我了,就糊里糊涂的出演了。跌跌撞撞演出7.8个版本就拿去让需求方选了,最后也是蛮顺利的选了一版。然后再优化再改改,也在那一周每天熬到个11点,最后在约定时间之前,交给负责后期的前端同学,然后,然后就上线了。。。当时的感受是:原来产品设计就是这样的啊。。上线之后,不尽人意,很多东西和我想象的还是有点距离。

 

2个月前,也满了2周年,我似乎发现我与“2”这个数字非常有缘,回头在看看,原来我从来都不曾离开社区。这次我又接到了资讯升级的任务,意料之中,经过2年的滚打,我早想改他了,碍于“没有资源”,幸好行巅有眼开了金口,要求资讯要更专业更海量更权威!于是乎,我就又一次出演了资讯升级项目!这次的出演真是感触颇深了,虽然仍然是出演视觉设计师一角,但是要让最后的作品能接近完美的出现在众人面前,光只做好自己的本职是完全不够的,当然在这个过程当中,如果你也遇到了像小帅和狒狒这种出色的监制,也是可以省去非常多的时间,比如我可以不用花太多时间去纠结数据问题,打点问题,也不用想着如何去重复解释这里为什么要这样演的问题等等…尽管如此,也不代表我出了做好视觉,其他都不用管了,否则,视觉设计师就永远都是美工了:不想做监制的演员都不是好导演!不想做PM的体验设计师不是好产品经理!被复制了无数版本的名言用在很多地方都是很有效的。也为了更丰富自己的历练和对项目的了解,很多事仍然要亲力亲为,尽管最后仍然有很多细小的问题暴露出来,但是回头想想,如果什么都不做,最后暴露出来的问题会更多,虽然没有做到心目中的完美,但是至少离“完美”又近了一步。

————————————————我是分割线!——————————————————

 项目总流程:


查看更多

存在的问题

1.老版企业在线视觉风格相对现有网站整体风格已有些过时,整体与网站改版后简洁风格不够协调。


2.系统自动发出的消息弹框,对浏览旺铺的买家用户造成较大干扰。
优化目标
1.增加买卖双方体验,特别是减少对买家的干扰。
2.企业在线与现有旺铺样式统一,视觉风格更为简洁。未读消息提示框位置调整,不遮挡旺铺主体区域。

用例模型和角色关系
之前:
查看更多

前听过这样一个故事,南方的孩子没见过雪,所以不知道雪是什么东西。老师说雪是纯白的,儿童就将雪想像成盐;老师说雪是冷的,儿童将雪想像成了冰淇淋;老师说雪是细细的,儿童就将雪想像成了沙子。最后,儿童在考试的时候,这样描述雪:雪是淡黄色,味道又冷又咸的沙。从这个故事,是否可以联想到设计师和产品经理或营销专员之间的那点儿事?这里聊聊我对于设计时存在的沟通问题的理解,和总结的一些沟通方法,希望能给刚入行或正为此事伤脑经的你一点帮助。

在工作中,设计师是否经常遇到类似这样的问题:

需求方指着设计稿说,按钮应该更大点儿。颜色改个红色的会更好。不够大气!#¥%&*)(…。再或者,因为沟通不顺畅、不透彻,导致设计师对产品或对需求理解有误,后期花了大量的时间去再讨论,去修改或优化。

诸如此类的问题的确让设计师苦不堪言,我们经常抱怨产品经理没有眼光,或者表达力有问题,浪费大家的时间。殊不知,这是双方沟通出了问题。

在我看来,设计之初的沟通是至关重要的,设计作品是团队共同的结晶,一起捏的小人儿。需求没有描述清楚,出来的儿子产品经理怎么看都不像是亲生的,当然不悦。当前期就商量好这鼻子嘴巴耳朵长什么样了,捏的过程中再不断商榷细化,那么结果就自然是皆大欢喜的,儿子再丑也是咱亲生的,在双方共同努力下诞生的,这样也就避免了后期不必要的纷争,降低了后期沟通成本。所以,及时有效的沟通是很重要的。

查看更多