智慧医院5.0

Overview

这次有机会可以主导版本迭代,深入医院、用户之中,得到了宝贵的问题反馈,在项目实施中,融合版落地实施一年,从医院和区域项目经理、商务经理收集到了一些反馈意见、实施中存在的痛点

Year

2022

Industry

智慧医疗

智慧医院5.0

Overview

这次有机会可以主导版本迭代,深入医院、用户之中,得到了宝贵的问题反馈,在项目实施中,融合版落地实施一年,从医院和区域项目经理、商务经理收集到了一些反馈意见、实施中存在的痛点

Year

2022

Industry

智慧医疗

设计优化与调整

视觉升级 规范升级

目经理与商务经理

1.首页还是10%左右有的医院,是需要明确的绑卡入口、明显的就诊卡,支持快捷绑卡、显示就诊码与就诊人

2.在实施中会遇到医院上线功能很少,按照标准版配置之后,首页显得特别空、不好看,医院也觉得不够丰富,需要快速配置出不同功能数量情况的首页。

3.设计样式不够丰富 有的医院想要平铺功能、有的想要只做分类、有的想要同颜色、有的不想要不同类型功能用不同的颜色、有的想要一行不要只展示4个、有的想要四叶草布局等等,医院存在多样化的需求。

医院

反馈新版首页图标质感不够,医院作为传统事业单位类型,对于审美和设计的需求还存在局限性,但是这些问题是要值得尊重的,而不是驳回,坚持自己的见解,毕竟甲方需求决定了市场反馈

体验设计部

经过一年的使用体验、设计和功能的维护,部分设计风格需要优化调整、交互需要更近一步的统一

1.视觉&设计系统升级优化

视觉优化

重新优化全局风格样式,圆角缩小,布局、间距缩小,整体风格更加沉稳,承载更多内容信息元素,提升用户就医的安全感、传递医院的专业性。同时在页面中融入品牌元素,有更多的品牌曝光。

设计系统

全面支持了figma最新的自动布局4.0、组件属性,整体组件数量比之前减少30%左右。在融合版迭代设计过程中,协同组件库一起进行优化,移动端规范涉及到的医生卡片、内容卡片重新梳理

2.主功能图标优化

全新的主功能图标遵守海鹚移动端图标设计规范,剪影图标为主体,附加展现状体或属性的浅色图标,提成层次感。添加光影质感以及毛玻璃材质,提升整体的材质

图标拆解为两部分,主体部分尽量去贴近功能场景的真实样貌,也就是轻拟物,提供辨识度、质感。次要部分为由右下角叠加毛玻璃样式图标,负责装饰、强化功能属性,同时增加层次感。

3.次功能图标优化

次功能图标全局优化,首先确定一点是不会走之前旧版本的高饱和度的渐变方案,首先在现有颜色的基础上,「塑造」渐变效果。同时依赖figma的组件库同步功能,每一个图标都可以通过改变颜色属性面板的主色,实现自定义颜色,达到医院想要统一颜色、自定义颜色的需求

将渐变颜色拆分为 纯色+白色渐变 两部分,相互上下叠加,只需要控制定义过得纯色的颜色样式,便可以实现批量自定义图标颜色。

功能&效率 优化提升

功能模块多样式 后台升级

首页功能模块多样式设计

首页加入绑卡与就诊卡的显示在顶部常驻:考虑到就诊就诊可视化卡片也在顶部显示,所以此次将就诊卡的绑定与显示,默认为就诊可视化流程的第一步,兼容开启就诊可视化业务后的页面设计。

医院背景
医院背景
医院品牌色
医院品牌色
轮播Banner
轮播Banner
功能多样式设计

主功能、次功能提供不同功能数量、不同交互样式的设计方案,以为作为配置模板。如:一行两个、展开、滑动等等

多模式设计

