您的位置:知识库 » 软件设计

常见UI设计模式

作者: seasun  发布时间: 2010-09-26 22:16  阅读: 4832 次  推荐: 0   原文链接   [收藏]  
摘要:本文总结了在产品设计中常见的UI设计模式,所谓“没有必要重复发明轮子”,模式往往容易解决常见问题,正确的模式能帮用户熟悉界面、提高效率。
[1] 常见UI设计模式
[2] 常见UI设计模式

 

  0.6调色盘/画布

  调色盘/画布虽然不算最常见模式,但它对于创造图形类文档有着不可替代的优势:比如设计线性或非线性图;流程图;页面布局;制定物理大小的设计/图表或控制布局。

  对于设计师来说调色盘/画布这种模式并不陌生,常用软件,例如:Axure、ps都是采用这种方式。

  0.7仪表盘

  一个设计完善的仪表盘应提供:一目了然的关键信息,实时数据,易读的图形和操作,清晰的入口和浏览。理论上讲,在一个屏幕下展示复杂的数据本身就很难。

  之前我用水晶易表为苏宁电器做的实时监控各个地区门店销售系统仪表盘

  0.8电子表格

  方便用户快速浏览,编辑大板块信息的理想模式。电子表格需要提供下列功能:标准的表格(诸如分类,隐藏/显示栏目,重列栏目,分组(如果可以)),全局撤销/重做,增加/插入/删除排,键盘导航,导入和导出。

  淘宝购物车选择使用电子表格,可以让用户对已选商品进行快速编辑(增加/减少数量,删除等)

  0.9向导

  对于复杂的或是不常见的流程,向导/快速启动屏幕模式可以有效地导航。

  京东上使用wizard快速引导不熟悉流程的顾客完成付款

  0.10.Q&A

  Q&A模式是指用户通过选取相符条件,从而自主找到适合自己的解决方案。Q&A不同于搜索模式,它通常需要了解用户基础上,通过提问来帮助用户弄清他们缺乏经验的在哪里(比如健康保险,抵押,计划,购买)有哪些可供的选择或建议。

上海移动资费导购系统可以让用户通过回答几个问题,可以建议用户选择哪种话费套餐

  0.11.平行面板

  平行面板屏幕模式可以收起(一次只显示一个),也可以展开(同时显示全部)。这种模式适合组织大量类似或相互影响的信息,让用户在同一页面更高效的获得信息。最佳应用在:需要申请者需要填写各种没有顺序的类别目录。

  0.12.交互模型

  交互模型屏幕模式应用在很多交互要素需要与关键项目(比如日历、地图、图标、画布等)进行交互的时候。是一种用户体验更贴近用户心智模型的模式。在日历、地图、线状图、预设可能场景分析(包括计算器),所见即所得编辑器(包括图片处理)时应用效果非常好。

Google的calendar在日历上可以直接编辑提示内容

  附加:13.空白状态

  空白状态指在任何数据输入或进入系统前,应用的自然状态。Getting real 一书曾说空白状态的屏幕使得用户更期待。通过给用户一种预览来降低担心、沮丧和犹豫。空白状态屏幕包括:视频,快速教程,帮助提示,安装后的截图。

Wufoo是一个在线表单设计网站,初始后会引导用户建立表单

  14.其他模式

  还有两种广泛使用但在企业软件很少使用的模式。

    - 门户:如果你是市场调研专家,商业需求分析师和用户反馈调研员设计门户,可以参考控制面板的设计规范和案例。

    - Tabs:其实Tab是一种部件,不是一种模式。它为在多种同语境下的数据提供多选一选择。如果数据结构导致你的设计tab显得很多。有两个小建议:第一,重新考虑架构。通过使用卡片分类或请教一名专业的信息架构师;第二,可以参考平行面板的规范和案例。

  参考文献:《Designing interfaces》and 《Designing web interfaces》

[第1页][第2页]
0
0

软件设计热门文章

    软件设计最新文章

      最新新闻

        热门新闻