当当wap站崛起

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

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

触屏对比

 

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

jieping

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

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

触屏效果图2

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

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

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

jietu

 

 

amap视觉规范

322项目第一版

FA.A.00主页(2-18)

高德地图,被大家所熟知的地图导航软件,却不知道他曾经差点濒临破产,那是2012年底,整个公司的状态非常紧张,基于地图上的拓展似乎受到了很大阻碍,老板做了一个重大的决定公司转型互联网,集中公司的核心力量做一个颠覆性的产品(高德地图),项目在13年新年后立即启动,我还记得我的来回机票是公司报销的,(开心)开工的第一天开启动大会,会议非常压抑,大家心里明白这是最后的机会,(大家可以搜索相关高德13年转型的文章)如今的光彩来之不易,用“浓墨重彩”形容高德集团的2013年绝不为过。历经数次洗礼,从专业地图厂商转型互联网,高德慢慢在新的领域找到自己独到的“战术”,由走而跑、步伐稳健。

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

会议一开始成总很淡然的跟大家拜年发红包,并铿锵有力告诉大家公司现状,要有信心完成这场战役,说了成功了必将是划时代的……

我还记得在封闭开发的办公区有一个横幅,叫什么奋斗一百天什么的,在这段时间里所有视觉的对外的接口以及部分视觉设计落在我的头上,所有人的设计稿都必将经过我来验收检查任务繁杂,虽然时过境迁,那时的场景却依旧历历在目,而这份空间库规范深埋地下,成为高德地图永远的基石…..

IOS文字尺寸颜色10

控件库

kongjianluv6

 

 

 

ps杂论一篇

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

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

4、复制形状*

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

5、全局拖拽**

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

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

6、拖拽加速*

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

7、反向图层

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

 

 

墨迹天气手机界面插件作品

天气图标大家见得不算少,我这也不例外,只是在一些细节方面怎加了一些想法跟感觉的东西,有一种尽量不要跟其他人做的一样的心理左右着。插件的两个展示方式上面花了一些功夫想到如何区别大众又如何脱颖而出。

注意力难得集中一会,主要集中在18点到19点之间,因为这会算是自己的时间等待着19点的回家班车,这样一来陆陆续续用去了半个月的时间,其实最主要的目的不在这,而是想捡回这一年丢失的东西……

墨迹

地图icons

源文件下载:PSD

地图ico

进入地图这块一年多了,做来做去无外乎这些东西,摆来摆去!最后变成了地图行业风格都是兄弟产品,用着高德地图像百度,用着百度地图像谷歌,反正都很像,6月份做了一个版本虽然未被采纳,到现在已经半年多了拿出来晒晒,大家都在追求扁平啊拟物什么的,其实还是原地转圈只是换了个角度看到了风景不一样罢了。该设计提供了PSD希望大家喜欢

adidas

鞋很多人都做过我也有看过,但是不知道是不是我最先把鞋扁平化了,至少网上还没有看到,既然做那就做全,阿迪、耐克、匡威等,想想我做的厕所是不是还得继续……

茅坑

maoken

以上的不知道是我做的不够形象呢还是大家不认识,在我们村子里面都是这样的蹲坑,挖一个大坑,上面放上一排木板中间留的大一些便于便便好了不说他了,下面给大家整体的阿迪的鞋鞋们,凭着对鞋的配色造型的喜欢做了一些自己喜欢的鞋子们希望大家喜欢

adidas

河南黄页

前面说到的天翼导航,是我正式迈向移动端的第一步!进入高德之后做了一些辅助性的与移动端产品相关的工作,如11年的小产品系列、天翼导航poi图标、ugc图片分享、河南黄页等

这次要说的是河南黄页,设计依旧脱离不了九宫格的设计框架,把要展示的功能根据优先级依次排列用能够代表该功能的图标来表示,今天有些疲劳直接发一下设计

先发一张上述所说的poi图标

01-01

河南黄页

fangan2 fangan1 xiangq