如何提升企业产品WEB APP的用户体验?

   Web App 设计要点

  1. 配色

  颜色作为设计师传达情感的主要元素之一。一个明确的品牌颜色,对信任度,认知度都会有大大的提升。颜色除了能为界面提升美感,也能作为功能上的辅助。在普遍页面信息量大的企业产品中,往往一个有颜色的按钮就很容易吸引用户的视觉焦点。

  Lovely是Dribbble大神Kerem Suer设计的Web App。橙色主,蓝色辅助,淡灰色为底色。这个配色既色彩鲜明,淡淡的感觉更让人长时间使用也不觉累。整体感觉和谐舒服,简洁耐看。


  Squarespace用的是黑白配,可说是黑白配色中的皎皎者。利用大面积的留白,高质素的图片,配合极出色的交互,让你每次打开一个子页面时都存在惊喜,是笔者最喜爱的网页之一。


  连Icon也尽显Squarespace的品牌风格。


  2. 空间

  经常会发现,很多设计师在设计Web App及Mobile App时,会被屏幕尺寸所限制住,只专注一屏内显示所有信息。要知道网页设计及手机界面设计不同平面设计在于,前两者在屏幕外是有无限可能,你可以透过动画滑动一个全新界面到当前屏幕,也可以透过上下左右滚动来查看更多内容。 因此,设计Web App时可以更好的处理元素之间的空间。但要提醒的一点是,要注意在笔记本的尺寸底下,留白会不会过了。

  一个空间处理很棒的例子,来自Dribbble。


  这个思路在屏幕尺寸有限的Mobile App上更能体现。对比下面两个设计稿,左边的留白空间是不是更大气一些。


  3. 减少线条

  在扁平化设计中,间隔的处理上,尝试多用色块之间的对比来取代线条。减少线条可以让你的界面显得更简洁。回头你可以尝试一下,在设计稿中儘可能的去掉线条,或许会有耳目一新的感觉。


  4. 考虑不同尺寸

  由于大屏幕的慢慢普及,以往定在1000px阔度的网站已经开始不能满足于在大屏幕下展示。因此在设计Web App中需要考虑在不同屏幕尺寸下,界面元素的展示方式。最基本的要求是要考虑好最大及最小的场景: 1920×1080, 1024×768

  这是2014年初的屏幕分辨率统计(资料来源自CNZZ)


  Mailchimp在responsive的处理非常优秀。


  想更深入了解responsive,可以阅读来自ISUX龙哥的响应式网页设计一文。

  对企业产品设计的启发

  简单

  儘管你的产品背后逻辑很複杂,但要保証在呈现给用户时要操作简单而高效。

  Trello是一个多人任务协作类Web App。它的任务板只需用鼠标一拖就能轻鬆移动任务从一个阶段到另一个阶段。


  Mailchimp是一个邮件制作及跟踪的Web App。在制作邮件模板过程都提供了一个可视化的模板。基本上只需Drag&Drop及输入数值便可完成设计及程序上的事情。


  Invision是一个专为设计师快速制作交互模形的Web App。它的管理页面在分组上十分方便,可以在任何地点增加分割线,然后Drag&Drop来移动图片所在的组别。其交互模形制作过程更是快速高效,而且可以一键生成连结发送给其他非Invision的用户查看。


  渐进式呈现

  许多Web App都有一个通病,就是功能很多,同时又想一次把所有功能告诉用户,结果就导致用户第一次进来时,面对一个拥有庞大信息量的界面,然后还有一大轮新手提示的气泡。很多时候,用户就会因为手足无措或在体验中遇到一些挫折而失去了继续研究下去的衝动。为了增强产品对用户的第一印象,可以尝试使用渐进式呈现的理念来展示界面。

  拿Trello为例,第一次登录时界面上只会呈现一个项目方块,用户很自然地会注意并点击这个唯一抢眼的元素,进入项目后会显示一个任务版,点击其中一个任务再显示任务详情。


  同样是第一次使用,Trello对比Asana的表达方式是不是让你轻鬆得多。


  这种层层渐进的设计手法能使界面保持简洁,增强对用户的第一印象,降低用户的心理负担。类似的思维,其实在网页设计中经常会用到,例如Apple官网一开始只会显示不同产品的入口,进入特定产品后可以根据自己的兴趣点击查看更多去作更深入的了解,如果一页密密麻麻的把所有产品信息写满,这又会是另一种感觉了。更多关于渐进式呈现的说明,可以阅读由ISUX推荐的设计师要懂心理学。

  手机式的体验

  适量的使用动画,能在情感上为产品加分不少。时下html5及css发展迅速,在网页上经常能看到一些在手机上似曾相识的体验,这种设计除了让人感觉特别酷之外,还可以直接廷伸到移动端,作为一种体验上的统一。

  Squarespace的抽屉式导航。


  Teambition是国内的项目协作类Web App,它的收件箱有如iOS7的通知中心。整体设计也很简洁易用。


  结语

  企业产品的目的是要服务于企业,服务于人。

  一直相信,Apple及Google的极简理念是给予设计师一个很好的反思点。要把複杂的企业产品设计得简单有趣是很有挑战性的。面对简单,背后需要有强大的技术支持,以及设计师对改善人类生活中细节的关怀及执著,才能真正做到简约而不简单。

