B端产品登录功能的重要性
常见的B端产品登录功能
B端产品登录功能的设计思路
确定登录功能主流程
确定登录功能的辅助功能
B端产品登录功能注意事项
明确的提示反馈
友好的交互体验
4.3 安全的辅助手段
特殊的功能需求
B端产品登录功能需求文档范文
功能概述
功能说明
-
用户打开登录网址进入登录页面; -
输入登录账号、密码、验证码进行登录;
-
账号输入框:输入账号后显示清空操作按钮,点击清空按钮清空已输入的账号; -
密码输入框:输入密码后显示密码明文查看按钮及清空按钮,鼠标按下明文查看按钮密码明文展示,鼠标松开后密文展示,点击清空按钮清空已输入密码; -
验证码:验证码为4位随机的大写英文字母,单击验证码展示区域刷新验证码,验证码有效期为60秒; -
所有输入框获取焦点时提示文字消失且边框变为绿色,失去焦点时恢复原状; -
【登录】按钮:点击【登录】按钮时依次校验登录账号、密码、验证码,若某一项校验出问题则在对应输入框下方红字提醒用户错误原因,全部校验通过则成功登录并进入系统首页; -
【找回密码】按钮:点击【找回密码】按钮跳转至找回密码页面; -
账号首次成功登录时弹窗提示账号首次登录时需修改初始密码,点击【确定】按钮跳转至修改初始密码页面,初始密码修改后需要重新输入账号、密码、验证码进行登录;
-
用户初次成功登录账号后弹窗提示用户修改初始密码; -
点击弹窗的【确定】按钮后页面跳转至重置初始密码页面;
-
新密码输入框:输入密码后显示密码明文查看按钮及清空按钮,鼠标按下明文查看按钮密码明文展示,鼠标松开后密文展示,点击清空按钮清空已输入密码; -
确认密码:输入密码后显示密码明文查看按钮及清空按钮,鼠标按下明文查看按钮密码明文展示,鼠标松开后密文展示,点击清空按钮清空已输入密码; -
验证码:点击【获取验证码】按钮向登录账号绑定手机号发送6位随机数字验证码,验证码已发送后【获取验证码】按钮展示60秒倒计时,倒计时结束后恢复原状,验证码有效期为60秒; -
所有输入框获取焦点时提示文字消失且输入框边框变为绿色,失去焦点时恢复原状; -
【取消】按钮:点击【取消】按钮取消修改初始密码,返回至登录页面; -
【提交】按钮:点击【提交】按钮依次校验密码、验证码,若某一项校验出问题则在对应输入框下方红字提醒用户错误原因,全部校验通过则提示重置密码成功,然后返回至登录页面;
-
用户打开登录网址进入登录页面; -
忘记登录密码后在登录页面页面点击【找回密码】按钮进入找回密码页面;
-
新密码输入框:输入密码后显示密码明文查看按钮及清空按钮,鼠标按下明文查看按钮密码明文展示,鼠标松开后密文展示,点击清空按钮清空已输入密码; -
确认密码:输入密码后显示密码明文查看按钮及清空按钮,鼠标按下明文查看按钮密码明文展示,鼠标松开后密文展示,点击清空按钮清空已输入密码; -
验证码:点击【获取验证码】按钮向登录账号绑定手机号发送6位随机数字验证码,验证码已发送后【获取验证码】按钮展示60秒倒计时,倒计时结束后恢复原状,验证码有效期为60秒; -
所有输入框获取焦点时提示文字消失且输入框边框变为绿色,失去焦点时恢复原状; -
【取消】按钮:点击【取消】按钮取消修改初始密码,返回至登录页面; -
【提交】按钮:点击【提交】按钮依次校验密码、验证码,若某一项校验出问题则在对应输入框下方红字提醒用户错误原因,全部校验通过则提示重置密码成功,然后返回至登录页面;
-
用户成功登录账号; -
在我的页面选择修改密码进入修改密码页面;
-
原密码输入框:输入密码后显示密码明文查看按钮及清空按钮,鼠标按下明文查看按钮密码明文展示,鼠标松开后密文展示,点击清空按钮清空已输入密码; -
新密码输入框:输入密码后显示密码明文查看按钮及清空按钮,鼠标按下明文查看按钮密码明文展示,鼠标松开后密文展示,点击清空按钮清空已输入密码; -
确认密码:输入密码后显示密码明文查看按钮及清空按钮,鼠标按下明文查看按钮密码明文展示,鼠标松开后密文展示,点击清空按钮清空已输入密码; -
验证码:点击【获取验证码】按钮向登录账号绑定手机号发送6位随机数字验证码,验证码已发送后【获取验证码】按钮展示60秒倒计时,倒计时结束后恢复原状,验证码有效期为60秒; -
所有输入框获取焦点时提示文字消失且输入框边框变为绿色,失去焦点时恢复原状; -
【取消】按钮:点击【取消】按钮取消修改密码,返回至我的页面; -
【提交】按钮:点击【提交】按钮依次校验密码、验证码,若某一项校验出问题则在对应输入框下方红字提醒用户错误原因,全部校验通过则提示重置密码成功