请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册

QQ登录

只需一步,快速开始

Erik.Xue 讲师达人认证 悬赏达人认证 活字格认证
超级版主   /  发表于:2022-3-30 11:49  /   查看:982  /  回复:0
PC页面设计

普通页面:

登录页面:
登录页面是一个系统的“门面”,系统的登录页面设计的美观简介,对于用来而言,也是一种好的初体验。一般来说,目前主流的显示屏分辨率是1920*1080的分辨率,该分辨率目前投入使用的也占办公电脑屏幕的绝大部分。所以,我们的网页在设计大小之初,首先要确定的就是使用人群的机器屏幕大小,从而可以初步提升用户的使用体验。
其次针对登录页面,页面布局也同样重要,登录界面内容根据企业的品牌形象,软件需求而议,主要有logo、软件名称、企业宣传语、广告区、登录区、提示信息版权信息、客服条款、隐私声明、帮助反馈等等。登录界面的布局根据自然匹配原则,视觉流线总是从上到下,从左到右。根据这一原则,结合需要展示的内容,把登录界面的布局左右布局,上下布局,中心布局3种。
image.png391220092.png


活字格登录页面支持自定义样式,我们可以根据用户的使用习惯,调整登录表单的位置,如可放置在页面靠左侧(如上图),靠右侧或居中(默认)。如果从美观度上来看,靠左或靠右的布局方式更为舒适、协调。


主页页面
image.png103960570.png


进入系统的后的欢迎主页页面,主区域可以放置排布的常用功能按钮,方便用户使用常用功能按钮。侧边栏可以放置菜单按钮,以细分选择其他系统功能。整体的布局方正、简洁,用户接受度会更高。


列表页面
image.png304933470.png


列表页面推荐配合图文列表的形式进行展示,形成卡片式的展示效果,如图文列表中的模板可以设置白色背景及背景图的圆角,和主背景灰色形成一种立体的效果。列表中的修改、编辑、删除按钮可以选择使用图片单元格设置小图标,美观度更佳。


详情页面
image.png840085754.png


详情页面如果有主子表的关系,子表的展现方式推荐使用选项卡、标签页或页面容器的形式进行实现。其中,选项卡会一次性加载所有子选项卡中的所有表格及数据,如果子选项卡不是很多,子表数据不大的情况下推荐使用;标签页和页面容器会在打开对应的子页面后加载子页面上的数据,如果子页面上有数据量较大的表格推荐使用。如果有各个子页面单元格数据传递的需求,那么只能选择使用选项卡。


数据展示页面
image.png800779418.png


数据展示页面推荐使用自带的各种图表,如果图表不能满足需求,推荐可以对接使用echart中的各类图表。
占位符:   ------------很快会有一场公开课专门讲解如何包echart插件-------------



待办页面
image.png459711608.png


类似的待办页面,可以选择使用横线分割子模块,模块化更为突出,用户使用时有更清晰的条理感。

用户页面
image.png315054625.png

一般的后台管理系统可以设置用户页面,以此查看目前系统中的现有用户及相关用户信息,活字格提供丰富的用户管理服务端命令,除此以外,还有详细的用户API文档,需要的请戳------> API.html (58.53 KB, 下载次数: 57)

评分

参与人数 10满意度 +50 收起 理由
野猪佩奇 + 5
qq5168 + 5
luckgem + 5
muto + 5
一眼望天涯 + 5
phoben + 5
dklzhq + 5
szwckakar + 5
周冬景 + 5
Alink + 5

查看全部评分

0 个回复

您需要登录后才可以回帖 登录 | 立即注册