时间: 2024-08-22 14:25:07

如何提升企业产品WEB APP的用户体验?的相关文章

电商网站Web设计提高用户体验度的九个要点

无论是传统商业时代还是互联网电商时代,提高用户的极致体验都是达成营销盈利目标的重要行动.而对于电商而言,Web设计的核心与目标就是以用户为中心,追求极致的用户体验,并完成其本身所承载的商业或用户诉求等目标. 互联网时代,电商网站Web设计提高用户体验度有以下九个要点: 一.网站定位 首先,你应该确定你的网站的用户群有哪些,是否承载电子商务功能单位,是否满足在线购物需求等等.传统的电商网站页面颜色过于单调.布局太过传统且整体缺乏活力,只是满足官网的定位,但是却无法满足电子商务的网站需求.因此,这时

IOS产品的应用设计用户体验常识

IOS产品用户体验指南(HIG)中定义了IOS产品三种类型应用:一是实用型应用,这类应用可以让用户快速地获取某类特定的信息或某一个固定的任务,比如墨迹天气;二是效率型应用,这类应用范围比较广,需要用户花较多的时间和耐心,产品的功能较复杂,包括了社交网站到电子支付,比如微博客户端.支付宝客户端;三是沉侵式应用,可以用于玩游戏.看媒体等,比如疯狂的小鸟.以下是IOS产品的应用设计用户体验常识内容,以备时刻提醒自己: 1关注产品的核心功能,每屏的主任务 2提升用户关注内容的权重 3自上而下思考,把最常

通过设计使产品达成良好的用户体验

文章描述:体验设计的10点杂谈. 如何通过设计使产品达成良好的用户体验呢?很显然,这是一个复杂且系统的事情,尤其在今天,用户体验这个词被严重滥用,我们更要思考如何通过设计实质性的影响产品的体验质量,而非其他.设计师需要更多的关注产品,研究用户,理解和适应企业文化,从而通过设计过程.行为来影响产品的体验质量.以下是我实践积累和思考中感受较深的10点,聊以抛砖引玉.与大家进行探讨和交流,最重要的是,希望能在实际工作中发挥影响,有所改变.改善协作.流程,让各个团队的优势资源聚合,产生对产品强大的推动力

浅析京东商城产品列表页的用户体验和营销手段(三)

