我的汽车梦

      最近乐视的负面新闻如乌云般黑压压的袭来,各大领导沉默不语半天闷不出个响雷!我坐在前往3楼hr办公室的楼梯口,每天都能看到有人拿着hr开具的离职证明的小纸条,满面春风貌似终于脱离的险境,偶尔看到结伴离职的同事欢声笑语……!

      我不禁在想离职至于如此开心?当时来乐视的初衷是什么?是被胁迫的哭着来的?还只是为了那一份工资!悲哀!我坚信团队和希望,至少他给我造了一个梦-汽车梦。在我人生重要的节点我满怀期待的加入,相信这个给我造梦的公司!可没想眼见他起高楼,眼见他楼塌了!难道就该撤么?在公司遇到如此困难的时候我们不是因该更加的团结和努力一起度过难关么?整个感觉大家就如同摆设一般,哀莫大于心死 悲莫过于无声啊!

      公司的问题可能跟外面暴露的相差不远,我的工作居住证也是奇葩的断掉没能续上!办公用品一律没有,办公环境也差,底层与高层完全脱轨大领导是谁是谁是谁!人力几乎虚设,等等这些真的那么重要吗?

      唯一想说的是可惜了我们的团队,我们的vp自己谈商务拉融资,产品经理拓展产品业务自己找供应商,开发一人頂两的干活,我的领导身为总监却始终战斗在产品一线从未脱产,他是我们设计团队的标杆风向标,积极的工作态度对工作以身作则无半点懈怠!常说用产品来证明价值。我们HMI组能力都很强每个人都能独挡一面做事干练还细腻入微,哎!真心不错干实事的团队啊(呐喊)!

      难道真是大势已去了?最近我的信念开始动摇了,没人告诉你是死是活,内部也一片恐慌……。真心放不下手上的产品!近一年的努力付出难道付诸东流?人生多少个一年!其中一个产品“互联车机”相比大家熟知的荣威RX5的“云OS”,我们的产品更具竞争力,单视觉就落他几条街!ID更没得比,成本相比他的1/10不到,它们花了多少时间我们才多少时间!这么一个极具战斗力的团队可能也将分崩离析,看过白鹿原的可能知道原上闹饥荒的那一段白嘉轩说的一句话:“人心不能散嘞!”现在谁是我们的白嘉轩?谁是那个借粮的土匪?现在我唯一能做的就是做好手里的工作,推动现有的项目落地,做到善始善终这样至少对得起这个项目和公司,也不枉费自己努力吧……

      发泄了这么多,说说我的汽车梦吧!汽车智能化势在必行,这个领域让我心动,如何让车智能化,过程这个点也足以让我肃然起敬参与其中不顾一切,站在巨人的肩膀,走在世界前沿!很荣幸能参加了FF-91项目当中,在拉锯式与国外PK中我们涉足了一些视觉上的工作,已是知足,HUD/AR项目让我看到汽车还有更多的可能扩展的我的视野,在互联车机项目的摸索中让我快速熟悉汽车软硬件之间如何工作的并定义了整套视觉风格,轻松的语音对话可以控制车辆每一个零部件让我看到汽车的未来,这些虽然只是智能汽车前进方向的填路沙却都足以点燃我的一腔热血……。

我的汽车梦!真想自己参与每一个历史性的时刻,见证智能汽车时代的到来…..。

当当wap站崛起

很多朋友估计还不太了解wap,其实就是手机访问的网页版也叫触屏站,说起这个呢也算是15年对自己的一个交代吧,15年初团队解散,我依旧接管无限购物这边,可是话语权几乎全无,为此比较消极,正好跟一产品聊天,他负责wap站一直没有起色,我记得我非常认真的问了一句:“wap站重要么?”孟(产品经理)非常肯定的说:“当然重要啊,那些通过app上的分享还有微信上的这种社交分享都是wap承载做到的”哦这么厉害呢,我想了一会说:真的重要?孟:嗯,我:那我来做这边的全部视觉。

