豆瓣界面新改版,“菲兹定律”帮你解读背后思路

豆瓣改版之后,关于豆瓣导航条的设计特性引起了大家的广泛讨论,其中,菲兹定律在">用户界面设计的应用再次吸引了大家的关注和重视。

海旭Roy的文章深入浅出地向我们介绍了菲兹定律极其在产品界面中的应用实例,通过这篇文章我们可以获得的认识在于,新改版后的豆瓣界面,从某种角度而言就是遵循“菲兹定律”不断优化用户操作的产物。

今天说说费兹定律(Fitts’ law),网上有很多资料,算是老生常谈。下面看一张图,网上找到的,算是fitts在手机终端上的一些应用吧。

一,什么是Fitts定律

物体从开始的位置移动到最后的目标所需的时间取决于两个因素:到目标的距离A和目标的大小。

t = a + b log2 (2A / W)

其中a(=0.230s),b(=0.166s)是经验参数,A=指示位置与目标的距离,W=目标尺寸。它们依赖于具体的指点设备的物理特性,以及操作人员和环境等因素。

结论:目标越大,指向越快,时间越短。同样地,目标越近,指向越快,时间越短。也就是说,定位一个目标的时间,取决于目标与当前位置的距离,以及目标的大小(在特定场景下,当然还会有其他因素)。

二,菲兹定律的应用

目前应用在PC端和移动终端产品的设计上。

1、在设计用户界面的过程中,按钮以及一些GUI控件的尺寸应设计得比较合理,相比而言,点击小的控件会相对困难一些。因此在当前的软件及网站的GUI设计过程中,工具栏的图标都在变大,另外一些文字性说明的按钮背景区域也在增大。

2、不论鼠标移到什么地方,由于鼠标都可以一直保持在屏幕的边缘,因此边缘或是角落区域相比其他区域更容易到达。在Mac OS X产品系统界面设计中的Dock设计,顶端的菜单栏设计,以及Windows 19803.html">XP系统界面的左下角“开始”按钮和Mac OS X系统界面的菜单栏设计均是这个理论的实际应用体现。

3、弹出菜单会比下拉菜单选择得更快,因为用户避免了在菜单间滑动。

4、饼状菜单会比线型菜单更易选择,而且错误率更低,这里面有两个原因:

饼状菜单的每个菜单项和菜单中心的距离都一致饼状菜单的每个菜单项的楔形目标区域都非常大,一般都会扩展到屏幕的边缘

5、目标点的位置实际上是边缘的一些像素加上边缘之外的全部面积。所以,这样看来目标点就足够大了。原因是基于fitts定律,它的一个分母的增大了而使得界面的效率提高了。

案例:

三,菲兹定律告诉我们的道理

1、我们想要更容易点击到控件,就应该放在屏幕的边缘或角落里。让常用的控件更大,更容易辨别;

2、使用屏幕的边缘和角落让控件有效扩大,永远不要把控件放在离屏幕边缘或角落一个像素远的地方;

3、边缘之外的地方,也可以算作目标点的面积,这样一来,目标的面积就被无限的放大了,也更方便用户操作。

来源;http://tech2ipo.com/57051

时间: 2024-09-16 06:27:54

豆瓣界面新改版,“菲兹定律”帮你解读背后思路的相关文章

豆瓣首页将改版 放置豆瓣猜 取消豆瓣说

12月31日消息,豆瓣CEO杨勃表示,在未来几周,豆瓣首页将进行改版,首页会放置 新的"豆瓣猜","豆瓣说"将被取消.杨勃还表示,友邻广播会升级,吸收豆瓣说做好的一些好用的新功能,但样子基本不变.广播会从首页重新回到"广播"的导航页面.豆瓣成立于2005年3月,官方数据称,目前已拥有5300多万注册用户.今年9月份,豆瓣完成第三轮5000万美元融资,投资方分别为挚信资本.红杉资本和贝塔斯曼亚洲投资基金.以下为杨勃博文:只猜不说:豆瓣首页即将改版得

豆瓣首页即将改版:取消豆瓣说 新增豆瓣猜

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 12月31日午间消息,豆瓣(douban.com)创始人阿北(杨勃)昨日在豆瓣日志中发表文章透露,豆瓣首页即将进行新一次的改版.其中包括新增豆瓣猜功能,通过算法向用户推送适当的内容;此外豆瓣广播将被加强而豆瓣,豆瓣说则会取消. 阿北的文章标题"只猜不说",也正是新版变化的体现. 根据描述,豆瓣猜将是一种推荐搜索引擎的机制,

