Sherlock
利物浦1-0西布朗,小麻花终结81天进球荒
互动设计是神马?

前些天我有些纠结,每次逛一圈互动设计的社区都有一种想死的感觉。一是从平面或者动画的视觉角度而言,和国内交互设计师差距实在是太大了,令我羞愤难当。二是即使是我觉得很有差距的作品,在评论里仍有很多尖刻的批评⋯⋯真是杯具啊。
忽然回过神来,那些成功的“互动设计”作品并没有引起我强烈的想要为之奋斗的欲望。我甚至都不知道什么是“互动设计”,听起来很像“交互设计(Interactive Design)”,而实际上又不是。看起来这是一个流行在国内的设计(广告)圈子的词,以我所见过的作品来理解,我先擅自下个定义:
传统媒介上的广告在互联网上的延伸。多用大量的flash动画表现,内容常常为广告、活动。它并非是界面设计中的某一个环节,更像是广告营销的网络产品的整个设计过程。
互联网比传统媒介的广告有什么优势?
- 成本低,而且用户随时随地都能自主获取
- 能够反馈用户的操作(鼠标、键盘)做出酷炫的动画效果
- 用户能够成为信息发布者。以此为基础开展活动能得到及时的反馈。
我想这其中2、3条应当是“互动设计”与传统广告相比显著的不同点。
而实际上“互动设计”是什么?我只能先求教于伟大的维基百科,维基告诉我:
交互设计,又称互动设计,(英文Interaction Design, 缩写 IxD 或者 IaD),是定义、设计人造系统的行为的设计领域。人造物,即人工制成物品,例如,软件、移动设备、人造环境、服务、可佩带装置以及系统的组织结构。交互设计在于定义人造物的行为方式(the “interaction”,即人工制品在特定场景下的反应方式)相关的界面。
维基认为互动设计就是交互设计,看来维基是不知道的。我应该找万能的百度知道。全知全能的度受说:
(友情提示:这整段话可以直接被忽略,我想你和我一样都看不太懂)
互动设计是一个新的领域:是审美以及文化、技术以及人类科学的融合。他所关心的设计是包含这些技术是否能给予服务,以及和他们互动经验的质量。
人类的生活就是一个互动和生活。从出生开始,我们就和人们以及我们所处的环境,使用我们的感官、我们的想象、我们的情感以及我们的知识直接进行互动。
但是到今天,计算机以及电传沟通允许人们间接的互动。透过我们和其它的以及我们所处的环境进行互动,互动技术已经变成一个媒介;以及他们已经转换我们生活的各个层面。
正如工业设计让机械符合我们的互动,建筑让我们在城镇中来符合社交生活的质量,互动设计以互动的气数来符合我们生活,并且就像是建筑以及工业设计,他们也是关心文化以及技术。
互动设计也显示出新的商业模型,他需要被发表这些服务以及经验。
在这世界上每个人都拥有12的计算机芯片;从而同现在在幼儿园要离开学校开始,没个人都将拥有数千个芯片。在如此复杂、以及和这些技术互动的世界中将会定义他们居住的生活质量。在如此复杂、好的互动设计的世界中未提得数字技术更容易进入到各个年龄层、以及他们的教育之中。
尽管百度百科中通篇都在解释“互动设计”而非“交互设计”,但我还是没有明白它指的是什么。在百科的最后,甚至给出了一个更骇人的定义:
他们称呼关键的人为「使用者接口发展者」,我相信这是和在网站世界中的「互动设计师」是相同的人。
好吧,我们终于可以从「使用者接口发展者」中提取出,互动设计师应该就是用户界面开发人员(User Interface Developer)。互动设计或许可以理解为用户界面设计。
回到之前的现实,我认为现在社区中大量讨论的用户界面设计更多是广告营销产品,甚至90%是flash动画来表现的广告和活动。社区中的讨论主要集中在策划、营销、视觉体验。这更像是在讨论一个传统的广告,不是么?只不过它被放在互联网上了。而我们平时理解的“用户界面设计”,常常是包含“前端实现”、“视觉设计”、“交互设计”、“信息架构”多个环节的工程性的东西。至于那些策划营销应该是在系统范围之外的~当然在用户界面设计中依然要体现策划营销的精神和目的。
单就设计社区当中所说的“交互设计”,我依然希望现在的情况能够有所变化,不要只是广告营销指导、设计师程序员执行的另一种广告,而应该成为一个吸取多领域精华的产品。
在人与互联网之间,好的表现形式并非只有flash。互联网用户拥有电视机前所没有的主动权,它们可以任性地点开这个超链接,也随时会点击窗口上的关闭键。他们或许更喜欢“我要做什么”的模式,而非“你们像让我做什么”。那些酷炫的动画,带着强烈自信,认为用户一定有兴趣继续看下去。实际上在那漫长的flash加载过程中就可能流失相当一部分人。或许有人说,那么我们将flash再优化一些,loading时间更短,不就行了么?再短也比不上纯html呀⋯⋯5秒的延迟对于一部分想要获取信息的人来说已经是忍受的上限。更重要的是,展示动画是一种“想让用户做什么”的模式,即使加入了鼠标键盘响应互动,也改变不了这个本质。
现在有了web2.0,有sns,有了90后,似乎一切都有了一些变化。有人说,用户喜欢展示自我,喜欢个性,我们结合web2.0讨好他们吧!互动设计作品中,很大一部分是在线活动,活动不外乎几种类型:上传照片、上传视频、上传文字、有奖问答、游戏。且不说这样千篇一律的活动是否真能达到目的,这样的活动是否就能够激起人们的参与热情?我仍然坚持flash长动画并不是一个好的吸引人参与的表现方式。况且,上传自己的照片或者视频就能让用户有很强烈的融入感么?还是纯为了活动奖品而特意去做(这就又陷入了那种“你们想让我做什么“的模式)。
要说现在最红火的活动是什么?前些日子恐怕得是”全民调戏凡客“吧⋯⋯我不知到这个活动是否和凡客有关,如果不是,凡客真该向发起活动的人付钱。尽管没有什么奖品,有着各种各样爱好的人们还是乐于参与。有讽刺时政的,有关于娱乐圈的,有体育圈的,有很正经的,有很YY的⋯⋯ps好的简直像凡客的官方版,ps不好的依然有一种强烈的戏谑意味,总是能找到让你印象深刻的~后来在公交车站看到韩寒的那个凡客广告,忽然发现相比广大人民群众,这个文案做得真得好苍白~这个活动没有flash,没有炫目的动画和华丽的介绍文字,你甚至不会留意到参与活动时用户界面的存在⋯⋯⋯⋯我想这才是我理想中的用户界面设计。当然,这样的概念也很契合凡客网站的风格~~再次呼吁凡客给活动发起人付钱吧!
这张照片来自喵啦个咪哒 (这种阵容的巴萨在我手里都能输球)。虽然不算很好的作品,但旁边那个酱油瓶深得我心,gj!
Designing Interfaces-那些书本教会我们的事
Designing Interfaces中文版
它是关于界面设计模式的。在网上看到有人抱怨它太过简单,没有意义,对此也挺无语的⋯⋯至少它对我来说已经很够用了。一个模式的价值并不在于你把它记在脑子里,而是投入实用。在遇到碰到那些恼人的环境时,我们往往已经把各种需求利弊分析得很清楚,此时只需要它浅浅的点明,引入某一种模式便是顺理成章的了。况且我也并不认为Designing Interfaces仅仅是在蜻蜓点水,实际上它只是不愿说得太细。无论如何界面设计都只是一个相对较新的领域,那些准则并没有明确的对与错,具体的方法也五花八门,真正的细节还是需要我们自己去探求~
一目了然
传说中的界面入门圣经。对于观念上的启发非常大。适合于界面产品开发相关的任何人阅读。它很薄,也很有趣。它的主旨就像它的标题一样(这个主旨确实是从头到位都被贯彻了),界面应当是”Don’t Make Me Think”的。在我看来它依然是一部“观念”上的启蒙书,在实际工作里,我们往往会体会到过程并不能那么完美,但即使不完美的过程依然能得出能够接受的结果。总之,学习他们的精神,走我们自己的路吧。
瞬间之美
如果这本书有腰封,我想一定会被写上《Don’t Make Me Think》作者最新大作或姊妹篇。但实际上它们的内容并不一样。《瞬间之美》更像介于《Don’t Make Me Think》和《Designing Interfaces》的过渡教程。作者漫不经心地带领我们走过一个个界面,述说着他思考和工作的过程,我们会发现一个让人心动的界面是如何从观念变成现实的。
人人都爱vancl