综合以上优化点,提供标准模板、简洁模板、极简模板,来匹配不同的首页配置场景,让项目经理/商务经理快速完成配置上线。(极简模式下新增了一个医院卡片,除了丰富视觉场景,也避免过于单一的功能带来的简陋、低质量感,强调官方属性。)

医院背景
医院背景
医院品牌色
医院品牌色
轮播Banner
轮播Banner
新·后台配置功能

1.将首页所有模块拆分为独立组件,可以在左侧组件库自由添加,也可在中间可视化配置区域删除、拖动排序,选中相应组件,可在右侧的组件设置区域,进行丰富多样的自定义配置。

2.可视化配置区域支持切换三种首页设计模式,可以根据实际项目情况,在设计模板基础上进行快速设计。3.主功能 &次功能区提供不同的配置模板,可以根据实际项目情况,在选定的模板样式上,选择需要上线的功能,快速进行配置,同时支持次功能区图标支持自定义颜色,只需要输入色值,可自定义不同分类不同颜色、整个功能区相同颜色

3.主功能 &次功能区提供不同的配置模板,可以根据实际项目情况,在选定的模板样式上,选择需要上线的功能,快速进行配置,同时支持次功能区图标支持自定义颜色,只需要输入色值,可自定义不同分类不同颜色、整个功能区相同颜色结果模块采用列表样式设计,避免的了旧版本表单样式下检查项目名称过长需要换行的情况;每一条检查结果更加清晰,异常结果更易辨识,同时支持了查看历次检查结果比对功能。

部分页面展示

报告查询

重新设计报告查询功能,采用卡片化的设计风格,重新归纳信息,标题、基本信息、检查结果模块更加清晰有序。

检查结果模块采用列表样式设计,避免的了旧版本表单样式下检查项目名称过长需要换行的情况;每一条检查结果更加清晰,异常结果更易辨识,同时支持了查看历次检查结果比对功能。

个人中心

新版个人中心,功能层级更加清晰。可视化的就诊卡设计,还原实体卡的本来面貌,在外部就可直接扫码使用,一触即达。通过对功能区的重新划分,将原来混排的功能,区分主次,常用功能更易选找,极大的降低患者的寻找难度

个人中心

新版个人中心,功能层级更加清晰。可视化的就诊卡设计,还原实体卡的本来面貌,在外部就可直接扫码使用,一触即达。通过对功能区的重新划分,将原来混排的功能,区分主次,常用功能更易选找,极大的降低患者的寻找难度

医生主页优化

优化头像、个人信息、简介信息的字体样式与比例,提升质感&一体性;擅长信息摒弃之前的标签样式,解决实施中维护医生资料复杂,需要提炼、考虑标签长度等问题,方便维护的同时也可以更完整的展示医生擅长信息。引入品牌标志。

不同功能服务的切换样式重设计,更美观、辨识度更高;排班表日历加粗日期显示、加大选中样式范围,提升操作体验。

问诊间优化

优化操作栏与导航栏设计,突出操作,优化了问诊间的对话间距,层次更加清晰,同时去除己方头像,扩大信息显示面积,一屏可以展示更多的对话信息。

功能图标颜色由黑色修改为海鹚绿色,旧版的黑白色闲的过于肃穆,不适合医疗场景,绿色更加富有活力与生命力。

问诊间优化

优化操作栏与导航栏设计,突出操作,优化了问诊间的对话间距,层次更加清晰,同时去除己方头像,扩大信息显示面积,一屏可以展示更多的对话信息。

功能图标颜色由黑色修改为海鹚绿色,旧版的黑白色闲的过于肃穆,不适合医疗场景,绿色更加富有活力与生命力。

融合版标版-妇幼、中医风格设计

设计妇幼、中医风格标准版,已完成首页多样式、个人中心、医院主页、医生主页、挂号缴费查询全流程设计。妇幼风格采用粉色为主色调,图标更加圆润,营造温馨、贴心的使用体验;中医风格采用传统棕色系设计,添加中国风边框,营造中医传统底蕴。

Create a free website with Framer, the website builder loved by startups, designers and agencies.