需求背景&目标
公司在此前,使用钉钉作为移动OA平台。随着公司人员的扩大,管理需求的激增,数据安全的考虑,已不能满足公司需求。便产生了此产品的基本需求:企业办公平台自研,先从移动办公替换作为首要任务。
在职员工已超1500人,日常至少要满足员工考勤打卡、申请与审批、查找企业通讯录、查收公司活动通知。适配手机系统iOS、安卓。
1、保证员工留存与日活,协助业务部门推进办公管理改革;
2、保证体验,更多玩法,提升公司活动宣传的传播效率;
3、设计规范统一,清晰路线为移动OA平台,核心功能交互统一,使用快捷无门槛;
竞品结构拆解
竞品调研可辅助设计方案的决策与落地,作为功能与用户体验设计方面的参考,分析不同角色的用户,达到更好的理解产品作用。
产品功能层:首先确定产品的功能架构、核心亮点、功能的层级流转等,梳理出产品逻辑,作为交互与视觉的风格基调的参考基础。
交互体验层:包括操作交互、数据刷新、页面流转、动效实际效果,来确定适配系统及交互规范。
视觉表现层:主要包括配色、文字、排版、视觉风格等,美化产品视觉让用户印象深刻。
运营模式层:包括产品定位、用户习惯、商业模式,来确定后续的迭代方案。
此项目目标为替换钉钉,竞品分析以钉钉移动端为参考。
总的来说。
设计风格注重简洁、直观和易用性,符合现代设计的趋势和用户需求。它的扁平化设计、清晰的界面布局、强调视觉层次、一致的设计语言和简洁明了的图标和标签等设计元素,都为用户提供了一个优秀的使用体验。同时钉钉支持公司第三方插件的活动,于是钉钉具备消息的分层,以及多种不同程度的消息通知等级(应用内强提醒、短信、电话通知等)。
流程梳理、需求评审
在项目执行过程中,我参与了需求与设计的流程、评审等。涉及到的产出有:
需求拆解:根据用户需求,转化为具体功能和交互需求。
原型设计:基于前期需求沟通,设计应用的原型,包括用户界面和交互原则等。
界面设计:进行用户界面设计,包括图标、颜色、字体、排版等。
界面验收:提前做交互UI样式的验收,发现问题。
色彩规范
在企业应用中,可以根据企业的品牌形象和产品特点来选择合适的色彩搭配。公司品牌HuoBi_APP的主色调为蓝色,绿色作为高亮标签色,此项目的颜色遵循相同原则。并且参考钉钉等移动办公的简洁设计原理。制定的色彩规范如下:
文字规范
自动适配为操作系统默认字体,UI设计时以 iOS 为例。
图标设计
图标应该尽量简洁明了,能够快速地传达信息和功能。具有较强的可视性,能够在不同的背景下清晰地展示。使用简单的形状和色彩组合,避免使用过于花哨的设计。色彩相协调、易于辨识、可适应多种场景。
组件设计
UI组件设计是以标准化用户界面元素和统一性原则为准则。好的UI组件设计可以使用户界面更加直观、易用、美观,提高用户体验。
可重复性原则
简洁性原则
一致性原则
易用性原则
可访问性原则
安全性原则
响应性原则
头部标题栏
头部导航栏使用频次较高,为遵循组件设计原则,统一设计为一级标题栏、二级标题栏(含返回、子标题、详情、操作、完成、空白)
底部标题栏
常规类型的底部导航栏,组合形式为icon+文字,这种形式可以降低用户理解成本,提高用户操作体验。
按钮标准化
移动端手机按钮不需要hover态,本次遵循简洁原则,设计如下:

消息提醒
设计三种类型的消息提醒,文本类、连接类、按钮类。
弹窗设计
iOS与安卓的模态弹窗设计,根据系统有不同的区别。点击空白区域可以关闭弹窗。


日历模块
此项目会多处用到日历。日历包含两种形态:展开、收起。当向下滑动查看日程信息时,日历可以收起。
主要功能展示
登录
登录分为欢迎页与账号登录页:
首页(工作台)
工作台包含:
运营区(banner图+快捷入口)、办公入口(各业务管理工具入口)。
可以有效的解决快速办公的需求,并且方便随时上下架“小程序”。

消息
消息可以接入各服务,能做到统一交互提醒:

日程
日程可以作为提醒时间轴
考勤打卡
人事考勤业务,参考钉钉中打卡的交互逻辑,使用频次非常高的页面,因此主要改善界面阅读舒适度。