下午收到凡客寄来的一大箱东西。箱子上端正地贴着vancl的标,嗯,看起来不错。
时间回退18个小时左右,昨天晚上,我在凡客网站上下了订单,算计着周五之前应该能收到。今天中午10点,收到凡客短信,订单已成立;11点,短信通知发货;14点,短信通知快递员xxx正在发货,联系电话为xxxxxx,不带pos机;15点左右,快递电话联系;20分钟后收货付款,快递员提醒我如有问题联系客服退货。这是我在凡客的第一笔消费,见多了忙不过来的申通和nb的ems,这样的配送过程非常让人感动。
回家拆包,亲眼到了传说中vancl的坚持:即使是廉价的鞋子,也要用上看起来很像样的包装盒。就产品而言,可以说是物有所值,一分钱一分货。但从我下订单到见到产品其中的一系列环节,无一不体现着凡客对用户的考虑。
回过头来再看凡客的网站,它给我的感觉相当好(或者是因为它符合我心里对好网站的定义吧):让界面设计、交互之类的东西统统地隐藏到无形,让用户感觉不到它的存在便是成功。
=====关于凡客的内点事暂告一段落=======
下面有一些关于互动设计的吐槽,太长了,就单独弄了一篇,点击查看《互动设计是神马》
面包机

