主要内容
-
弹出窗口与切换页面的对比总结 2010-07-28 22:26
分享较早前的一个小总结，关于在选择弹出窗口还是选择切换页面来承载信息时，可用用来判断的几个角度，合适初学者来读。 1.弹出窗口与切换页面的区别 1） 操作的连贯性 弹出窗口的速度会比打开一个页面的速度要快，响应更及时一些，点击后可以比较快的得到操作的反馈，而切换页面则经常会让用户等待一段时间。 实例一：个人中心中，查看好友照片的操作： 之前查看照片的操作页 ... ...
-
需求是如何变成产品原型的 2010-07-28 18:03
在一个互联网公司的工作流程中，产品经理（主要指偏向产品设计的产品人员）和交互设计师是这个流水线上最起点的环节，也是关系最暧昧的两个环节。说 其暧昧，是因为在很多互联网公司里面，这两个环节所做的事情是有重合的，这就意味着，他们或许也是整个流程中合作最紧密的两个环节。 相对比之下，产品经理更关注的是产品的内部逻辑、操作流程、策略等；而交互设计师更关注的是产品的易用性、流畅度和操作感 ... ...
-
Android与iPhone界面布局对比 2010-07-27 23:05
上图是我根据Android和iPhone这两个平台的“生产内容型的应用程序”整理出来的界面布局示例。所对比的4个点，均是两大平台的应用程序常规界面元素。 状态栏：Android和iPhone的状态栏均在屏幕顶端的位置，原因无外乎是人的视觉流程是从上到下的。Android的状态栏，具有noti ... ...
-
理解标签中的“极点” 2010-07-27 18:36
前言：本文翻译自《打标签》一书的第三章第二节。本节英语原文是“Understanding tagging’s tension points”，书名是《Tagging》。 社会化书签网站 delicious.com 在2003年最先广泛地引入了协作标签系统。随着该网站——和它的标签——愈发流行，也看得出三个学 ... ...
-
[生活中的设计] 地铁出站口 2010-07-27 16:58
上周六在地铁出站口看到前面一个人一边打电话一边要出站，他在左手边的机器划了卡，想从机器右边的旋转门出去，结果被卡住了。因为左手边的机器管的是左边的旋转门。 设计者大概是考虑用右手划卡身体自然就在机器左边，正好从左边的旋转门出去。 然而实际生活中，如果右手拿了东西（比如打电话那位）或者本身是左撇子，很可能就会用左手去划卡。我认为用右手划卡并不是一个普遍的行为，因此不能作为设计的出发点。这 ... ...
-
Web表单设计之注册表单 2010-07-26 23:15
必须面对的问题有：用户不喜欢提交表单。然我们的目的是让用户愿意提交表单。 下面是一个关于web表单设计的调查报告，这个结果来源于100个令人瞩目的网站。 注册表单设计调查 1.表单的安置 1.1注册表单链接的标题是怎么样的？ 当用户想要加入某个时，他们会试图寻找“sign-up”，“register&rd ... ...
-
如何做得Banner通情达意 2010-07-26 23:01
写在前面的话 有人觉得做个banner放2张图，排几个字的事，一点技术含量都没有，像其他门户banner基本上都是编辑们自己做的。我觉得这么说是不对的，其实一个banner可以研究的东西还是很多的，而且做一个banner是不难，难得是在短时间内做一个出彩的banner。门户的专题一般是编辑套模板拼成的，比较重要的专题，banner部分是由设计师来完成，一个banner ... ...
-
限制的意义 2010-07-26 14:56
重读《人因工程学导论》，发现许多基础心理学的研究结果，并没有被很好的应用在设计中，这里摘录出工作记忆的限制原则，和由此阐发的设计原则，与大家share。 工作记忆，也称短时记忆，是一种相对短暂的，存储少量有限信息记忆方式。工作记忆作为临时存储器，在我们使用时会一直处于激活状态。 工作记忆的限制 容量 众所周知，工作记忆的上限大约为7±2个 ... ...
-
信息架构：3×n 2010-07-23 11:16
一个网站/软件到底需要多少张页面，我觉得是“3×n”张。 3个基本页面 信息架构从某种程度上讲，是对这三种页面的排列组合。 1、着陆/导航页 通常一个网站的首页承担了这一作用。下图截自“hao123”，因为他们全站几乎只有一个导航的作用，很典型。 2、消费页 这是用户浏览我们网站的 ... ...
-
非悬停 2010-07-23 10:36
本文提供了一个有趣的观点：在触屏设备愈加普及的未来，鼠标悬停将以附加功能的身姿出现。我相信作者，特别当看到苹果的上季度财报中，iPad 用 3 个月时间就达到了麦金塔一半的收入，我更信了。 完全依赖鼠标移动、鼠标悬停、鼠标移出或 CSS 伪类 :hover 的网页元素，在 iPad 或 iPhone 等触屏设备上的行为可能会和设想的不同。 在史蒂夫·乔布斯宣布 ... ...
-
从Web到WAP移植的设计原则 2010-07-21 22:58
从Web端直接移植为WAP2.0形式，突出的矛盾是信息架构不适应小屏幕设备，垂直页面的冗长和WAP2.0表现形式的限制。 提升小屏幕浏览的体验，在设计中应包含以下几个核心任务： 控制信息的维度 信息布局，更好利用首屏的有限资源 采用合理的导航、有明确的方位感知 尽可能减少浏览时的按键做功 界面可视化 控制信息维度 WAP网页可支持的页 ... ...
-
左侧导航条 2010-07-21 22:53
原文地址:http://developer.yahoo.com/ypatterns/navigation/bar/leftnav.html 用户为了完成任务需要找到必须的内容和功能.左侧导航条在垂直的紧凑的空间内提供给用户快速访问已分类内容的入口. 解决什么问题? 用户为了完成任务需要找到必要的内容和功能. 什么时候用? 分类至少有4个 ... ...
-
WAP2.0网站分类及其架构浅析 2010-07-20 09:56
一、WAP 2.0 简介 所谓WAP（Wireless Application Protocol，无线通讯协议）是在数字移动电话、因特网或其他个人数字助理机、计算机应用之间进行通讯的开放全球标准[1]。 WAP1.0规定无线设备访问的页面是用WML语言编写的，而WAP2.0将XHTML-MP作为主要内容格式[2]。对比WAP1.0，WAP2.0的优势是更好地支持图形化界面 ... ...
-
手机QQ游戏2008~2009UI设计分享 2010-07-20 09:15
最初 在2008版本之前，这个项目都没有UI设计的加入，所有UI界面都是开发自己拼图绘制而成，虽然不是很美观，但是基本功能还是比较完善，依托 公司这个大的平台，有一定的用户基数。 接触： 刚接触需求的时候还未入职，以前也一直是从事大型网游UI的设计工作，对手机UI的还不是很了解，不过生活就是不断挑战嘛！就根据自己的想法做 了几个风格稿，分辨 ... ...
-
手机网站重构经验分享(S60V3篇) 2010-07-20 09:09
前言 做WEB重构的同学都应该知道,我们一般需要在一个操作系统 (Windows XP)和4种以上的浏览器(IE678,Firefox,Chrome,Opera等)上测试页面的兼容性。 相对而言,手机上的页面兼容性测试,相当痛苦!手机光操作系统都有S60V3,S60V5,MTK,Android, Windows Mobile等等,每个操作系统上除了自带的浏览器,还有至少3 ... ...
-
顶部导航条(Top Navigation B... 2010-07-19 16:23
这个可能是最简单也最常用的组件了,所以内容也不多……. 原文地址: http://developer.yahoo.com/ypatterns/navigation/bar/topnav.html 解决什么问题? 用户为了完成任务需要找到必要的内容和功能. 什么时候用? 2-12个分类的时候 分类的标题相对较短 ... ...
-
心理模型的若干讨论 2010-07-19 16:15
当你踩下汽车中的制动踏板进行刹车的时候，可能心理想象的画面是把一个杠杆和轮子摩擦来减速。而实际上，却包括了液压缸、油管，以及压挤多盘的金属垫板等一系列看不到的零件产生了关系。这里的“心理预想”就是我们说的“心理模型”，踏板就是“表现模型”，而实际看不到的那部分则属于“技术模型”。踩刹车的过程中我们在想象 ... ...
-
城市的拼音输入 2010-07-19 16:10
网上预订机票和酒店，都要输入城市，各网站做的看似差不多，但也有些有趣的差异。 国内各航空公司的机票预订，在输入城市时，主要采取了关键词和下拉列表两种形式。 1. 输入关键词。有国航、东航、上航、南航、海航、山东航空等。关键词支持汉字、全拼/简拼。在简拼输入上，各家有所差异。假如，要输入“南京”，简拼方式，下面以依次输入字母“n”、“j ... ...
-
产品在流程中损耗 2010-07-19 10:35
一台F1 赛车由发动机、变速器、变速器换档杆、消声器、后车翼、后轮毂支驾、轮毂、油箱、车手座椅、方向盘、后视镜、刹车盘、悬架三角支架、轮胎、底盘、散热器、 前轮毂支架、安全螺母、前车翼等配件组成，在一个赛季的比赛中，这些配件不断的损耗、被替换，伴随车手完成赛季比赛。 我觉得产品上线运营就像赛车一个赛季，在赛前我们要 做好充分的准备，在比赛中，要不断的超越对手才能取得胜利。 ... ...
-
谈谈取消键与撤消键的使用 2010-07-15 21:13
“取消”（cancel，stop）和“撤消”（undo），看起来很像是同一回事，用起来似乎也差不多。但是两者在使用上还是有些差别，体验上也略有不同。 一、 取消键与撤消键 我们常常在执行一个动作时，会被要求确认一下，这时候往往给出两个按钮，“确定”和“取消”。“取消&rdqu ... ...
