主要内容
-
milk香港版——交互设计漫谈（1） 2011-08-04 10:47
当产品相对稳定与可控，小神有愿望快速记录这个项目。 内容涉及小神参与产品设计与执行的过程，由交互/视觉设计层面的需求分析、功能设计与设计执行组成。 与其带入一些工作中的设计技巧，小神更愿意分享其中的设计思想与理念憧憬。 设计之所以不同于美化，是因为前者被赋予了驱动的灵魂。 背景 milk香港版，内部命名”milk mobile ... ...
-
表单设计之基于选择的输入（9） 2009-07-14 23:05
实用指南 我警告过了，基于选择的输入项要考虑很多方面问题，对吗？研究了海量数据，我们学到了什么？ * 如果每个初始选择的额外输入项数量很大，网页级别方式的基于选择的输入项是最佳方案。表单需要两个单独网页，但动态隐藏和显示额外输入项不会迷惑用户，用户也不会怀疑选择是否互斥。 * 垂直和水平选项卡在综合可用性、满意度和眼动指标方面表现都不错，但存在选择互斥问题。哪种方案能解决问 ... ...
-
让复杂变为清晰 2009-10-11 12:59
—— 《Information Architecture: Blueprints for the Web (2nd Edition)》中文版推荐序 Web design的本质是信息和内容，我一贯提倡的观点如此，并且认为国内互联网大环境的畸形发展导致我们误解长达十年之久。尤其在阅读完Christina Wodtke, Austin Govella两位合著的这本书之后， ... ...
-
互联网表单设计 - 第二章 表单组织 (4) 2009-02-25 08:51
组织内容 为保证对话流畅，可将问题分成有意义的组。根据不同大小和情境，将组分到多个网页或单个网页的不同部分。 例如，Yahoo！注册表单将个人信息、正在创建的账号、访问账号的方式及若干信任及安全项目（服务条款和垃圾邮件）问题分成四个不同部分，如图2.2。这些部分用标题区别于网页其余元素。紫色粗体标题比其他表单标签承载更多视觉份量，用户能快速扫描表单，明白需要提供何种信息。 ... ...
-
设计师也需要了解的一些前端知识 2012-03-31 14:31
国画中有句话，“画虎先画骨”。对应到网页上，视觉效果只是一张皮，前端代码是支撑这张皮的骨，了解骨架是怎么长的，有助于设计出更合理高效的页面。 一、常见视觉效果是如何实现的 关于文字效果 文字自身属性相关的效果css中都是有相对应的样式的，如字号、行高、加粗、倾斜、下划线等，但是一些特殊的效果，主要表现为ps中图层样式中的效果，css是无能为力的。但是 ... ...
-
对帮助的三点想法 2008-07-27 17:14
流氓帮助 罗永浩老师在说到暂*住*证的时候描述了这样一个情景：国家将收容制度更名叫做帮助制度。 警察在马路上抓住一个民工问：有没有暂住证？ 民工说：没有。 警察：那跟我走一趟。 民工：哦不，我不用帮助。 警察：我～帮～你！ 在很多的设计中，我们处处也能见到这样的“流氓帮助”、“强迫式帮助”。 记得当初office还是什么软件有个设计，在我 ... ...
-
产品设计与站点定位-以好友系统为例 2008-09-03 01:28
忙了一整天。连看一眼别人博客的功夫都没有。晚上回来赫然发现，我还是没有看完《长尾理论》。 曾经我说要掌握生活的主动权，结果还是毫无抵抗地成了生活的奴隶。 Reader里面，生活丰富多彩。一直在期待点石的SEO文章，结果一个礼拜没有下文。估计是在筹备SEO大会了。和菜头今天一天更新了7篇，让我无比艳羡他的工作。顺便说一句，和菜头今天又愤青了一把，不巧矛头还是指向了BlogBus，这次是横戈了。 我说 ... ...
-
谈谈Google Wave的滚动条 2009-12-16 22:12
在看到一些文章对wave的滚动条嗤之以鼻之后，我觉得有些必要为google的设计人员的良苦用心写两句。wave的滚动条是一个试图改良当前滚动条弊端的积极尝试，虽然这尝试并不成功。 滚动条简单明了，是非常常见的界面控件，但从一开始，传统滚动条的设计就存在着一些问题。在我看来，Google的设计师试图通过wave解决其中的两个问题：1. 传统滚动条强迫用户经常切换手掌的肌肉群；2.传统滚动条根 ... ...
-
说说上海南站的用户体验 2009-02-12 16:00
去篱笆面试的时候老燕还让我说说上海南站用户体验方面的感受？我的回答是：当用户目的明确的时候，上海南站的导航标识很清晰，但当用户目的不明确的时候，上海南站的导航设置就让人感觉比较混乱。老燕没有对这个说法做任何评论。回来的路上我就在想为什么上海南站的导航标识会给人这种感觉。我从《web信息架构》这本书找到了答案。因为上海南站的导航设计是一个“过于简单的信息模型”。 过于 ... ...
-
概念设计及交付物、评估和测试 2008-07-26 11:59
很多产品经理常会把概念设计一起写到产品需求文档 （PRD）里面去，当然 PRD 的范围和内容，以及概念设计的范围和内容，都比较灵活，可根据实际情况调整，如产品战略、人力配置等。需求到什么程度，概念设计就从什么程度开始（或许已 经开始）。我在本文中提到的概念设计，是产品早期的微缩的设计过程，交付物主要是概念图（Concept Map），但在很多情况下，我们还需要针对产品需求的低保 ... ...
-
注册界面的常见问题–一张图做标注 2008-08-07 12:55
自己的注册界面实施了一半，诸多交互问题还没考虑。但这张界面正好反映了不少的问题，于是就加上标注，共勉。 可点击图片看大图 ... ...
-
浅谈用户注册表单 2008-08-06 11:09
我刚进入5gsns的时候，我真不知道怎么玩，我是通过白鸦的 博客过去的，之前也没有怎么去玩过这类的网站。对于sns网站还算是陌生，不过还好网站右边都有帮助向导。我进去后没有去看内容就注册了，由于经常有关注 白鸦的博客，所以对于他推荐的网站，自认为都是和行业相关的。由于抱着“随便看看”的心态去注册，于是在注册的时候，个人资料只填了下博客（对我有帮助） 和邮箱，其它的都是 ... ...
-
信息架构本质，第 4 部分: 改善信息系统的... 2008-10-07 09:02
如果缺乏有效的呈现方式，即使是世界上组织得最完善的信息也只能是一堆废物。界面设计糟糕、缺乏搜索和筛选支持，以及可视显示效果过于混乱，这些会对任何信息架构的成功造成障碍。为了使最终用户能够访问复杂的信息系统，您必须做出大量努力，研究和设计用户与信息管理系统交互的方式。 正如本系列文章先前说到的，信息的用户范围中既有新用户，也有经验丰富、态度认真的研究者。可用性意味着要向不同的人员提供不同的信 ... ...
-
IA学习笔记02：组织体系 2009-06-09 15:19
简单的说，组织体系指的就是组织信息的方式。 看了一堆拗口的定义后，我根据自己的理解画了下面这个图： 从上图看出，同样的图形元素由于采用了不同的组织方式，呈现的分组效果也大相径庭。 尽管如此，我们还是不难区分出它们之间的差异性，并且能按照一定的方式把它们组织起来。 这种将信息分成定义明确的区域和互斥区域的组织体系，我们称他为精确性组织体系。 当用户知道所要寻找的资源的某些信息，例如：文件名 ... ...
-
文案是网站的性格 2009-09-01 10:50
看一个网站其实就好比品评一个美女。一看长相，我们很多时候关注的是视觉，比如老板经常会说，你做几个页面让我看看！二看身材，也有很多关注标准和seo的人会很注重页面良好的结构；三要看性格，一个人的言谈举止往往能反映一个人的性格。 网站文案就是网站的性格。好的文案不但能准确的的传达信息，更能让用户感受到良好的体验。很重要但不被重视的网站文案 &nb ... ...
-
“生活”设计 2009-03-02 02:50
用户习惯大家都经常在提，习惯源于何出？ 回答可以是软件的用户习惯源于其不断使用过程中的印象积累。如果是这个软件刚诞生的时候呢？于是就得参考同类软件或者软件所要运行的os操作系统的用户习惯，那如果是一个操作系统刚形成的时候呢？表面上看这是条分岔路，大家各自规定自己的规则，慢慢培养用户习惯。于是我们看到了一个有趣的现象：mac os的关闭最小化按钮在左边，而windows的关闭最小化按钮在右边； 不过 ... ...
-
浅议Wap网页设计中的锚点链接 2010-12-09 23:18
最近做了wap站中的搜索结果页的改版，记录一下关于锚点链接的心得~ 关于锚点链接 锚点链接一般用于比较长的网页，使用内部链接建立页内目录。单击目录跳转到文本的相应位置，最常见的如“回顶部、模块间跳转”等。 关于锚点链接，可用性研究的宗师Jakob Nielsen写过一篇名为Avoid Within-Page Links的文章，排斥锚点链接，认为它有害 ... ...
-
关注各网站的布局调整 2008-09-19 16:32
1、前不久，friendfeed.com把主导航从上面，移到了右侧。现在，又改到了左侧。2、现在，twitter.com把页签（相当于二级导航）从主内容区的上面，移到了右侧（同时下面还有辅助信息）。3、除了friendfeed和twitter，还有不少2.0网站都在做着这样的，把导航拿到侧边的布局尝试和调整。4、放在左边和放在右边主要考虑的是眼睛，而非鼠标。但，这都不重要，重要的是，从占高度变成了 ... ...
-
从支付宝的充值流程说说充值的界面交互 2008-12-11 23:15
如图：（点击图片查看大图） 支付宝的充值页面，已选择银行及金额。 点击“下一步”后，来到：（点击图片查看大图） 在此页有提供返回重新选择银行的链接，假设我在此时想返回使用“网汇e”，步骤是： 1、后退或点击返回重新选择银行 2、点击“网点充值”，选择“网汇e” 后 ... ...
-
由“>>”符号想到的指示性 2008-12-16 23:35
上一个月都在忙着准备改版、改版和改改版。-_-!!所以没怎么露脸，今儿个晚上有空，写写。 这个胡思乱想源自这次很痛很快乐的改版，在将尾巴的设计稿整成页面后，发现在tahoma字体下的“ 更多 >>”中的箭头与“宋体”字体下的不太一样，在前者的情况下，要稍微尖一点，扁一点（也就是现在的样子），而在宋体下，却要高一点，没那么尖，而在仔 ... ...