搬家以后晓行同学赞助给我们的面包机,今天第一次用。感觉做了一个月任务还是没集齐原料~(忘记买柠檬了)~经过近4个小时的等待,第一个蛋糕出炉了~~皮烧得有点厚~不过味道还不错。最后来个近景~

PS:
前两天特地骑回家来收EMS的快递,送来的就是这个啦——某烟的世界杯纪念版,果然很山寨啊~不过只要有小花的盒子就够啦~来,跟我那囧囧有神的电脑桌面很同步吧~~

http协议复习笔记摘要
基于网络的应用永远离不开网络,尽管工作内容大部分在前端,也不可避免地需要了解网络。上周工作中,我不止一次地想要再复习复习http。周一时,我们讨论用wml还是xhtml mp制作wap网站页面。负责服务器段程序的小盆友有些担心他原l来针对wml做的一些东西要重来了。我突然有点蒙,但还是告诉他用xml还是xhtml mp并不太影响他的工作,只影响我的工作,服务器和客户端之间的沟通主要是遵守http协议,他那边需要改动的不大。接下来的工作涉及到需要判断客户端可接受的mime类型、客户端是否为移动设备的问题,这些需要通过读取http请求报头中的内容。周五碰到最大的问题,恐怕一部分还需要通过http内容来解决:我们的编码为utf-8的页面在ucweb下显示乱码,opera mini和nokia自带浏览器正常,目前不知如何解决。距离计算机网络的考试结束大概有四年的时间,当时这门课程并不太受重视,而现在看来真怀念书里的那些东西。周末特地花了一些时间把http部分重新复习了一遍。
1. HTTP是什么
http即超文本传输协议,是一个应用层的协议。它由两部分实现:
客户端程序 ————– 服务器程序
|——交换http报文——-|
http规定了报文的格式和交换方式
1). web文档
web文档由对象组成。对象即文件,可以是html、图像、多媒体⋯⋯对象可以通过url寻址。
2). url
主机名/路径名
3). 浏览器
web应用的用户代理,实现了http协议的客户机端
4). web服务器
用于储存web对象,实现http的服务器端
2. http采用tcp传输
clint 《》 socket —tcp—-socket 《》 server
(《》表示投递、获取数据)
3. http是无状态协议
因此需要保存状态时,需要通过cookie、session等才能实现
4. http三次握手
- client:发起tcp连接
- client:通过连接发送http请求
- server:接受报文,取出文件,封装在http响应报文中并发送
- server:通知tcp断开
- client:收到响应报文,tcp关闭。提取对象,读取,得到另外n个对象的引用(例如其他的图像、css文件)
- client:对每个引用重复前4步
http并不关心client如何解释web页面,client往往会并行连接n个连接。
5. http报文格式
这部分其实是我现在最需要复习的,结果摘录得太多了⋯⋯干脆就不放上来了。下面是一些对于前端来说可能比较有用得一些参考说明:
List of HTTP status codes
List of HTTP header fields
Uniform Resource Locator
网络是一个充满了各种规约的世界,其实应用起来没有太多的技巧,就是不断的查文档、查文档。只做规定的事情,按照规定的方法来进行。
那些那时还在那里的人呐