昨天在<浅析京东商城产品列表页的用户体验和营销手段(二)>中咱们说到了"一周销量排行榜"这块,今天继续看下面的!   浏览空调还购买了:有些人在浏览空调产品的时候,或许会突然想起来买一些别的什么产品,而对于空调却又并不是那么想买,所以他会看一下别的产品,最终买了其他产品并没有买空调.也有的用户买了空调后,觉得自己应该还需要买点其他的东西,也就顺便看一下其他产品,看到需要的就买下来. 当然这么主动的用户占的比例并不大,有些用户可能有这个想法,但是却很弱,弱到不会让他主动去翻看

引领厨电产品全面回归以用户体验为中心的好效果时代

对于众多钟爱欧式油烟机的消费者来说,今春最振奋人心的消息,莫过于厨电领导者方太全新一代欧式油烟机"云魔方"终于上市啦!作为方太精心打造的2014重磅新品,"云魔方"携5大发明专利,以及革新性的动力系统和颠覆性的设计理念,打造出欧式机史上前所未见的吸油烟"好效果"--它用完美环吸保护鼻子.48分贝低噪运行抚慰耳朵.清爽体验保障好胃口,更通过精妙设计带来了绝妙视觉和触感惊喜,为追求高品质生活的中国家庭,营造健康.环保.有品位的厨房空间提供了最佳选择.

用户体验理论:产品文档的用户体验

网页制作Webjx文章简介:用户体验理论:产品文档的用户体验. 有很多人跟我说过,产品设计过程中,最讨厌的就是写各种产品文档.一方面强调速度的互联网产品,加入此环节,会降低开发速度:另一方面当产品的定位.概念模型或原型已成形,文档撰写工作就相当枯燥无味,毫无乐趣:更重要的是,你写出来的文档可能根本就没有人阅读. 最早我也是如此认为.产品成形再费力的去写产品定位.功能设计有何意义,更何况重要的流程和规则都已在原型中标注,何必再多此一举.但是几个项目下来,我发现文档仍然有它自己的功用,如果维护的出色

浅析京东商城产品列表页的用户体验和营销手段(二)

昨天在<浅析京东商城产品列表页的用户体验和营销手段(一) >中咱说到了商品筛选这块,今天继续! 普通筛选如果无法达到用户所需要的精确度的话,其还准备了高级筛选给用户选择,当然此功能大部分用户是用不着的,因为这里面的很多参数大部分人都看不懂的,并且参数很多,看得人眼花缭乱的,不过虽然大部分人用不着这个,但是做生意嘛,目标是做所有人的生意,并不仅仅是大部分人,所以这个高级筛选的功能也是必不可少的,可方便少数用户更快的找到自己所想要购买的产品! 咱们视线再往下看,红色的"空调"二

浅析京东商城产品列表页的用户体验和营销手段(四)

在<浅析京东商城产品列表页的用户体验和营销手段(三)>中咱们说到了排序选择这块,今天继续看下面的.   晃眼一看就是普普通通的产品列表展示,图片+标题+价格+购买链接.产品图片和标题这里就不提了,每个电子商务网站产品列表页必须的格式,这个价格和其他电子商务网站比起来貌似都一样,没啥特别的,但是咱们结合其上级页面来看,上面几乎所有页面在价格前面都有一个"京东价",而这里却没有任何标志,我的理解是这样的. 首页乃至各大分类主页,所能展示的产品有限,并且这些页面的重要程度以及访问

为什么产品开发需要做用户体验研究?

  当我们讨论用户体验的时候,话题最终会偏向讨论用户体验设计.许多人会人为用户体验和用户体验设计是一回事,事实并非如此.当然,今天的话题我们并不打算深究两者区别,而是聊一聊"用户体验研究". 开发需要做用户体验研究?-用户体验研究"> 要探讨这一话题,我们得试着回答相关的两个主要问题: 用户体验研究的价值在哪? 用户体验研究是如何融入到产品开发过程中去的? 在深聊之前,我们不妨先温故一下用户体验的基本含义.追根溯源,就不得不引用一下用户体验这一领域的开拓元勋Jacob