童话说说技术创业美文职业
投稿投诉
职业母婴
职场个人
历史治疗
笔记技能
美文纠纷
幽默家庭
范文作文
乐趣解密
创业案例
社会工作
新闻家居
心理安全
技术八卦
仲裁思考
生活时事
运势奇闻
说说企业
魅力社交
安好健康
传统笑话
童话初中
男女饮食
周易阅读
爱好两性

我们能从Google的全新UI中学到什么?

11月27日 斩情道投稿
  2011年网站变化最显著的就是Google,其一系列产品启用了全新的用户界面。这篇文章将探索决定Google用户界面设计背后的思维过程,或许我们能从中学到值得借鉴的方法和设计原则。
  谷歌用户界面改革历程
  1998:
  谷歌原始主页
  2012:
  更新后的界面
  “Google的使命是整合全球信息,使人人皆可访问并从中受益。”
  统一Google体验
  Google的网页从早期开始就发生了彻底的变化。用户的网页体验与以前相比有了更多途径,可以在不同的设备上观看并感受。Google已经做出了改变来反映这些变化。变化也被引用到统一谷歌一系列产品中,将这些产品整合,使得用户在产品切换之间有流畅的体验。Google的解释是:
  “我们的目标就是带给您更加无缝一致的在线体验,无论您使用哪一种Google产品或在何种设备上使用,都将获得这种体验。”
  Google带来的全新体验基于三个关键设计原则。让我们来看看这三个原则。
  Focus专注性
  专注性即指让用户得以专注于其想要快速轻松解决的任务或工作。把杂乱的内容清除,将用户的重点内容和常用工具始终保持在最前方。同时,还加入一些简单的东西,例如利用鲜艳的颜色来突出或隐藏不用的导航功能。
  通过这些方法,Google的用户界面能够帮助用户下意识地专注于他们正努力完成的工作,减轻用户的失败体验。
  Elasticity灵活性
  自谷歌开始改变以来,最大的变化就是其用户访问网页的方式。
  不仅在台式电脑上,我们更多的会将Google产品出现在移动设备中,例如智能手机,高分辨率的平板电脑及电视。“灵活性”的目的是让用户在转换使用不同的设备时能够保持一致的视觉体验。
  Effortless易用性
  尽管Google使用的技术和产品相当复杂,他们不想在设计中描绘这一复杂性。“易用性”的理念是保持产品的简洁,干净和一致性。
  “Google的新品牌将植根于信任,美观,技术和创新。”LarryPage
  Google导航栏
  Google重新设计的中心是其新的GoogleBar(导航栏),取代了原有位于屏幕上方的“硬又黑”导航条。Google意识到这条东西占据了我们屏幕上宝贵的位置,所以决定配以新的设计原则,赋予新面貌。
  新的菜单栏合并了Google的导航栏以及搜索栏、Google工具栏。保留了搜索栏和导航栏中所有产品功能,同时产品之间还能进行简单的切换。只需简单滚动google的logo,一个下拉式的菜单便会出现,用户可以有效便捷的在Gmail,Docs,Maps,YouTube以及其他产品之间转换。
  EddieKessler(Google的技术负责人)解释道:
  “统一,简化,告别旧的导航栏!让用户享受到超级简单的导航体验,是改变Google整体浏览体验的重要组成部分,也是我们努力的方向。这就是为什么对于此次改版,我们异常兴奋。”
  Google
  左:由AAlexPatrascu设计的Googlelogo右:Google的菜单和界面
  为了分析每个Google产品的UI是否完全达到其效果,在本文中我将选取几个最为突出的几个Google明星产品进行阐述。
  Google的进行改版时恰逢遇上今年最关系的一个网络项目:Google。比起其他Google的其他产品,Google可能更好的展示了其新的设计原则。对于产品发布后的预期,如果有一个产品需要被用于吸引用户,那Google首当其冲。它完美的展示了Google的设计理念,在我加入圈子的没几天,我发现自己已陶醉在其简单的设计中了。
  GooglePlus的部分设计是由AndyHertzfeld的UIUX团队完成。许多人会都会将Google与Apple的设计风格进行比较,如此争议或许是由于Andy在80年代曾受聘与Apple,并参与了MacintoshProject项目。Andy在项目中所要做的就是和JosephSmarr一起探讨‘circles’的概念。
  Andy解释了其背后的想法:
  “很明显这个想法的初衷是将用户分类。其次‘circles’的核心理念是能变得有趣,同时提高参与度,成为你愿意去做的一件事。由于会的变得乏味无聊,我们会对用户所做的采取奖励制度,在他们的脸上放上笑脸,试图让用户享受他们所作的一切。”
  GooglePlus如今是Google整体战略中不可分割的一部分。它将被整合进Google大部分的产品中,即使是在搜索结果中也能看到它的按钮。Google为我们的发现提供了超便捷的分享方式。“社交搜索”一词的意义比以往任何时候都具有价值,而且我相信搜索正引领着这个方向。Google这样说道:
  “Google社交搜索帮助你从你的社交关系网中发现相关内容,建立一套你的在线好友和联系人的网脉。有时候,来自好友和熟人的内容,比来自素不相识的人更具有相关性和意义。例如,一份来自对于在线电影的影评或许很有帮助,但如果这份影评来自你的好友,这将更有益处。”
  Gmail
  Gmail的新layout
  据CBS的报道,截止至2010年11月Gmail拥有1。933亿名活跃用户。为了挽留住这些用户,Google简化了Gmail的设计以此增强用户体验。他们对此作出了以下几项改变:
  简化对话模式
  Gmail中的对话模式被完全重新设计,当邮件归档时能更容易浏览。资料图片被添加进对话中,帮助用户更好的参与进对话中。同时有助于对自己所说的话进行追踪。区别于原有的UI,新的设计可以让用户专注于与同事和好友之间的沟通。
  良好的导航性
  左边侧栏导航被重新设计,并且可供用户自定义。用户可以根据自己的喜好更改聊天区域的大小,或者点击左侧栏下面的小图标,完全隐藏它。结合所有的新产品,用户可以以自己的方式通过Tab或箭头键浏览Google界面,再次为用户提供了最方便的导航方式。
  增强搜索
  重点突出了Gmail新增的搜索功能
  Email对于web使用者来说是一个非常重要的工具。事实上,每天预估有294亿封电子邮件发送中。如何找到散落在我们收件箱的邮件成为了当务之急。Google为此提供了一种超越以往标准搜索的方式。现在,用户可以点击隐藏了高级搜索版面的下拉式列表,只需点击几下,即可创建搜索过滤器。
  阶段性推出
  无论你是否喜欢Google的新改版外观,无疑它已经取得了成功。在过去的几个月中,它成为了网络上的热门讨论话题,并且获得不少粉丝。其中成功的部分可能归功于Google已经做出的改变。Google选择阶段性的推出来取代一次性的上线,因为这通常取决于产品。通过此方法,他们可以实时收集用户的反馈意见,并决定什么是有效的,同时对下一阶段所要开展的项目进行重新评估。
  阶段性的推出也有其他好处。通过几个月内,对于UI推出时间方面的消息,Google利用媒体对其UI进行了一定的炒作。从BBC到纽约时报,再到别家媒体,大家都在报道关于Google的变化,更何况是社区论坛中发表的众多评论。
  深入了解GoogleUI
  GoogleUI的用色
  通过以上的颜色举例,我们可以发现Google一直保持其色调的着色限度。他们利用蓝色和红色突出重要的功能,这两者都是从Googlelogo的原型中延伸出的颜色。
  按钮
  Google的新按钮和icons设计
  作为新设计战略的一部分,Google推出了一套新系列按钮。这些按钮清晰、简洁、简单并很清楚的呈现了Google的“焦点”式设计原则。他们使用了HTML5和CSS3技术进行创建。让用户感到吃惊的是,按钮并不是真正的按钮,也不是锚标记,而是在创建中使用了div实现的。这是用来表示一个通用的标记启着一个标准部件的作用。这对于利用屏幕阅读器等设备浏览网站的用户来说十分有帮助。
  Google采用CSS3的实现圆角细腻渐变的按钮效果,同时在悬停按钮的底部添加一个微妙的阴影,带了额外的时尚感。按钮一般被分为两大类“独立”和“左、中、右”。每个类别有2个不同的尺寸“标准”和“大”。在其范围内选择这4个风格,Google为它的用户带来统一体验。
  Comfortable,Cosy,Compact
  在任何设计中提倡一个好的用户体验的其中以因素在于视觉吸引。Google允许用户对某些产品可以进行自定义屏幕显示密度。此项功能在Gmail、Reader、Docs以及其他文字应用中都可使用。“Comfortable,Cozy和Compact”这些选项取决于用户计算机的显示密度。随着媒体的热议,我敢肯定,这类型的屏幕显示密度选项将跨越其他网络产品,并开启新时代。
  结论
  在过去的六个月中对于Google新UI设计原则的研究相当激烈,我可以大家从他们以及实施的战略中我所观察和学习到的。最为互联网领域最大的品牌之一,他们已经清楚的了解领悟了简单和统一的体验是至关重要的。
  “简单和统一的体验是关键。”(Simplicityandaunifiedexperienceiskey)
  它也亲自教会了我去降低UI元素的强度。阴影是否真的需要80的不透明度?能不能只降低2030?作为一个设计师,我们希望人们注意到我们所作出的额外努力,比如降低阴影的百分比,或是过渡突出,使其一目了然。有时,通过微妙的变化,可以实现更好、更顺畅的效果,无论是为了营造视觉效果,还是抓取用户视线,都能达到预期的设想。同样的原则也可以应用于边界半径,尝试将色调从平时的5或10px降到1,2或3px。当然,这些做法并不适用与每一个项目,但当你选择进行一个“干净”的设计是,它一定是至上之选。
  同时,我们也了解到和以往相比,如今的网络是一个非常不同的地方。有关InternetExplorer的最新消息,IE将自动更新期浏览器,现在我们可以开始依赖于最新的网络技术,跨浏览器的开展工作。Google或许对此有了新的对策,而不是他们任何新产品的设计工作。现在我们可以在没有浏览器限制的情况下开展设计工作。现在我们应该重新调整时间创建跨设备兼容的网站和屏幕分辨率,最终带来良好的用户体验。