晚上风云足球播的是05-06赛季的国家德比,装13滴看了一小会,觉得场面比今年的两场要好看得多。更让人感叹的是,场上阵容真是华丽啊!还没神马肚子的大罗,不带发带,竖着马尾精神的小罗,少年梅西,埃托奥,已经秃了的齐达内,罗比尼奥⋯⋯当然还有很多已经熟或者刚刚熟起来的脸:普姨,长得和现在差不多的哈维,头发还挺多的巴尔德斯,还没成阿富汗的卡西,原来真的很帅很帅的拉莫斯⋯⋯替补热身的还有杯具的小白、一直都是少女杀手的古蒂⋯⋯对了对了,还有在场上还挺神勇的劳尔。哇,也不过几年之前,那些人还曾经在那个地方,现在的确是各奔东西了吧。突然意识到这件事情,好像还有一些的伤感。
发现场上有一个跑得还蛮潇洒的金发,难道是古蒂⋯⋯可是古蒂在热身呀⋯⋯给了个近景原来是小贝⋯⋯OMG⋯⋯虽然我从来不认为小贝有多帅,可也不曾觉得他长得有这么杯具⋯⋯

带上发带的长发小贝简直是个路人⋯⋯相比之下托小花的发带扮相简直是仙女啊⋯⋯帅哥之争胜负立现了嘛!然而我还是怀着美好的愿望挑选了一张小贝还算美型的发带照和托小花放一块⋯⋯请见文章开头⋯⋯还是小花的五官好啊⋯⋯o(^o^)o
不管帅不帅,小贝已经是老贝了,大罗齐秃也变成了传说⋯⋯这两年看惯了新闻里把劳尔塑造成一个球霸,却一直回想不起来他曾经在场上是那么的霸气。初识劳尔在98年世纪杯前,西班牙21岁金童~六年级期末考试结束的路上,和好朋友还常常一起说起劳尔有多么多么的厉害。杯具的是那个时候的西班牙还只是预选赛之王,所以劳尔永远也无法企及大罗和齐达内的高度吧。这就是生不逢时= =,现在劳尔也远走他乡,希望他能像离开皇马的那些人一样再次闪耀吧。再想想,那时那个地方的那些人,早晚都会过去的吧⋯⋯还好我们一起拥有那段春秋和冬夏⋯⋯
xhtml mp初体验