就这样我将阵地转移到了wap站,设计跟app心态一样,而区别在于这是一块无人关注的土地,因该会更自由一些,对于熟知前端的我更是得心应手,将前端、运营、产品等问题都考虑进去,统一样式,简化多余而无关紧要的视觉元素,让前端工程师更容易实现,摘取app运营部分功能及图片保持尺寸上的等比统一,减轻运营压力,将底部浮层功集成之更多做为统一的功能入口,减少由于浏览器版本所造成的适配问题,短短1个月,首页改版上线了!

触屏对比

 

上线没多久反响不小,竟然惊动了老板娘!打听发现原来她经常用wap版本,领导纷纷关注触屏的发展,各种需求随之而来就连广告都一分为二!真不知道是好事还是坏事!

jieping

首页的楼层也是越来越高,各事业部纷纷要求增加首页入口,哎!不管怎样还算是一块净土,里面的页面逐渐清新,为了保证风格统一我又出了一个触屏的规范,这次跟之前的不一样,规范在设计的过程中逐步形成,边做边规范,直到我写这这篇文章依旧还在补充。

h5规范而整个视觉规范的建立必须由无数的界面去检验,去堆积,慢慢的形成一个体系,他们是一个整体,我要做的就是这些

触屏效果图2

很快我们的努力是值得的,触屏的订单量得到较大提升,连续4个月都拿了奖项,总裁认同奖,团队奖等

屏幕快照 2015-08-31 下午5.48.32

很快我们的微信商城也顺利上线,触屏站的完美告捷,我似乎又到了该离场的时候了,版本还在继续,基本上也就是些购物车等流程上的页面优化,我又开始寻找另外的阵地…… (二级启动页)

jietu

 

 

我在当当的那些事-app设计

忍无可忍无须再忍!作为一个视觉设计师,有责任告诉你们什么是好的设计什么是不好的设计,从来到当当来我的目的非常单纯就是希望通过自己的努力改变当当土鳖的现状,至少在视觉上追上淘宝、天猫、京东等,那个时候在我看来一年的时间足可以做到这一切,为此我收集他们每个版本的视觉风格,关注他们的动向,拓展海外同类竞品,吸取他们的优点,以此来改进当当客户端的视觉,理想是美好的可现实非常坎坷,我还是非常积极的去面对,那就从一个图标开始吧,再不行改个一像素的线条也行…

入职后的一个月里我出了第一稿,(右新稿)图标是我根据线上版本的功能名称写在本子上,然后根据我对扁平化的理解手绘的图标中抽出来的一套,跟打了鸡血一样,实现着自己的目标,001-1024x894

栏目重新划分(ppt截图)

屏幕快照 2015-08-31 下午12.04.41 12.04.56屏幕快照 2015-08-31 下午12.05.31

当当7_02

设计过程,简单的从视觉的统一性开始,将当当的logo颜色应用到整个app当中,能让品牌形象主题更为突出从而获取公共认知度(这么文艺这绿色就tmd当当啦!),然后优化楼层统一样式删除重复功能等,(可是在他们心里电商就因该跟菜市场一样漫天的横幅广告,无处不在的商机入口…)将杂乱的布局以及众多干扰主视觉的颜色减去,然而我没有成功,但同一时期的淘宝4.5版天猫3.2版本京东3.6版已经是是这个样了,

02-1024x599

我很着急,非常急真希望一步到位!在不断的口水战当中,脚步慢了下来,调整自己的心态,通过大家的努力根据实际情况及要求,我们做出第一个改版4.5版,虽然并不理想,但是至少有所改变,其中统一了视觉规范及整理控件库、使用现在最流行的圆圈色块作为功能图标的入口,

当当4.5版

当当4.5版_03

视觉规范

04-1024x594

竞品对比

2221-1024x448

再后来我们又出了的当当4.6版,这一时段当当app的视觉已经有了非常大的突破,在栏目的划分、视觉测侧重、以及对首屏的利用等细节的优化将某狗踩在脚下,平视某猫,看齐淘宝,短短的两个版本下来已经有了这样的成绩也算欣慰…

当当4.6,天猫4.1,版淘宝4.6,京东3.7

未标题-11

