口碑网UED团队

06月 27 08年

对于这块屏幕,你想做点啥???

Published by 小鱼儿

用户体验  16 条回复 »

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

fan01.jpg

继续阅读本篇日志 »

06月 26 08年

photoshop和ai合作轻松设计立体字

Published by 杨梅

photoshop  7 条回复 »

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


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

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

继续阅读本篇日志 »

06月 21 08年

口碑网首页前端技术分享系列之一,清除浮动

Published by 大米

前端开发, css  10 条回复 »

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

今天说说清除浮动,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;}

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

2008-06-21_005625.png

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

2008-06-21_010030.png

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

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

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

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

06月 12 08年

特色餐厅-中国其它地区

Published by 辣椒

未分类  3 条回复 »

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

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

31776_1.jpg31776_3.jpg

青岛“女士”餐厅
一个为女士的餐厅,进门就能闻到阵阵的玫瑰花香。餐厅摆放了很多镜子,楼上楼下共有10多面,迎合了女性对镜整理仪容的心理。餐厅里随处可见的,仕女油画,菜品也是专门针对女性顾客设计的,酸酸的,辣辣的。

上海“武侠”餐厅——上海风波庄
门面:人在江湖身不由已的对联,到了这里你,你想吃什么,也不能全由自己了。菜是庄主,就是老板与厨师。根据人数,按口味分成:武当、少林等几大门派。进门,先要“金盒洗手”,用“双节棍”练功。(双节棍是筷子,练功就是用餐)。汤勺就是了大兵器,小勺则是了小李飞刀,这种刀光见影的用餐方式,可真是特别呀。 继续阅读本篇日志 »

06月 03 08年

5.12地震后 设计师创作大量作品 振奋人心

Published by 杨梅

平面设计  7 条回复 »

直奔主题

1.这不是诺曼底,但是这是历史上最伟大的空降!

10.gif

2.挺拔四川
三枝竹竿组成“四川”的“川”字。水墨表现,更体现中华气质,愿视觉到心觉,给四川人民以力量!!!

tbsc.jpg

继续阅读本篇日志 »

05月 28 08年

特色餐厅-中国台湾

Published by 辣椒

平面设计, 未分类  7 条回复 »

国以民为本,民以食为天,我们一直都把食物当成无尚崇高的天一样的尊敬,而且或者说是在我们的历史进程中又起着载舟覆舟的重要作用。
如今川菜、粤菜、湘菜、家常菜、鲁菜、火锅……各色各样的菜系,都在争相开放。面对如此激烈的竞争,商家都在想尽各种办法,做各种自己特色,于是很多特色餐厅应运而生。搜罗一堆特色餐厅,有机会可一定要去一饱口服。
商家采用的各种方法,都是在注重用户体验,去吸引更多的顾客。
 


台湾“哈里波特”餐厅
走进黑色森林,正真的魔法帽,披着一个黑色斗蓬,他们就是服务员啦。店长变成哈里波特,额头上还画着闪电伤痕,简直就是电影主角本身,相似度高达90%
23.jpg12.jpg
 

继续阅读本篇日志 »

05月 21 08年

【拍黄瓜系列】注释开关

Published by 乌龙茶

前端开发  8 条回复 »

%e3%80%90%e6%8b%8d%e9%bb%84%e7%93%9c%e7%b3%bb%e5%88%97%e3%80%91%e6%b3%a8%e9%87%8a%e5%bc%80%e5%85%b3

在工作中是否遇到这种情况。。
1.写好的一个html片段。暂时不需要了。。过一会又有人跑过来跟你说,刚才的那段还要。。。又过了一会他又说还是不要算了。。。。。囧。。。
2.页面错乱。。怎么查都查不出原因。。没办法只能用最土的方式。。删html逐一排查。。。

对于这类情况,我们多数是用注释去解决。。。但html复杂的注释语句真的是让人无法忍受。。。试想在第一种情况中。反复的敲打“<!–  –>”是多么的让人浮躁啊。。

来搞个注释开关吧,来快速打开和关闭注释。。。。。

在需要设置注释的上下各写两个空注释。基本格式如下图

1.JPG

当我们要打开注释开关,注释掉文本的时候,只需要将文本上面的空注释的结束>删除即可。见下图。

2.JPG

想反的当需要关闭注释的时候,只需要再把>补上即可关闭。。。

是不是很有意思。。 。。不过我更是习惯通过删除“-”来控制开关。 因为打>的时候还需要按住shift。。。太累。。。

在让我们看看其他的注释开关。 继续阅读本篇日志 »

05月 07 08年

再谈iframe自适应高度

Published by 大米

前端开发  33 条回复 »

这贴比较长,没有耐性的朋友请直接拖到帖子末尾的代码示例,或者直接去玩我提供的Demo。

Demo页面:主页面 iframe_a.html ,被包含页面 iframe_b.htmiframe_c.html

下面开始讲:

通过Google搜索iframe 自适应高度,结果5W多条,搜索iframe 高度自适应,结果2W多条。
我翻了前面的几十条,刨去大量的转载,有那么三五篇是原创的。而这几篇原创里面,基本上只谈到如何自适应静的东西,就是没有考虑到JS操作DOM之后,如何做动态同步的问题。另外,在兼容性方面,也研究的不彻底。

这篇文章,希望在这两个方面再做一些深入。

可能有人还没接触到这个问题过,先说明一下,什么是自适应高度吧。所谓iframe自适应高度,就是,基于界面美观和交互的考虑,隐藏了iframe的border和scrollbar,让人看不出它是个iframe。如果iframe始终调用同一个固定高度的页面,我们直接写死iframe高度就可以了。而如果iframe要切换页面,或者被包含页面要做DOM动态操作,这时候,就需要程序去同步iframe高度和被包含页的实际高度了。

顺便说下,iframe在迫不得已的时候才去用,它会给前端开发带来太多的麻烦。

传统做法大致有两个: 继续阅读本篇日志 »

04月 29 08年

口碑网5月份壁纸

Published by 辣椒

平面设计  11 条回复 »

%e5%8f%a3%e7%a2%91%e7%bd%915%e6%9c%88%e4%bb%bd%e5%a3%81%e7%ba%b8

开放的UED祝福天下所以的母亲:幸福,安康!

ff.jpg

尺寸选用下载: 1280*1024         1024*768

04月 28 08年

如何编写兼容各主流邮箱的HTML邮件

Published by 大米

前端开发, css  19 条回复 »

几乎每个会员制网站都需要通过后台发送邮件来与会员进行沟通,如注册确认、营销推广。这些由站方发给会员的信件,往往纯文本格式已不能满足界面和交互的要求,这时候我们就需要发送HTML页面。由于HTML邮件不是独立的HOST在本站的页面,是寄人篱下的。所以编写HTML邮件与编写HTML页面有很大的不同。因为,各面向网民的主流邮箱都或多或少的会对它们接收到的HTML邮件在后台进行过滤。毫无疑问,JS代码是被严格过滤掉的,包括所有的事件监听属性,如onclick、onmouseover,这是基于邮件安全性的考虑。不仅如此,CSS代码也会被部分过滤。本人要讲的就是如何编写不被各大主流邮箱过滤的,能正常显示的HTML邮件。
继续阅读本篇日志 »

« 上一页 下一页 »