投诉 评论 转载

小文字大体验随着ipad等移动终端的崛起,人们在移动终端阅读上的时间越来越多,阅读体验已经变得越来越重要。而字体又是决定阅读体验的关键所在,那么字体在哪些方面又是什么影响着阅读体验的成败?……通往优秀UI设计师之路的20个路标导读:界面设计师JoshuaPorter在自己的博客中发表了这篇文章,文章中列举了20条用户界面的设计原则,这些原则是设计师们在设计工作中需要遵循的,它们能够给设计师们提供较好……更效率的信息小议网站文案设计前段时间在北京的交互体验日上,听了新浪产品经理李驰明的《更效率的信息》,感叹新浪对于媒体和信息传播研究之深刻、抓住了很多细微单直抵网民心灵的点。他认为微博之所以能迅猛发展并成为……儿童移动应用的界面设计基础知识注:实习生wenli对本文皆有贡献最近处于项目需要,开始研究儿童产品的界面设计。在此之前,对儿童如何使用移动产品和如何设计知之甚少。优质的移动应用,为儿童带来乐趣的同时可……两国的“微”与“博”Twitter与新浪微博的功能差异化探究科技是一把切割刀,刀锋所及,无论是时间、生活、情感抑或思维、都成为碎片化的存在。微博、Twitter迎合着人们碎片化的需求,在夹缝中寻找到了生存的契机。然而微博在中国与Twit……走进工具型网站释义及典型案例提到工具型网站,我们首先会有个疑问:大千网络网站众生,究竟什么样的网站才算是工具型网站?它的特征是什么,与其他网站有什么不同?从网上搜索相关信息,了解到关于该名词的具……我们能从Google的全新UI中学到什么?2011年网站变化最显著的就是Google,其一系列产品启用了全新的用户界面。这篇文章将探索决定Google用户界面设计背后的思维过程,或许我们能从中学到值得借鉴的方法和设计原……用数据辅助设计搜索中的实践设计时不能单凭经验和直觉,因为涉及到的目标人群、场景、操作习惯的不同。为了获取更准确、有效的信息去辅助、检测设计,设计师会选择定性(用户访谈、焦点小组)和定量(调研问卷、网站数……假如你是QQ的产品经理基于需求金字塔模型的解答用户需求千奇百怪,先做哪些需求,后做哪些需求,不是由产品经理和公司老板拍脑门决定的。先出一道题考考产品经理们:1998年,QQ开始规划,1999年2月推……融合的设计QQ浏览器(android)设计分享每一次全新版本的设计都伴随着挑战与激情,它们化成对产品不断精细打磨的动力。在经过反复的推敲和锤炼后,孕育出了QQ浏览器的全新版本。这个版本优化了交互结构,新增应用以及边栏小工具……从排队等待谈进度条设计排队等待是一种日常中常见的现象,例如新年领开工利是、去排队购买首发的苹果产品、每天中午去食堂排队购买午餐。排队等待在我们的生活中无处不在且看似是一个简单的现象。即使是种简单的存……移动应用设计中应避免的10种错误导读:本文是来自移动应用开发公司Sourcebits系列文章MobileAppTrendsSeries(译者:此网站要梯子)中的一篇,文章内容适合初涉此领域的读者,现翻译如下。……
建议收藏:可能是最全的Axure输入框AxureRP9教程:页面三级拖动AxureRP9教程:制作漂亮的bootstrap4进度条Axure教程:实现菜单下拉效果Axure教程:鼠标移入时切换菜单Axure教程:计数器的实战应用场景商品购件数Axure教程:实现商品规格选择功能Axure教程:用中继器做APP引导页Axure教程:数量加减的实现Axure教程:规格的实现AXURE教程:手机键盘Axure教程:实现商品分享功能

友情链接:中准网聚热点快百科快传网快生活快软网快好知文好找作文动态热点娱乐育儿情感教程科技体育养生教案探索美文旅游财经日志励志范文论文时尚保健游戏护肤业界