视觉规范,说到这里插几句,都说我是高德地图的奠基人之一,其中最重要的一条就是高德地图划时代版本的规范,也是本人呕心沥血,长期驻扎在ios团队获取的成果,在长期团队合作的时候需要有人去整理去统一视觉的输出,虽然很辛苦但是最终的结果还是值得称赞的,到如今养成的习惯,希望自己做出的产品视觉统一、有条有理、干净节俭、而对开发的好处在于便于实现,减少误操作,建立基类控件库,便于整体视觉修改等,(高德地图视觉规范)但是购物并不像工具软件那么简单,他更加复杂更加多样化,但是我可以统一固定的购物主流程的视觉规范因此得到了下面的这个表单,统一文字字号、颜色、功能样式、图标大小、商品图尺寸、按钮等

规范

接下来的下半年我们出了4.7版4.8版两个版本,这两个版本还是非常不错已经有超越的苗头而卡片风格也得以发展,边框更加弱化增强卡片的感觉,通过背景与卡片颜色的对比拉开空间,而同一时期的他们更新较慢估计是因为双11的原因,我可以非常负责任的说我们不仅赶上而且超越了…

(京东4.0、淘宝4.9、天猫4.2)

duib (1)

 

 

我的目的不仅仅如此,我想建立属于自己的团队,至少再换工作的时候这个团队出去的人能够得到业界认可,有底气,我搭建了ued平台(dued.dangdang.com)内刊,周报、分享,成立微信公众号,对外分享属于我们自己的设计理念以及经验总结等,设计属于自己的logo……

dued

blog

weix屏幕快照 2015-08-31 下午7.37.04

年底的一切已改变,我们被推到了风口浪尖上,团队解散!而我们依旧保持着这份热情,用音乐打破这种压抑的气氛,是不是对生活不太满意,很久没有笑过又不知为何~~~!感谢冰哥一直以来对我的支持。14年的理想报复毁之一炬!老胡来个新年版呗~好的…

说一下这个新年版,当当在14年年底最早发出新年版,发版时间远早于淘宝、天猫、京东,而后他们的风格却跟当当新年版接近,从整体风格视觉效果远不及我们,可以说这一年当当在视觉上面付出了极大的努力和付出,感谢小伙伴们,而这次土豪金的想法还得感谢小明老师,本来普通的剪纸风格瞬间高端大气上档次了,让我们一起看看当当4.9版

当当4.9新年版

15年初团队正式解散,我们的声音渐渐淡出了这个舞台,我们成为了水…

而接下来的每一天,我们是单纯的美工,我们可以是淘宝也可以是京东,或许他能够成为最后的赢者(那是不可能的)而在视觉上他已成了一个笑柄,垫底的产品,难道这才是他的气质本身……

(当当5.3、淘宝5.3、 天猫5.8 、京东4.2 )

duibi2-1024x455

最后在这件事情上面用两个字总结“呵呵”献给那些有理想有报复的设计湿们。

其实我并没有放弃,没有放弃这个产品,至少没有放弃自己,我的阵地转移到了无人关注的当当触屏站……(未完待续)

 

 

 

 

当当小产品1、2

摇一摇

说起这个也算是热闹,这是我14年4月到当当后做的第一个活动类界面,想法非常简单就是突出一下气氛弄个可以动的手机,那个时候参考了几个都感觉太过简单,为了烘托气氛加入了霓虹灯,一个拿着手机的手,整个气氛远超过其他同类产品,看到底部还是有些空,得适当做一些装饰,画了两稿一个是一堆人拥挤而上的插画,一个是画了一个国庆超人(李国庆),最好玩的就是声音!是是在没招自己拿杯子录下来的,短短的一个星期设计开发就昨晚了,没想到效果不错,花瓣上几千的转载量,后面出现的同类产品抄袭模仿的不在少数有些甚至全抄哈哈!

摇一摇

 

世界杯来了

距世界杯开始还有1天,突然告诉我开会做一个世界杯的项目,我擦我当时就傻眼了,啊那赶紧的啊!然后产品说着他们的想法技术驳回各种隐藏的问题,就一个字得快,我根据他们的描述出了两个草图方案….(我竟然找到了哪个遗弃在垃圾桶里面的本子)

 

IMG_4671

好就这样!别变赶紧干吧,我擦什么还得做个守门员谁~~哎在世界杯开始的第三天我们的当当网世界杯小游戏上线,汗哪!都是这种,我还没准备好……

世界杯效果图

 

匡威鞋UI系列

茅坑的失败让我很受打击!

