产品经理如何设计B端系统的登录功能

PM产品小6 2024-06-04 17:14:49

今天聊下产品经理B端系统的登录功能如何设计。

设计原则

登录功能,一个系统最初要设计的功能了,登录功能需要区分对外用户和对内用户,一般对外的需要有注册功能,对内的基本上都是管理员分配的。同时登录功能需要搭配【用户管理】一起,登录的信息校验都是来源于【用户管理】。

登录功能的设计原则最重要的就是安全性灵活性次之。不管是产品设计上的,用户名、密码、验证码等,还是技术设计上的密码加密、身份认证、服务架构、token、cookie等,安全最该考虑。

同时还要考虑集成系统的情况,即有多个系统使用一个登录功能,进入后需要有一个系统导航,点击每个子系统又可以进入。

整体方案

新建【用户管理】,维护用户的基本信息,本身需有添加功能,登录功能的用户数据就来源于此。

登录功能这边需要有用户名、密码和验证码,登录后数据与【用户管理】校验,成功即可进入系统,有多个系统使用一个登录功能,进入后到系统导航,点击每个子系统又可以进入,登录可保持24h有效,子系统4h有效。

注册功能填写的数据,需要同步到【用户管理】,包括重置密码这些也需要更改【用户管理】的信息。

原型图

【用户管理】比较简单,这里只放个注册和登录的界面。

用户登录原型图

用户登录原型图

用户管理子段取值逻辑

【用户管理】的新增、编辑这些按钮,不再细聊,前面聊过很多,简单说下字段需要要哪些,及取值来源,取值来源就需要注意两个,一是注册完成需要将数据保存到【用户管理】,二是重置密码需要更改【用户管理】的密码,当然,如果有个人信息更改的功能,也需要对应更改数据。

微信截图_20240604170337.png

登录功能详情设计

这是这个设计里面的重中之重了,尤其是涉及到一些校验的,一定要清晰。

功能名称详情说明
用户名1.文本格式,必填项,只支持16位以内的英文大小写或数字,默认为空;

2.若不是16位以内的英文大小写或数字,报错:用户名只支持16位以内的英文大小写或数字!

3.点击登录与【用户管理】用户名校验,若不存在或状态不启用,报错:用户名不存在!或用户名未启用

密码1.文本格式,必填项,只支持8-16位以内的英文大小写或数字,默认为空;

2.若不是8-16位以内的英文大小写或数字,报错:密码只支持8-16位的英文大小写或数字

3.点击登录与【用户管理】用户名+密码校验,若不存在,报错:密码错误

验证码1.验证码采取个简单一点的,滑动的形式就好,或者稍复杂一点,拼图的形式,像12306那种真没必要了,做个这种系统会引起公愤的

2.若没有完成拼图,登录报错:请正确完成拼图

登录1.点击登录按钮,若通过上面的校验,进入系统界面,如果是单个系统,进入默认界面,可以是看板管理、待处理管理或者某个数据图表;如果是集成多个子系统的,就是个系统导航页面
注册1.注册功能以对外用户为主,对内用户基本上公司会给你分配账号,用不到注册;

2.点击注册,弹出界面,填写内容,点击保存即可;

3.校验用户名,若与【用户管理】出现相同的,报错:用户名xx已存在,请更换

4.字数限制、必填项的校验;
1.用户名:文本格式,默认为空,最多16位,必填项;

2.邮箱:文本格式,默认为空,加个邮箱格式的校验,xx@xx,搭配验证码一起,必填项;

3.手机号:手机号一般也搭配验证码,需要输入有效验证码才能注册成功,必填项;

4.密码:文本格式,默认为空,限制8-16位,大小写字母或数字,必填项;

5.密码确认:文本格式,默认为空,限制8-16位,大小写字母或数字,同时要跟密码一样才可以,必填项;

6.用户协议;一定要加这个,跟法务确认好,用户注册需要接受你们的这些协议,必须勾选;
重置密码1.重置密码这个功能可有可无,如果对外用户,可以加;如果是公司内部系统,有可以,没有影响也不大,因为管理员可以给你重置的;当然,有肯定会方便;

2.点击重置密码,弹出窗口,按要求填入新密码保存即可;

3.可以按以下方式:

1)回答密保问题,重置密码;

2)按之前绑定的手机号或邮箱,输入验证码后,重置密码;

3)什么都不用,直接重置,这个不太建议,安全性不高;

4.重置完成后需要根据用户名更改【用户管理】的密码;
校验:

1.全部字段必填项;

2.新密码、密码确认:文本格式,可以支持显示和隐藏内容,默认为空,只支持数字、英文大小写;

3.若密码长度不到8位或超过16位,保存报错:密码只能8-16位!

4.若密码不是数字或英文大小写,保存报错:密码只支持数字或英文大小写!

5.如果需要更严谨点,可以加校验密码需要同时有英文大写、英文小写、数字三者存在,否则保存报错:密码需同时由英文大小写和数字组成!

6.密保问题、绑定手机号、邮箱等这些,下拉框的,显示出这些内容,输入框也是文本框格式,默认为空,这个校验就是内容跟当时定的或者发送的字段是否一样,若不是报错:xx错误!

子系统登录说明

我们按一个统一登录的设计,进入主体界面后,需要进入每个子系统,点击即可,这里也需要每个子系统授权登录,采取同一套登录权限。

如果是一开始就按这种形式开发的框架,就很容易。

如果多个子系统先开发完成,后续再做统一登录功能,这里就需要将所有子系统的用户信息统一,即每个子系统其实也保留一套用户登录信息,只是这些都跟统一登录的数据一样,这样就可以进入每个子系统时按这个用户去访问这个子系统的用户权限信息,完成登录。

声明:以上内容(如有图片或视频亦包括在内)为“PM产品小6”用户上传并发布,墨思产品经理平台仅提供信息存储服务。

Notice: The above content (including the pictures and videos if any) is uploaded and published by the user, and this platform only provides information storage services.

相关推荐: