小程序开发技术知识分享
百分百努力只为您十分满意 | 咨询热线:17744477016(微信同号)
灵活高效:提供全局观的入口式设计方案,不轻易陷入细节流程。设计模式具备可扩展、完善包容的机制。
简单务实:摒弃不必要的设计元素,追求利落适用的特质。通盘考虑各端优势,移动端可作为复杂事项申办引流入口,不可处理过于复杂的事项流程。
进一步推导出基础设计语言:
轻快:信息聚焦、扁平视觉、自然的视觉流、提高视觉信噪比;
亲和:简洁缓和、完整统一、操作可靠,体验上连续舒适;
直率:结构简单、信息富有韵律感,减少视觉分割和过于热闹的装饰。
3.5 信息架构构建
(1)For 用户 – 以“办事为中心”组织整体信息
按相关部门主持的服务来组织功能是当前常见的处理方式,但这种组织方式从用户调研的反馈来看,用户并不能把事情和各个主管部门一一对应,且许多事情需要多个部门配合处理。所以常见的“部门”组织方式,不是直接解决用户问题的方式。因此摈弃以主管部门为维度的归类方式,换成改同类事情的集合。
(2)For 服务 – 基于地市组织服务信息
按行政属地划分是当前各类政务服务能力的基本组织形式,这种形式和基于地理的模型有许多共通之处,像订餐、差旅等行业都是以属地来组织信息的常见例子,这种模型和我们的情况最吻合。从服务侧来看,这样可以根据地理位置直接匹配相应的服务提供方。从用户侧来看,也可以更准确的提交服务诉求。
(3)For 合作 – 划分三级页面体系
总体上,我们把小程序的架构处理成小程序主体+各个功能模块二级首页+具体办事流程页的三级体系。
小程序首页与各种全局功能(如登录、消息、进度、搜索等),涉及的内容直接反应小程序的初始体验感受。我们将这部分内容定义为“全部模型设计”的范畴,由数广设计团队主刀。 二级首页即各个业务的服务大厅,影响用户对业务的感知。我们将这部分内容定义为“业务模型设计”,同样由数广设计团队主刀,可以保证多业务的体验一致性。
而业务流程,我们则交给对业务熟悉程度更高的开发商。数广定制“流程模型”规范,让不同开放商能按照统一标准,在2个月内把152个事项接入到粤省事中。
4. 设计实施4.1 主程序设计
(1)以用户为中心,以证件为切入点
在过往的线上服务系统中,服务提供方倾向一次性展示更多的功能,希望众多功能总有一个是用户需要的。但这并不是以帮助用户办成事为第一目标的设计思维。
在前文中提到以事情为中心的信息组织方式,是为了让信息架构成更扁平直观,从而更易于用户理解。于是我们尝试了第一种整体的布局方案,小程序整体分为“服务”“证件”“我”三个大的tab。但从用研测试反馈来看,相对具体的服务事项,证件才是用户对业务的第一认知方式。
同时,粤省事的小程序属性,导致再次嵌套底部导航的体验不够轻便。于是在仅剩1个月就要上线的前夕,我们推翻了第一种方案。把证件放到了首页的C位,强化了证件的展示,通过最易理解的信息元素引导用户探索其他常用的功能。证件本体的设计上,我们更多采用了轻质感拟物化设计。从实体证件中提取具有识别性的颜色和特征图形,进行视觉优化。同时,在 “视觉的颜色” 和 “跟真实颜色走” 两个点间,我们选择了跟真实颜色走。通过这些简单而必要的视觉隐喻,减少用户记忆压力,从直观层面上理解业务,更快作出反应和决定。
(2)入口信息处理
作为承载各类服务的平台,我们初次面对的是需要容纳142个细项的业务,后续还会不断的增加更多事项。如果不加以规范,很容易出现入口堆砌的窘境。既要保证服务内容的完整展示,又要保证用户能便捷地找到相关的内容,我们对首页的入口展现形式做了特定处理。
保持友好:在视觉表现上通过对留白和字号的控制,让用户尽可能舒适地浏览多入口信息。在类别标题上尽可能选用简单的名词来命名,不需要再次转译信息。