maokeng

也不知道什么时候开始对扁平化的练习,脑子没啥创意只是从身边的东西开始,色彩丰富、简洁、时尚而又出彩的莫过于五花八门的鞋子们了,想着趁现在的空档做了一系列的鞋子不废话了上图

converse low

 

长建驾校

长建驾校一个离市区最近的驾校,从7月份至今我的本还未能拿下来,明天就是科目三的考试,先预祝自己考试成功。从7月份开始每次去驾校在休息的时候我总会四处搜寻驾校美丽的风景,而如今已过去5个月了,没办法我只有周末才能学车,大多数时候约不上车…..

翻开微信将图片一张一张的保存下来虽然照片质量有些偏低,庆幸的是照片还在。驾校的照片还会延续直到拿下本,驾校的规模很大科目2的时候完全感受不到开车的乐趣,因为我的教练从来不重样,每天都在操练同样的倒车入库,为了寻找乐趣并排的几个库我都是换着花样练,临近考试最后的一节课我很认真的跟眼前的这位教练说:我一直都是自学没有真正意义上的那个固定教练教过我……!教练深吸了一口烟说:走!他是一个和蔼的中年男人,水泡金鱼眼,1.8的大个子头发略少,不爱说话。上车了他让我自己出训练场,靠边停车、坡起、s弯路、直角知道我非常顺溜的开完这几个项目,那一次的练习是我感受到真正开车的乐趣,将驾校的各个路段基本跑了个遍,感谢这位教练—米教练……未完待续

长建驾校风景

ps如何提取手绘线条

今天堂妹发信息问我扫描的线描稿怎么在ps中上色,线条还得不压盖线条,这让我记起在大学的时候搞动漫的同学们,他们都知道这个方法,其实这也是漫画制作的第一步,如何提取手绘稿的线条,我的印象已经很模糊了,根据现在对PS的了解使用以下这个方法希望能够帮助大家。

第一步,自然是将手上的手绘通过扫描或者拍成照片保存到电脑使用ps打开改图。

1

 

第二步,打开通道选择蓝色通道复制通道,通过图像调整为反相,得到黑色背景白色线条的一张图标调整曲线将其调整到想要的线条精细度。

 

2

第三步,点击蓝色副本得到选区用快捷键ctrl+c复制选区

 

3

第四步,点击rgb返回到图层功能,新建立一个图层粘贴选区就会得到一个纯线条稿的透明图层。

 

4

第五步,这个时候就不用我继续往下说了吧,添加背景,上色即可。

 

5

如果有更好的建议可以留言给我,大家相互学习哦

ps杂论一篇

PS! 干我们这个行当的在熟悉不过了,但是同样做视觉却由于分工及内容的不一样可能常用到的工具自然也会不一样,拿我来说,做客户端的时候比较多,用的ps矢量工具组与选择工具非常的多,而其他那些位图工具用的不多,不过大部分功能、快捷是必须知道的,干活之前先帮大家检查以下ps设置,第一次使用ps先得确定好单位与标尺,这里一般我会将文字标尺单位调整为像素 ,另外一个就是网格线也是很有帮助的,可以适当调整以下间隔有利于接下来的设计,然后是窗口,这个根据自己习惯,而我常用到的只有图层与字符其他功能使用快捷键来完成,另外一个关键就是自定义快捷键,我有一个体会,就是当我到一个新设备时候发现快捷键都不是我想要的,使用起来也非常麻烦,那么就得根据自己的习惯定义一套快捷方式,大家别多想不是全部,而是例如对其方式这种经常用到却没有定义过的功能,我是这么干的,或许对你有所帮助,提高效率,这里根据我做客户端设计挑选几个非常不错的快捷方式及工具跟大伙分享一下,我会在标题后面加*来表示该功能的重要性,如有讲述的不好还请见谅!

1、复制动作路径**
自由变换的附加用法这一条有点老调重弹了,不过估计肯定会有不知道的,这里再提一下,Ctrl+T进行自由变换过一次后,用Ctrl+Shift+T可重复上次的变换,用Ctrl+Shift+Alt+T可实现复制本体并重复上次变换的效果,如图。
lj-1
 2、钢笔工具-垂直转换折点*