java-关于自然语言中Trie树修改版 请大家帮我填个注释吧 尤其是treeset

问题描述 关于自然语言中Trie树修改版 请大家帮我填个注释吧 尤其是treeset package MyTrie; import java.util.TreeSet; public class MyTrieUnit implements Comparable { int ch; // 某字符的ASCII码值 int val; // 标记是否为词的最后一位,并记录词对应的编号 TreeSet<MyTrieUnit> sons; public MyTrieUnit(int v) { ch = v

哪位大神能帮我解读一下代码 万分感谢

问题描述 哪位大神能帮我解读一下代码 万分感谢 有关色偏检测的 double operation::colorCastDetection(IplImage pFrame) { IplImage labFrame = cvCreateImage(cvGetSize(pFrame),pFrame->depth,pFrame->nChannels); cvCvtColor(pFrame,labFrame,CV_BGR2Lab); double da = 0;//色度a的平均值 double db =

豆瓣的10万用户定律

豆瓣是近年来非常火热的应用,用户数量不断增加,而有人说豆瓣是一家"慢公司",其实我们并没有故意要慢.为什么会给人这种感觉?实际上,每个公司的节奏和阶段目标不一样,豆瓣的幸运之处在于一直能用自己的节奏来做事,能一直将用户价值放在首位. 豆瓣的模式没有可参考样本,很多事情需要我们去摸着石头过河.创新产品实际上需要付出很大成本,包括体会新模式的时间成本,要多花一两年的时间才能将模式稳定下来,之后再进入一个健康成长的阶段.这段时间你自己在折腾,在试错.观察,可外面看起来似乎什么都没发生,好像很

WWDC 2016 | Siri 新技能 Get!帮你发微信、叫滴滴、支付宝转账

    在凌晨的WWDC上,苹果终于强力升级了 Siri. 用 Siri 给朋友发一条微信告诉他自己要迟到五分钟: 直接劳驾 Siri 帮你叫一辆滴滴专车: 告诉 Siri 用支付宝给你的朋友付100块钱: 像这种小事,以后你可能只需要动动嘴说一声"嘿 Siri"就可以完成了. 当然,除了苹果高级副总裁 Craig Federighi 在现场演示的发微信.搜索照片.使用支付宝之外,敞开胸怀的 Siri 在开发者手中还会有无数种新的玩法,这种朦胧却强大的期待让苹果用户遐想无限. 虽然开放

百度搜索风云榜开始测试新改版页面

    新版百度搜索风云榜增加地区新闻实时展现 新浪科技讯 11月16日午间消息,已在内部筹划测试多时的百度搜索风云榜新版页面(i.top.baidu.com),今日悄然开始对外开放测试,并计划稍后进行全面切换.与旧版相比新版榜单数增长两倍,并增加对地域搜索热点的呈现. 改版后,百度搜索风云榜在信息导航.榜单细分方面做了诸多优化,如旧版左侧的导航栏移到正中;实时热点则依旧占据首页左侧一屏的位置.和旧版相比,新版榜单覆盖的榜单数量达到了近百个;对于电影.电视剧.综艺.动漫.小说等进行了二级细分.

爱日租新改版全面上线 短租模式渐成趋势

据"爱日租"市场数据统计,青岛.厦门等海滨旅游城市景区附近的短租房源在过去40天一直处于爆满状态.北京.杭州.成都等每日房间预订率均在90%以上,呼叫中心每天要处理上千通电话咨询及预订.7月.8月旅游高峰,酒店价格疯长的同时,各地短租房东也初尝甜头.为了满足激增的订房需求,爱日租爆破式扩大地方线下人员,增加房源数量.到目前为止,爱日租的房源已经遍及全国70多个城市,30000多套备选房源,其中7000多套已通过质检和线下工作人员双重审核.9月5日,爱日租新UI全面上线.整个版面还是以蓝

新界面新功能Firefox 4.0 RC重磅登场

之前我们曾为大家提供过Firefox 4.0 RC的nightly每日开发版本,相信火狐粉丝们已经提前尝鲜了.今天,Mozilla正式发布了Firefox 4.0 RC. Firefox 4.0 RC主要在之前Beta版的基础上对整体稳定性.性能和兼容性进行了完善和提升,共79种语言版本. 更新日志: - 支持Do Not Track(DNT)header: - 各平台都开启了WebGL: - 默认主页设计进行了更新: - Firefox不再自动转换到离线模式: - 完善了Firefox插件管理