前端开发中的一些用户体验细节
作者:Jason 来源:新媒重庆UED 发布时间:2010-10-19 12:23:00
标签:用户体验,细节,视觉设计
用户体验已经是一个老生常谈的话题了。我非常赞同某位达人所说的,用户体验设计应该贯穿于产品从萌芽到出生的整个过程,产品原型、视觉设计、前端开发、后端开发甚至还包括产品测试大家都应该有份。只有各个环节的同学都把这个事儿当事儿了,那么做出来的产品才有可能是好产品。我想,UED团队在这个过程中最需要做的就是把用户体验的理念当成血液一样输送到产品的全身。这也是我们新媒UED团队一直努力的方向。
本文主要谈一谈在实践中,面对一个产品,或者是一个具体的功能点,也可能只是一个按钮,一次点击等等,以前端开发工程师的视角,如何关注用户体验,以及一些需要注意的细节问题,嗯,只说细节问题。
1、事先给我一点提示
路过一个这么漂亮的按钮,很有心情发表一篇日志谈论一下天气:
结果点击之后告诉我“您目前没有权限添加日志”,关键是它还要跳转到一个新页面说这个事情,很不安逸。可不可以事先就说清楚?不让点击,变色,文字提示,或者你用个小弹出层提示也成啊。
看着这么醒目的小气泡,非常忍不住点击“小喇叭”看看:
嗯,小窗口优雅地向上滑出,相当不错的体验,技术相当霸道的小马哥!好的,接着又点“提醒”,OK,非常舒服的弹出。再点“站内信”,oh…我又被进入一个新页面了。这里如果给“站内信”加个鼠标提示,告诉用户现在不再是弹出,而是要进入新页面了,不就可以避免类似我这样的“误”操作了么?
2、表单验证
实时地告诉用户,这个应该怎么填,哪儿又填错了,毕竟填表单是件很繁琐和枯燥的事儿。不时地给我一点提示信息是非常不错的主意。


猜你喜欢
- 内容介绍以 Python 使用 关联规则 简单举例应用关联规则分析。关联规则 也被称为购物篮分析,用于分析数据集各项之间的关联关系。一般应用
- 数据透视表(Pivot Table)是 Excel 中一个非常实用的分析功能,可以用于实现复杂的数据分类汇总和对比分析,是数据分析师和运营人
- 测试配置文件test.conf内容如下:[first]w = 2v: 3c =11-3[second]sw=4test: hello测试配置
- 视图在django中,视图对WEB请求进行回应视图接收reqeust对象作为第一个参数,包含了请求的信息视图就是一个Python函数,被定义
- 使用export default导出class类首先我们要创建一个类并导出class win { getProcessInfo(
- 第一步:通过ip138来爬取外网ip第二步:通过python的smtplib模块和email来发送邮件,具体用法去网上搜索,下面是代码示例:
- 让我们重温一下JavaScript的一些基础知识,请先写出以下代码中问号处的答案,再运行比较!<script type=&q
- 这篇文章主要介绍了python构造函数init实例方法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要
- 最近发现各大类库都能利用div.innerHTML=HTML片断来生成节点元素,再把它们插入到目标元素的各个位置上。这东西实际上就是inse
- Oracle shutdown的时候突然断电,导致使用sql/plus启动时无法连接到数据库,具体描述为:connection can no
- 1、PyInstaller简介PyInstaller是一个跨平台的Python应用打包工具,支持 Windows/Linux/MacOS三大
- 你是否想知道为什么事务日志文件会变得越来越大?事务日志有时候甚至会比你的实际数据库文件还要大,尤其是在应用数据仓库的情况下。为什么会发生这种
- <?xml version="1.0" encoding="utf-8&
- 1.如何定位并优化慢查询sqla.根据慢日志定位慢查询sqlSHOW VARIABLES LIKE '%query%' &
- 1.冒泡排序,相邻位置比较大小,将比较大的(或小的)交换位置def maopao(a): for i in ran
- 本文实例讲述了基于wxpython实现的windows GUI程序。分享给大家供大家参考。具体如下:# using a wx.Frame,
- 随着互联网产业的飞速发展和电子产业的飞速发展,人们的社交似乎离不开网络,这就应运了SNS的飞速发展。从打开QQ空间关注朋友们的动态,最近心情
- CentOS升级Python2.6到Pythno2.7最近在Linode上弄Python、出现ValueError: zero length
- 前言何为爬虫,其实就是利用计算机模拟人对网页的操作例如 模拟人类浏览购物网站使用爬虫前一定要看目标网站可刑不可刑 :-)可以在目标网站添加/
- 先贴出完整代码. <script type="text/javascript"> function Stri