在使用钢笔工具时,按住鼠标拖拽节点时按下Alt,即可实现操作当前单个节点实现垂直转折。

 

lu-2

3、选中锁定图层*

锁定的图层有时候是需要被选中的,这个时候只需要按住Alt就能选中被锁定的图层,不仅如此它还能进行操作如:合并图层。

lu-3

4、复制形状*

在实用适量工具的时候需要快速复制路径,我见到有些同学使用复制图层等方法,其实非常简单选中你要复制的形状使用Ctrl+J会快速复制一个形状图层

5、全局拖拽**

按住空格键拖拽画布,这个大伙都知道,但是有时候在设计细节的时候需要回到全局视图看效果我常用ctrl+1,但又要回到细节的部分呢?这个时候你会发现非常的麻烦,而全局拖拽使放大到很大比例仍然能瞬间让视图到达画布的任意位置。只需要按住空格键将鼠标变成小抓手后,再按住一个“Z”,然后按下鼠标——这时你会发现视图瞬间回到了全局,鼠标则变成了一个小方框,小方框就是你当前所能显示到的区域,这样在快速的设计过程当中会非常的实用。

li-4

6、拖拽加速*

在画面无法完全显示的时候,需要选择遮挡部分的图层时按住shift会快速移动到遮挡的另一边。

7、反向图层

有时候做了一堆的图层排列发现需要倒序排列这个时候你可能需要一个图层一个图层的去移动,这里为大家提供一个更简洁的办法,图层—排列—反向,搞定,也可以在两个图层之间相互移动。

 

 

手机—2013年进口车展

再次赶上车展,其实是很久没有活动了,这大半年来一直一个项目接着一个项目,却一直干着打杂的工作,有朋友调侃我在公司的非常的重要多面手没有我不行,那里需要去哪了没有固定工位只要需要随时蹲点,几个项目下来大家都叫我刀哥,我猜很多人都懂!荒废了大半年各种打酱油让自己也陷入的泥潭中,对于设计来说大半年的时间是致命的,唯一的收获就是长了点心眼,复杂的人际关系告诉我只有傻子才会闷头干活,而你干活越多问题也就越多,呵呵慢慢你会发现最后自己也被传染了病变了。

活着就是这样,我貌似失去的动手的能力,看到百度那边的设计师发过来的手绘海报大家都觉得很赞,我有些感慨,我从小学开始出黑板报,高中还有高年级的请我,学美术的时候也是名列前茅,手绘简单的说都是小菜,毕业以后为了生存从一个传统行业走向了IT用上了现代化的电脑使着一手顺溜的ps拿着各种素材在屏幕上挥舞,又后来进入了移动互联网时代,我做起移动端的界面设计,写着超前的html5+css3在我看来已经算是个突破了,很多时候我认为我因该可以更好一点,我费劲心思的向集团的ued进攻面试面试再面试,我成功进入了这个团队发现自己离目标又进了一步,没曾想领导换了又换,最后成功的成为团队的打杂工,更好笑的是新来的直接领导叫不出我的名字,没办法长期驻扎各种开发团队,我不知道是高兴呢还是高兴呢?

我感觉自己就是鸡肋,食之无味,唾之可惜!我茫然的干着不需要动脑的工作,只要是忙碌的干活就觉得自己还有价值,我想把最糟糕的工作做得有声有色,搭建起平台共享,跟各类规范的文档想让团队能够统一化一些!瞬息万变啊,几个经理忽然被干掉了,设计团队也是莫名其妙的乱套了新人疯狂的进入,NB设计师一个接一个不是腾讯就是百度的名头一个比一个响,又…….,我还依旧干着脑残的工作。在我看来IT行业最值得敬佩的是工程师、最苦逼的是设计师、最扯淡的是产品、最被鄙视的是IT、最多油水的是采购、最小资的是运营、最 最焦虑的是老板。我非常喜欢跟开发团队一起干活聊天他们踏实,能吃苦,无怨言,项目紧张吃泡面也给干通宵,大家奔着一个目标全力以赴所以我喜欢跟工程师们打成一片!

现在又换新领导了,设计团队人数增长了3倍+在我脑子里那点算不清楚的数学告诉我一个产品20多个设计师%#¥#¥#(&#¥@#!未完待续…….