用xhtml mp顺利写了一个“你好手机!”页面后,几个非常棘手的问题就扑面而来,手机网站开发中遇到的繁琐挑战与我们终于开始了正面接触。用了一天的时间好好看了一下XHTML 移动概要 (XHTML MP) / WAP 2.0 教程 。下面是一些些笔记摘要。~( o . o )~
1. 什么是XHTML mp
XHTML mp即XHTML Mobile Profile(可扩展标记语言移动概要)。它是XHTML的完全子集,它是XHTML Basic + XHTML完整版一部分可用于移动设备的属性。
XHTML mp不支持客户端脚本,因此一些基本的验证也要放在服务器端进行。将来可能会有ECMAScript Mobile Profile-ESMP。
相关的一些概念
- xhtml – 可视为用xml规范对html进行格式化
- xhtml basic – xhtml简化版,无css、框架、script,由w3c规定
- wcss/wap css - css2的简化版,有针对移动的扩展(实际开发实践中这些扩展并不太常用),由oma规定,与w3c的css mobile是不同的。
2. MIME类型
MIME即Multipurpose Internet Mail Extensions。
WAP2.0规定的MIME类型:xhtml, html, htm
- application/vnd.wap.xhtml+xml - OMA指定的MIME,N60系只能查看该类型。
- application/xhtml+xml – xhtml家族的MIME类型
- text/html - html的MIME类型,能确保IE6等某些web浏览器正常显示,但为非xml类型
我们做了两个页面:“查询”和“查询结果”。查询结果页面内容是由php动态生成的。但是从”查询“进入”查询结果“页面时,Firefox会弹出”查询结果“的文件下载对话框,而不是直接显示页面,Opera显示正常(让我们华丽滴忽视IE吧)。看了MIME的介绍后才明白应该是“查询结果”的MIME是Firefox不支持的。今天改为先在服务器端通过http accpt判断可接受的MIME类型,再返回相应的WAP2.0 MIME类型,Firefox下就显示正常了。
3. WAP2.0向后兼容WAP1.x
4.XHTML MP缓存控制、meta信息
对时间敏感的页面(例如定时刷新以查看最新信息),可以采用如下方法强制从服务器获取最新的文件:
<meta http-equiv="Cache-Control" content="no-cache" />
或者
<meta http-equiv="Cache-Control" content="max-age=一个很小的值或者0" />
并非所有的WAP浏览器都识别/支持meta中的cache设置。对于不识别的meta信息,WAP浏览器会忽略,不会报错。因此可以在meta中加入一些自定义的信息(如版权)。
对于不支持meta中设置cache的客户段,可以在服务端设置http响应头。如:
<?php header("Cache-Control:no-cache,must-revalidate"); ?>
5.间歇性刷新
6.<hr />标签不要被包含在<p>中
7. 字体风格需要WAP浏览器支持,如b和i
8.可用图片类型可以检查http头中的accept内容。accpt内容还可以用来检查客户端支持的MIME类型。
9.-wap-input-format 输入掩码样式
上面的笔记仅仅是这两天学习的一些摘要,其中一些概念理解可能有偏差,还待以后修正。
xhtml mp的出现对于广大web开发者绝对是一大福音。但是web上的一些html坏习惯也往往会给xhtml mp使用带来一些麻烦。由于手机设备的特殊性,和xhtml本身特点,手机网站开发更要遵守标准来进行,更多的考虑到设备、带宽、兼容性、用户体验等内容。这个领域还存在非常多需要“经验”来解决得问题,所以我想应该迅速上手,多观察、积累大网站在这方面得动作。这个周末打算重新温习一下xml和计算机网络关于http的部分。希望今年能够在wap上面有所作为。
ps,
这几天骑车上下班,晒黑了一大圈。在自行车道上常常被汽车的喇叭轰到渣⋯⋯这世道人心不古,脚踏车一族生存艰难啊~~甚至在林萃路上,被逼到人行道上的俺还常常被喇叭轰⋯⋯由此可见一个高高的马路牙子好重要啊!
成为一名手机党

如果不是一名手机党,你永远不能体会手机党的悲哀。手机,又称受机、爪机。在相当一部分的手机党面前,视频、动画、图片,以及一部分的网站就是杯具⋯⋯然而,无论是用户还是网络内容/服务提供商,都无法拒绝爪机们的诱惑——它们小巧、随时随地、人手一台⋯⋯
为了网站开发wap版做准备,今年年初我换了新的3G手机。我的6700c屏幕分辨率是320*240,s40系统,装了opera mini,这样的配置在将来应当算是主流中超级低端了吧。因为web开发本身就常常需要考虑各种兼容性,手上留一台环境最苛刻的设备应该靠谱吧。5月底,开通了联不通的GPRS 500M套餐,打算先多了解手机网站的情况。事实上我把大部分的流量都用在了看世界杯新闻上⋯⋯晚上没有看比赛,早晨醒来一伸手,就能看到比赛结果和最新的消息;上班的路上能接着看一些图片和评论,真的很方便。
一直一直到昨天,我正式接触了手机网站开发。用xhtml mp写了一个简单的查询页面。嗯⋯⋯我一直期待的手机网站开发,正式成为手机党,就从这里开始吧!




