口碑网UED团队

在家闷了N久了,周末雨停了一会,去西湖边走走
去南山路上的PROSCHE中心看漂漂的跑车…无限口水~~

进入正题
在涌金门附近的某路口,过马路.
不是第一次过这个路口了,但却是第一次从这个人行地下通道过,以前大多是晚上,直接在马路上溜达过去了..汗..
而且,据观察,这个地下过街通道也很少人使用,为什么呢

恩,当走到入口的时候,低头一看,台阶分了3层,每层都有几十级的样子,从上到下总长度加起来像是要进行地心历险记一般..
汗了一下还是下了..旁边那足有将近20米的上行电梯兀自呼哧呼哧的蠕动~~~

然后就想到了南京的过街地下通道.很多都是将台阶分成2段或者3段以上,当你从地面进入的时候,只需要下很低的高度,下去之后会再有一些很低矮的台阶.这样,就把总的高度分成了许多并不被在意的部分,心理压力和抵触就少了许多.

2种地下通道的对比见图,橙色部分是阶梯.

回到杭州
在上行电梯上发呆的时候偶就想,这么长的阶梯,不就跟偶们的一些表单一样么
SO长SO长的,看到的时候感觉就很压抑
各种必填的非必填的,高级的基本的信息都混杂在一起

为什么不能把所有的填写项都分下类呢
基本的归基本的
必须填的归必须填的
高级的可以考虑默认不显示,给需要的人去用
偶觉得表单设计的基本原则就是帮助用户最迅速准确的完成交互:
·方便所有人明确理解需要做的交互行为
·避免用户出错。用户出错其实就是交互设计的不合理
·针对各类人的需求，都能最快速的完成。
·明确知道可以做哪些操作，操作的结果大致如何，如果出错了，需要给出返回修改的机会

当时主要是想到表单了。想来很多交互设计都可以参考这个原则。
把地下通道做的那么长那么恐怖，用的人自然就会少了。
记得以前看到过，地下通道与地上天桥的区别，一个是先下后上，一个是先上后下
往往就是选择先下后上的人多，
这种在现实生活中的事例对交互设计还是很值得参考的

 地下过街通道与网站表单交互 

转载请注明出处：ued.koubei.com首发 blueben

网络广告有别与传统广告，它的传播范围最广；交互性强；针对性强；受众数量可准确统计；灵活、成本低；感官性强；但广告篇幅限制严格，需要被点击触发。换句话说“点击率”在一定程度上反应广告效果，那么用户在什么情况下会点击网络广告呢？
就我个人而言，分别会在以下情况去点击：
（1）广告做的很有意思；
（2）注明有奖；
（3）会对自己比较关注的信息类别的宣传广告进行点击；
（4）清邮箱时，偶尔会点击看看。
继续阅读本篇日志 »

中式快餐是我很喜欢去的一种餐馆，今天下班被好友忽悠去吃饭，结果兀楞楞来到这里 - 某中式豪华快餐厅，说到豪华也就是今天我要说到的主题，豪华主要是指设备，配备了比肯德基麦当劳都还好的购餐系统，让你点餐排队的同时也能有广告看看，但这队伍也排得太长了，主要原因我感觉了，人不够啊，收银台都没有全开，国人都喜欢使用人海战术！人多…….. 到哪也不吃亏啊…..（有点跑了….. 囧 ）

继续阅读本篇日志 »

之前看过一些立体字的设计，透视效果很不错，先看看别人的设计：


找过用ps做立体字，比较单一，只能做出文字凸起的效果，如果要做到像这样光源在上，立体字的透视消失点在后下方，似乎没有简便的方法，结合ai就能很好解决问题，而且文字立体的方向可以通过参数调节
制作步骤：
1.打开Illustrator，输入文字后，点击效果>三维>挤压与导角

2.重要的一步: 调整6个参数：

继续阅读本篇日志 »

借口碑网首页改版之际，抽离一些自认为这次在首页前端开发中一些有用的东西拿出来和大家探讨一下。口碑网首页改版比较勤快，也不知道这版首页会持续多久，啥时候改版的话，本系列文章自动终止。

今天说说清除浮动，clear float。

常规清除浮动，只要在需要清除的那个元素加上clear:left、clear:right或者clear:both

但是有两个情况下，靠以上这种简单处理不行。

第一种情况，父元素有border或者background等视觉体现，而子元素都是float元素的时候，需要对子元素结束的时候对float做清理，否则视觉显示不出来。第二种情况，也是基于视觉的考虑，第一个元素的子元素做了一些浮动，紧接着的第二个元素有border要显示，但是如果直接在自己身上加clear，会导致第一个元素的padding-bottom后者本身的margin-top失灵，而因为要显示border，不好用padding-top来控制与第一个元素的间距。这些时候可以用这个经典的清除浮动class加在父元素上来清除自身的浮动：

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {zoom:1;}

第一种情况的示例看下图：

第二种情况的示例看下图：

你可以访问口碑网首页使用firebug展开dom节点找到相应的位置看。

原版（网上搜索clearfix到处都是）对IE/MAC提供了支持，并且用height:1%对IE进行hack。我对那部分做了修改，用了zoom:1来取代。

另外最近不小心看到网上一个新方法，这样子也行…

.clearfix {
overflow:auto;
zoom:1;
}

看了中国台湾地区那么多特色的餐厅，你否有兴趣去饱餐一顿。再来看看其它中国其它地方的吧。

哈尔滨“冰”饭店——太阳岛波斯特冰饭
由纯冰建成的，欧式风格的冰建筑，是第18届雪博会上的一大景观。顶蓬是冰的，墙面是冰的，吧台也与室内的装饰都是冰的。主要经营的特色就是热腾腾的火锅，游客还可以坐在冰椅上喝热饮。占地面积260平方米，可以同时容纳100多个客人用餐。采取特制的隔湿措施，即使外面的温度达到零下30度，室内湿度都会保持在4.5度。