-
Notifications
You must be signed in to change notification settings - Fork 42
/
Copy path20180709-pm-11.html
155 lines (132 loc) · 8.8 KB
/
20180709-pm-11.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>葡萄藤PPT</title>
<link rel="stylesheet" href="./css/reveal/reveal.css">
<!-- PPT主题，可以在/css/reveal/theme/中选择其他主题，目前暂时只能使用该模板 -->
<link rel="stylesheet" href="./css/reveal/theme/ptt.css">
<!-- syntax highlighting 代码高亮主题 -->
<link rel="stylesheet" href="./lib/reveal/css/zenburn.css">
<!-- 打印和PDF输出样式 -->
<script>
var link = document.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = window.location.search.match( /print-pdf/gi ) ? './css/reveal/print/pdf.css' : './css/reveal/print/paper.css';
document.getElementsByTagName( 'head' )[0].appendChild( link );
</script>
</head>
<body>
<img src="./img/demo/logo.png" alt="" usemap="#pttmap" class="base-logo">
<map name="pttmap">
<area shape="rect" coords="0,0,276,58" href="http://www.jnshu.com" alt="" target="_blank"/>
</map>
<div class="reveal">
<div class="slides">
<section>
<h2>移动交互设计提示语总结</h2>
<p>谭品鸿</p>
</section>
<section>
<p>前言</p>
<p>一、提示语设计原则</p>
<p>二、中文App标点符号规范</p>
<p>三、提示图标使用规范</p>
<p>四、分类</p>
<p></p>
</section>
<section>
<h3>一、提示语设计原则</h3>
<h6 style="text-align:left;font-size:24px">（1）正确性原则：禁止使用错字、别字；禁止出现语法错误；禁止出现有歧义的提示语。</h6>
<h6 style="text-align:left;font-size:24px">（2）准确性原则：提示语信息应该符合客观事实，不能给用户有误的操作引导。</h6>
<h6 style="text-align:left;font-size:24px">（3）指导性原则：提示语应该能够真正起到指导作用，帮助用户识别、诊断问题，在适当的情况下应该提供用户恢复途径。</h6>
<h6 style="text-align:left;font-size:24px">（4）人性化原则：避免生硬、粗暴、刚性用语，内容语气要亲和，尤其是在出错、故障、异常等情况下，用户本已不耐烦，更应该使用人性化用语。</h6>
<h6 style="text-align:left;font-size:24px">（5）贴近用户原则：使用用户的语言、用词、短语和用户熟悉的概念，而非系统术语。避免使用生僻用语（生僻字词）、自创用语、错误代码。</h6>
<h6 style="text-align:left;font-size:24px">（6）尊重用户原则：杜绝一切辱骂、歧视、贬低性用语，让用户在全产品使用过程中感受到尊重。</h6>
<h6 style="text-align:left;font-size:24px">（7）一致性原则：</br>保持书写语言、语序、标点、图标使用的一致；</br>当提示语中涉及功能名称时，应与产品中的功能命名操持一致；</br>相同操作反馈的提示语内容和形式应该保持一致，相同场景下类似的提示语语法结构应该保持一致。</h6>
</section>
<section>
<h3>二、中文App标点符号规范</h3>
<h6 style="text-align:left;font-size:24px">统一使用中文标点符号；</h6>
<h6 style="text-align:left;font-size:24px">提示语语句中避免使用感叹号；</h6>
<h6 style="text-align:left;font-size:24px">句尾标点：除疑问句外，统一不使用标点符号；</h6>
<h6 style="text-align:left;font-size:24px">句中标点：断句使用逗号（，）；</h6>
<h6 style="text-align:left;font-size:24px">突出显示对象使用双引号（“”）。</h6>
<h6 style="text-align:left;font-size:24px"></h6>
</section>
<section>
<h3>三、提示图标使用规范</h3>
<h6 style="text-align:left;font-size:24px">等待含义提示语句尾统一使用图标（…），如：加载中“…”、正在验证“…”。</h6>
<h6 style="text-align:left;font-size:24px">文案结尾使用省略”…”使用规范：</h6>
<h6 style="text-align:left;font-size:24px">有详情展开，可以使用“…”；无详情展开时，不可以使用“…”；</h6>
<h6 style="text-align:left;font-size:24px">Button文字不能使用“…”。</h6>
</section>
<section>
<h3>四、分类</h3>
<h6 style="text-align:left;font-size:24px">1.错误提示</br>错误提示指由于系统原因造成用户无法完成目标操作的反馈提示，或者由于用户未能指照既定逻辑进行操作的反馈提示。</h6>
<h6 style="text-align:left;font-size:24px">（1）系统错误提示</br>适用范围：服务器错误，请求格式错误，响应超时等情况；</br>语法规范：错误原因+请稍后再试；</h6>
<h6 style="text-align:left;font-size:24px"></h6>
</section>
<section>
<h6 style="text-align:left;font-size:24px">（2）用户输入错误提示</br>适用范围：内容填写错误，用户输入敏感词汇，必填项内容未填写。</br>内容填写错误</br>语法规范：错误原因+操作引导；</h6>
</section>
<section>
<h6 style="text-align:left;font-size:24px">（3）用户操作超出限定范围提示</br>适用范围：用户操作超出当日 /月 限额、操作对象超出系统限制、用户操作过于频繁。</br>用户操作超出当日/月限制：</br>语法规范：今日/本月+已达上限+请明日（下月）再试；</h6>
</section>
<section>
<h6 style="text-align:left;font-size:24px">2.操作提示</br>定义：操作类提示是对用户与系统交互过程中系统提供的反馈信息。</br>范围：包括操作执行提示，操作结果提示，操作确认提示，操作引导提示。</h6>
<h6 style="text-align:left;font-size:24px">（1）操作结果</br>提示适用范围：操作成功，操作失败，操作状态反馈。</br>操作成功</br>语法规范：对象/ID+成果结果；</h6>
<h6 style="text-align:left;font-size:24px">操作失败</br>语法规范：失败结果+引导建议；</h6>
</section>
<section>
<h6 style="text-align:left;font-size:24px">（2）操作确认提示</br>适用范围：注销登录，发送贴子，清除信息，删除好友等。</br>语法规范：确认+操作动作+操作对象？[取消][“操作动作”]</h6>
</section>
<section>
<h6 style="text-align:left;font-size:24px">（3）操作引导提示</br>适用范围：功能列表为空（粉丝，关注列表），必填项引导文字</br>语法规范：系统现状（可选）+引导操作</h6>
</section>
<section>
<h3>更多讨论</h3>
</section>
<section>
<h4>谢谢观看</h4>
<p></p>
<p><small>By:谭品鸿</small></p>
</section>
</div>
</div>
<script src="./lib/reveal/js/head.min.js"></script>
<script src="./lib/reveal/reveal.js"></script>
<script>
// 以下为常见配置属性的默认值
// {
// controls: true, // 是否在右下角展示控制条
// progress: true, // 是否显示演示的进度条
// slideNumber: false, // 是否显示当前幻灯片的页数编号，也可以使用代码slideNumber: 'c / t' ，表示当前页/总页数。
// history: false, // 是否将每个幻灯片改变加入到浏览器的历史记录中去
// keyboard: true, // 是否启用键盘快捷键来导航
// overview: true, // 是否启用幻灯片的概览模式，可使用"Esc"或"o"键来切换概览模式
// center: true, // 是否将幻灯片垂直居中
// touch: true, // 是否在触屏设备上启用触摸滑动切换
// loop: false, // 是否循环演示
// rtl: false, // 是否将演示的方向变成RTL，即从右往左
// fragments: true, // 全局开启和关闭碎片。
// autoSlide: 0, // 两个幻灯片之间自动切换的时间间隔（毫秒），当设置成 0 的时候则禁止自动切换，该值可以被幻灯片上的 ` data-autoslide` 属性覆盖
// transition: 'default', // 切换过渡效果，有none/fade/slide/convex/concave/zoom
// transitionSpeed: 'default', // 过渡速度，default/fast/slow
// mouseWheel: true, //是否启用通过鼠标滚轮来切换幻灯片
// }
// 初始化幻灯片
Reveal.initialize({
history: true,
dependencies: [
{ src: './plugin/markdown/marked.js' },
{ src: './plugin/markdown/markdown.js' },
{ src: './plugin/notes/notes.js', async: true },
{ src: './plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } }
]
});
</script>
</body>
</html>