在UI设计时,经常会需要 设计 弹出对话框,以下是个样式设计:

0.标准对话框

说明

Title space : 标题区

contents space : 内容区

function space: 功能区

在功能区的 user decision making 箭头表示:“用户决策方向”,有两个方向 ”正向“或者”负向“ 或者说 ”肯定“和”否定“。 在这里,期望用户点击的方向,有利于用户操作的方向,为正向。

使用明显的 易于引起注意的 颜色标识 正向 的操作,更容易被关注和点击,甚至会被习惯性点击。

负向 和 可选项(Optional) 采用不已引起注意的颜色。

我绘制了常见的页面 弹出对话框的 更多样式

1.警告 Warring  有图标

2.信息 Info  有图标

3.提醒 无图标

4.提醒 有标题栏

5.选择对话框- 带按钮

-------------------------------------------------

参考:书籍 《神一样的产品经理》 第270页,第284页

UI设计, 弹出对话框 设计(区分强调按钮和普通按钮,给用户一个 正向建议的强调按钮)的更多相关文章

  1. SharePoint 2010 Pop-Up Dialogs SharePoint 2010 弹出对话框

    SharePoint 2010 Pop-Up Dialogs SharePoint 2010 弹出对话框         SharePoint 2010 使得往你的站点加入对话框内容变得出乎意料的简单 ...

  2. JQuery EasyUI弹出对话框解决Asp.net服务器控件无法执行后台代码的方法(转)

    原文:JQuery EasyUI弹出对话框解决Asp.net服务器控件无法执行后台代码的方法 jquery-easyui是一个基于jquery的图形界面插件,利用easyui可以创建很多好看的网页界面 ...

  3. NET使用了UpdatePanel后如何弹出对话框!

    原文:NET使用了UpdatePanel后如何弹出对话框! 在ajax中的UpdatePanel弹出对话窗,可以使用: ScriptManager.RegisterStartupScript(Upda ...

  4. AngularJS进阶(六)AngularJS+BootStrap实现弹出对话框

    AngularJS+BootStrap实现弹出对话框 参考资料: http://angular-ui.github.io/bootstrap/#/modal https://www.zybuluo.c ...

  5. [Firefox附加组件]0003.弹出对话框

    Firefox中使用面板(panel)模块来显示弹出对话框,面板的内容通过HTML编写.你可以在面板上运行content script,尽管在面板里的脚本无法直接访问插件代码,但是你可以在面板脚本和插 ...

  6. 10.JAVA之GUI编程弹出对话框Dialog

    在上节基础上添加对话框显示错误信息. 代码如下: /*弹出对话框显示错误信息,对话框一般不单独出现,一般依赖于窗体.*/ /*练习-列出指定目录内容*/ import java.awt.Button; ...

  7. 【Telerik】弹出对话框RadWindow,确认删除信息

    要做一个删除功能,但是删除前正常都要弹出对话框确认一下是否删除信息,防止误删信息.

  8. Response.Write("<script>alert('弹出对话框!')</script>") 后跟Response.Redirect("page.aspx");不能弹出对话框,直接跳转页面了 如何解?

    Response.Write和Response.Redirect一起用的时候就会这样,write脚本和redirect脚本不能同时使用,这样不会执行脚本,最好使用ClientScript 改进方法: ...

  9. selenium移动div里面的滚动条,操作弹出对话框

    还是使用js来移动 首先要定位到这个元素 倾向于使用js来定位元素,输入下面的脚本,按下回车键,即可在调试页面看到对应的div块$("div.table-responsive") ...

随机推荐

  1. MySQL通过Explain查看select语句的执行计划结果触发写操作

    [背景] 某某同学执行了一下Explain结果结果发现数据库有了一条写入操作,恭喜这位同学你的锅到货了,你签收一下: 对! 你没有听错,在一种场景下就算是Explain也会引发数据的写操作,就这是外层 ...

  2. private static final long serialVersionUID = 1L;

    作者:郭无心链接:https://www.zhihu.com/question/24852886/answer/117314768来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注 ...

  3. 【Unity】4.5 树木创建器

    分类:Unity.C#.VS2015 创建日期:2016-04-11 一.简介 在地形编辑器一节中,已经告诉了你如何使用已经创建好的树来形成大片树林.这一节告诉你在 Unity 5.3.4中如何利用[ ...

  4. 深入理解Linux内核-中断和异常

    Linux内核代码查看 http://androidxref.com/ 中断:被定义位一个事件,它能改变处理器执行指令的顺序.它对应硬件(CPU.其他硬件设备)电路产生的电信号. 同步中断:指令执行时 ...

  5. checkpoint and savepoint in FlinK

    https://info.lightbend.com/rs/558-NCX-702/images/preview-apache-flink.pdf https://www.microsoft.com/ ...

  6. Machine Learning Library (MLlib) Guide, BOOKS

    download.microsoft.com/download/0/9/6/096170E9-23A2.../9780735698178.pdf   Microsoft Azure Essential ...

  7. 36氪首发 | 「myShape」完成千万级人民币 Pre-A轮融资,推出 AI 智能健身私教

    无需任何可穿戴设备. 36氪获悉,myShape(原Shapejoy)已于近期完成千万级人民币的Pre-A轮融资,由天奇阿米巴领投,远洋集团.七熹资本以及老股东跟投.过去 myShape 曾获得元迅资 ...

  8. 银联在线支付B2C UnionPay.NET

    新春即将来临,首先给大家拜个早年,祝攻城狮们新年快乐.万事如意.合家欢乐.团团圆圆.幸福健康.来年更能大展宏图 实现各自的梦想! 同时预祝各大科技公司大佬们事业蒸蒸日上.公司转型突破创新.冲出突围带领 ...

  9. Splunk Web页面的登录密码忘记了怎么办

    splunk的web登录密码忘记的话,可以使用以下方法重置. 一.关闭splunk服务 /opt/splunk/bin/splunk stop 二.删除默认密码配置文件 三.重启启动splunk服务, ...

  10. scala工程导入报错:scalatest_2.10-1.9.1.jar is cross-compiled with an incompatible version of Scala (2.10).

    错误原因: The Scala IDE tries to check if binary incompatible Scala libraries have been inadvertently mi ...