qtdesigner 如何清空输入框_如何进行开发需求分解?
在之前的文章中,我曾经向大家描述了我作为一个应用软件工程师的一个日常工作情况,接下来会利用几周的时间,详细描述如何开展这些工作。给已经是程序员,或者即将成为程序员的大家做参考。今天带来的是第一篇《如果进行开发需求分解》。
对于程序员来说,需求这个名词再常见不过了。所谓需求,就是我们要做什么。相当于我们的目标。需求是由产品经理提出,由程序员负责实现。那么有人就有疑问了,产品经理已经提出需求了,那开发人员为什么还要做需求分解呢?这个需求分解又是什么意思呢?
我可以这么向大家解释,产品经理提出的需求叫做产品需求,是我们最终产品的一个很粗略的功能。开发人员分解的叫做开发需求,是为了实现产品需求,具体要如何开发。开发需求的作用是能够指导开发,最终呈现的效果应该是A写完开发需求,B通过阅读开发需求文档,能够独立完成开发这项功能。因此开发需求中不能有歧义,每个步骤都要详细到能够知道如何写代码。
举个例子,产品经理提出产品需求:“用户可以通过输入用户名和密码登录,登录之后,显示用户信息”。听上去很简单对不对?登录这个功能在我们日常生活中太常见了,我们很容易想到这个功能的实现场景,用户输入用户名和密码,点击确定按钮,然后登录成功。但,开发需求有这么简单吗?当然不是。
开发需求分解之前,需要明确交互和视觉设计。 下图是百度的登录截图,可以基本上概况登录的情况了。
从上图的分析,我们可以分析出来,界面一共有四个元素,分别是两个输入框(即textBox),一个可以勾选是否自动登录的控件(checkBox)和一个按钮(button)。自动登录属于比较复杂的功能,是另外一个需求,略过不描述。重点关注另外三个控件。
观察两个输入框,发现输入框中间有一些文字描述,这种文字描述可以提示用户,这个框是干嘛用的。
如果鼠标移入之后,我们还发现输入框的边框变为了蓝色,表明如果焦点在该输入框中,输入框的边框需要绘制蓝色。如果我们此时输入文字,又会有新发现。
如上图所示,输入内容后,原先的提示文字消失了,输入框的右边出现了X按钮。鼠标移入X按钮,X按钮会变色,如果点击X按钮,输入框内部的文字就会被清空。两个编辑框的情况是一样的。另外再看登录按钮,当鼠标移到登录按钮上,会发现鼠标会变成一个小手的状态。有些视觉可能会设计登录按钮的移入、移除、按下的视觉效果。
如果我们输入用户名,但不输入密码,有些交互会设计让登录按钮禁用,无法点击,也有些交互可能会设计文案提示“请输入密码”。如下图所示。
对于密码输入框,经常会进行密文保护,所谓密文保护,就是用户在输入时,看不到真正输入的字符串是什么,而是以圆点或者*代替,这样就算是旁边有人,也不会造成密码泄露。有些交互可能会在右边设计一个眼睛按钮,用户点击眼睛,就可以在密文和明文密码之间进行切换,方便用户查看输入的密码对不对。
如果输入错误的用户名或者密码呢?就会显示成下面这样
前面铺垫了大半天,其实只是对登录一个功能的交互和视觉分析。真正的开发需求分解还没开始,就已经写了这么长的篇幅。但这些步骤一个都不能省略,因为以上所有看到的,都是需要开发的,所以这些分析很有必要。
终于开始写开发需求分解了啊!
login-001登录页面设计需求
1、用户进入登录页面,展示两个输入框和一个登录按钮。
2、用户名输入框提示语“手机/邮箱/用户名”。
3、密码输入框提示语“密码”。
4、用户输入用户名后,输入框右边出现X按钮,点击X按钮,用户名清空。
5、密码输入框输入密码后,显示密文。
6、用户输入用户名,不输入密码,直接点击登录,文案提示“请您输入密码”;
7、输入框焦点获取后,边框变蓝;
8、X按钮有鼠标移入、移出、按下效果;
login-002登录流程
1、用户输入用户名和密码,点击登录按钮,进入登录流程。
2、调用登录接口,向服务器发出登录请求;
3、如果服务器超时未响应,显示“xxx”;
4、如果服务器返回错误码xxxx,界面xxxx响应;
5、如果服务器返回正确码0,进入xxx界面。
这只是一个简单的登录,真实的项目中,还隐藏着更多,比如密码的输入规则啊、错误提示的方式啊等等。不过作为用户来讲,平时其实很少去关注。我是属于做这方面的工作较多,经常会留意一下其他网页端或者客户端的设计,有时候也会简单分析一下这些控件的功能该怎么写响应事件、怎么写委托。
以上就是今天的全部内容啦!原创不易,希望各位阿娜达,喜欢的请点个关注~~