旭日集团销售管理系统

重新设计视觉风格,统一组件规范,确保信息的传达更加简单易懂。通过视觉的提升,带给用户更好的使用体验。同时我们优化了操作的流程,为用户减少操作的时间成本。一个好的系统应该成为易用高效的工具,而不是为工作增加负担。

职位:

UI设计师

类型:

公司项目(B端、设计规范)

2024年5月-2024年7月

设计目标

体验侧

视觉升级

内容清晰

视觉舒适

功能侧

操作优化

操作易用

信息获取高效

框架升级,统一用户心智

统一框架布局

侧导航设计

清晰页面结构,收敛页面类型

通过数据可视化,提升工作效率

提高页面有效信息传递

减负增效,增强易用性

提升多工种协同办公效率

视觉舒适,营造高效、亲和的使用体验

提高页面有效信息传递

减负增效,增强易用性

提升多工种协同办公效率

内容清晰,聚焦效率提升

提高页面有效信息传递

减少步骤、减少跳转

定位设计问题

产品维度

过多无用功能模块

操作复杂

设计维度

视觉风格老旧

UI输出不规范

体验维度

表单数据信息阅读困难

信息传达低效

UI输出不规范

信息传达低效

风格老旧

设计规范

页面布局

208px

24px

1184px/间距16px

标签层

/Label bar

内容层

/Sontent layer

背景层

/Background layer

侧导航栏

/Stde navlgation

色彩规范

文本色/中性色

文字黑

#1A1A1A

文字灰.1

#666666

文字灰色.2

#999999

文字灰色.3

#DCDCDC

文字白

#FFFFFF

中性色-1

#FFFFFF

中性色-2

#F0F2FA

中性色-3

#D5DAE8

中性色-4

#D5DAE8

中性色-5

#BDC4DB

主题色

主题色-1

#F1F4FE

主题色-2

#E9EEFD

主题色-3

#BECCFA

主题色-4

#93AAF6

主题色

#6C88F5

主题色-5

#335EEE

主题色-6

#0D2FA0

提示色

正确色-1

#D54941

错误色-2

#FFF0ED

提示色-1

#E37318

提示色-2

#FFF1E9

正确色-1

#2BA471

正确色-2

#E3F9E9

字体规范

12pt/14pt/16pt/20pt/24pt/28pt

思源黑体/Source Han Sans CN

Arial English Font

属性:

Regular

Medium

Arial:AaBbCcDdEeFfGj

1234567890

界面展示

启动页

新的启动页面板更简洁高效,视觉中心也更突出。同时通过Midjourney快速生成符合风格,切合品牌元素的背景。二者结合使用,凸显科技感。

背景通过Midjourney快速生成

侧边导航栏

展开收起样式

导航栏视觉更轻量化,同时使用了投影效果,使选中项与其他选项有足够的区分。能让用户直观了解系统结构,便捷找到所需功能,使操作更便捷、易用。

数据可视化

为了提升页面的用户体验,在原有基础上新增了数据可视化部分。通过折线图、条形图、饼状图等多种图表形式,轻松了解数据的变化趋势和分布情况。

数据展示

将数据放在工作台第一排,可以让用户第一时间明析关键指标,及时掌握数据变化。提升工作效率和运营效果,确保业务的良好运转。

数据趋势折线图

折线图可以直观的反映数据趋势的变化,能够帮助用户及时洞察业绩的变化,进行数据的对比,以便迅速调整经营,优化销售决策至关重要。

数据条形图

条形图能够清晰地展示各个类别之间的数量差异,便于直观地比较不同类别的数据大小。同时可以展示数据在各个类别中的分布情况,帮助识别趋势或模式。

数据饼状图

饼状图通过将整体分割成多个部分,直观地展示每个部分在整体中所占的比例。通过观察各个扇形的大小,可以快速比较不同类别在整体中所占的比例大小。 

排行榜分析图

排行榜可以对项目、个体、组织等进行排名进行展示。直观地显示各项目的相对位置和优劣。

表格、表单

重新设计了表格、表单,使各个选项之间更清晰,可以应对不同使用情况。

增加间距

规范各个部分间距、排版

更多表格、表单

组件

为系统在原有的基础上,重新设计了组件。用以应对不同的使用场景,可以大幅降低用户的协作、沟通成本。

按钮

重新设计的按钮共两个尺寸,12款样式并新增了“开关”“返回顶部”按钮。多样的款式可以在不同的使用场景下,最直接清晰的操作指引。

导航

导航组件为侧边导航栏、分页导航,能让用户快速前往对应的工作界面,减少时间成本。

数据录入

数据录入是这套系统的主体功能之一,为之设计的组件为用户提供了清晰信息呈现。不同的组件状态,也适配了工作中可能出现的所用情况。

反馈

反馈组件主要作用是帮助用户在软件或网页界面中进行交互,使得用户可以更方便地识别或过滤数据,进行数据操作。

商品资料上传/审核

此页面涵盖了系统的基本内容和样式。左侧为侧导航栏,右侧顶部为搜索标签区。内容区域内包含页面导航、操作按钮、数据选择处理、表格。为了适配不同操作需求,数据选择处理区域共适配了4种不同尺寸的选择器样式,使页面更整齐规范。

侧边导航栏

搜索标签区

页面导航

操作按钮

数据选择、

处理

表格

国际码段设置

表格是系统中重要的操作内容,用户需要从表格中了解详细的数据,同时进行一些基本的操作。优化后的表格间距更合理、操作指引更明确,可以大大提高用户的使用体验。

上架申请

主要页面

资料上传、

标码设置、

oneone豪

批量修改申请

自检报告上传/审核

共20+页面

联系一下?

微信/电话:13534167660

邮箱:2235608685@qq.com

如果没找到我,那我应该在码头整薯条呢