首页

B端列表组件交互研究

ui设计分享达人

1 列表

客服系统常规使用的列表由顶部操作栏、表头、表体、底部操作栏构成。表格是为可读性而生,所以表格的易读、易对比、易操作才是表格设计的首要目标。

1.1应用场景

(1)展示大量结构化的数据。

(2)需要对数据进行排列、搜索、分页、操作等复杂行为。

1.2设计原则

(1)易读性

1)表头。保证表头字段名称精简易懂,既能节省列表空间,又能减轻视觉压力。表头的固定功能也能够很好体现系统界面的友好性,尤其当表头字段过多,数据类型不好识别的情况,固定表头能够大大提升用户的数据浏览效率。

2)行高。较小的行高可以承载更多的信息,但会降低视觉扫描效果,适宜的行高更利于阅读。目前客服系统常用规格为36px行高,但有些数据量大空间小的专区,需要展示尽可能多的数据时,会考虑会采用24px或30px等小行高,需要基于场景的需求进行选择。

3)行排序。可根据字段以及列表内容的必要性配备排序、筛选、搜索等功能,方便用户快速筛选信息或进行信息对比查看。

4)斑马线。斑马线能够增强用户视觉的横向引导,尤其阅读较宽表格且数量还多的列表,可以避免表格内容过多时,出现错行的现象。

5)分割线。横向分割线能够减轻列表竖直方向的视觉重量,只要采用合适的对齐方式,纵向分割线的作用就可有可无。当表头字段内容少,且易于区分时,可以考虑取掉单元格的纵向分割线,弱化表格形式,便于横向信息阅读、信息获取和信息间对比的同时,又能够简化页面。当数据量太多或单元表格较宽时,保留纵向分割线帮助提升浏览速度。

6)列宽。尽量减少展示的列的数量,关注用户需要的必要信息,当表头字段过多时采用横向滚动条的形式,保证列与列之间足够的呼吸感。

7)自定义列。不同用户信息侧重可能会有所不同,可通过自定义列的下拉面板对列表内容自定义展示。

8)列对齐。标题和内容一般采用左对齐,更符合用户的阅读顺序。金额数值排列采用右对齐,既方便用户读取数据,又方便进行纵向数据对比。

9)空白格。对于无数据项用-占位,不留白。

10)分页。客服系统列表数据庞大,通常采用分页来缓解加载压力,相对用户而言,通常滚屏会比分页更便利,所以,若无展示数据量要求且一屏能展示完时,会尽量避免使用分页。

当使用分页时,考虑到用户的操作习惯,可让用户自定义每页展示数量。

11)特殊标识。对于用户关注的数据状态变化,可以采用一些符号标识,便于用户快速定位信息的同时,也能更加直观的呈现数据变化。如下图,通过不同颜色和方向的箭头来反映数据变化。

undefined

12)全屏。全屏展示能够避免和表格无关内容的干扰,提供沉浸式阅读体验,可根据场景需要配置全屏阅读功能。

13)操作项。对于用户需要进行业务办理或高频点击的操作栏可以固定在列表的两侧,更方便用户对数据进行操作。当操作项太多或操作项不常用时,可通过收起较低频操作项,来节省页面空间,保证用户阅读高效性。

undefined

(2)易搜索

1)条件查询。一般位于表单查询页面上方查询条件模块,当查询区域内容过多时,可展示第一行的筛选项,其余收起。

undefined

2)表头筛选。在表头单元格右侧增加筛选图标,点击后出现筛选覆盖层,根据不同筛选类别,配置相对应的表单组件,可快速查找数据。

3)标签筛选。将用户常用筛选条件或关注目标设置为默认选项,如时间、状态、范围,一般位于顶部操作栏或表头区域。

(3)易操作

1)单条操作。单条数据操作一般固定在列表左侧或右侧。

2)批量操作。当对批量数据进行相同操作时,沿着用户的操作路径,建议将此类操作按钮放至底部操作栏。

undefined

3)全局操作。当进行一些“导入、新增、导出、其他页面跳转入口”等列表的全局操作,或进行模糊搜索、条件筛选等操作时,建议将操作按钮放至顶部操作栏。

undefined

4)详情。可在操作里加“详情”按钮,也可将名称项做成可点击样式,跳转详情。

5)树形结构展示。无须用户进行页面跳转,展开父级节点即可查看子级列表内容,一般控制在三层以内。

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码ben_lanlan,报下信息,会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

文章来源:站酷 作者:史晴sunny
分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


在网页设计中,首屏页面该如何设计才能吸引用户继续浏览

周周

首屏页面是用户首次浏览网站时所接触的「第一视觉」,也就是说它是整个网站设计中的门面工程。因此,首屏页面的设计是网站设计的成功关键,它将关系到网页设计吸引用户停留并做出预期动作,或迫使他们直接离开网站。

掌握UX设计的7大原则 让网站用户体验更加完善

周周

对用户而言,要判断网站的用户体验是否足够优秀是很容易的事情,因为主观感受是很难被欺骗的。但作为网站设计师而言,需要花费大量的时间和精力去面对和体验各种复杂问题,才能完善整个网站用户体验的闭环。

信息获取与适老化系统体验升级

资深UI设计者


前言:

鉴于老年人一次次在“数字围城”中遭遇的困境,2020年11月,国务院办公厅印发《关于切实解决老年人运用智能技术困难实施方案》的通知,2021年1月起,工信部将在全国范围内开展为期一年的“互联网应用适老化及无障碍改造专项行动”,要求各地区、各部门建立工作台账,明确时间表和路线图,推进互联网网站和移动互联网应用(APP)适老化及无障碍改造。



此政策一出,引发了资管行业针对金融产品适老化改造的积极探索与思考,同时各金融机构研究团队也相应推出互联网金融产品适老化改造的改进方向和原则,信息无障碍理念是近年国家推进可持续发展的一项重要工作。在此也引发了我针对互联网金融产品适老化改造的深入探索。

本篇调研报告由以下五大部分构成:


- 行业分析—探讨适老化改造趋势背景

- 用户分析—研究用户对象习惯特征及需求痛点

- 改造方向—总结改造方向和部分具体措施

- 信息获取—以证券交易为例的信息列表优化

- 完成效果—分析目前各家产品适老化改造成果




一、适老化改造趋势背景


截至2019年年末,我国65周岁及以上人口1.76亿人,占总人口12.6%;至2024年,65岁及以上人口将突破2亿;若以60岁作为老年标准,至2050年,老年人口将达5亿。中高收入老年家庭数持续增加,金融服务需求将显著增长,2017年家庭月收入逾4000元的老人已超过1.06亿人,其中1600万老人的家庭月收入逾10000元。和许多无房无车年轻人相比,绝大多数老年人拥有一套或多套住房。



新生事物的发展也潜移默化的影响着老年人的消费思维方式。在如今互联网不断发展的今天,老年人的触网热情也不断提高。根据CNNIC发布的《中国互联网发展状况统计报告》,截至2019年6月,我国50-59岁网民群体占比达到6.7%,较2016年12月的5.4%提升了1.3个百分点;60岁及以上网民群体占比6.9%,较2016年12月的4.0%上升了2.9个百分点



二、老年人使用互联网产品存在的问题


从根本上分析,为什么老年人“不会用”,最根本的原因就是身体机能的衰弱。这是我们无法抗拒和改变的自然生理现象。



「适老化及无障碍改造」其实包括2个方面。

一方面是「适老化」,对老年人的关怀。另一方面是「无障碍改造」,针对残障人士,比如视力障碍、听力障碍、肢体障碍人士的关怀。

这两方面的改造,也统称为「信息无障碍改造」,需要过信息化手段弥补身体机能、所处环境等存在的差异,使任何人(无论是健全人还是残疾人,无论是年轻人还是老年人)都能平等、方便、安全地获取、交互、使用信息。

整体来看,当前我国公共服务类网站及移动互联网应用(APP)无障碍化普及率较低,适老化水平有待提升。比如:

- 多数存在界面交互复杂、操作不友好等问题,使得老年人不敢用、不会用、不能用

- 普遍存在图片缺乏文本描述、验证码操作困难、相关功能与设备不兼容等问题,使得残疾人等群体在使用互联网过程中遇到多种障碍。

- 当前互联网应用中强制广告较多,容易误导老年人,特别是有些付款类操作的诱导式按键

目前国内「老年人」相比「残障人」的用户群体大很大,并且「适老化」和「无障碍改造」属于两个完全不同的改造方向,加上「适老化」改造难度低,普适性更强。所以目前国内的互联网产品,主要从「适老化」入手进行改造,「无障碍改造」开展的工作还非常有限。



三、3个方面着手,针对性提出建议


产品如何进行「适老化」改造?

首先我们可以看看,老年用户的几个特点:

1、视觉、听觉能力变差

2、记忆力、注意力下降

3、身体机能下降,对互联网认知不足



同时,工信部工信部「行动方案」中,对「适老化和无障碍改造」提出了几个基本要求:

1、大字体、大图标、高对比度文字。 2、操作简单、界面简洁,实现一键操作、文本输入提示等多种无障碍功能

3、提升方言识别能力,方便不会普通话的老人使用智能设备   4、 去广告,禁止诱导

从老年人的特点、工信部要求、以及当前互联网产品适老化实践中,我总结了3大产品「适老化」设计要点。



3.1视觉、听觉退化导致信息获取障碍

实验心理学家赤瑞特拉一项关于人类获取信息的来源显示,人类获取信息的83%来自视觉,11%来自听觉,3.5%来自嗅觉,1.5%来自触觉,1%来自味觉。


1. 字体选择

那么在获取信息的来源时文字,是产品界面中最重要的一个元素,当产品中的文本字号很小、文字辨认不清的时候,用户想阅读的意愿就会降低。产品的信息传达的目标就无法完成。所以在标准的文本传递信息的时候推荐使用非衬线体


衬线指的是字母结构笔画之外的装饰性笔画。有衬线的字体叫衬线字体(serif)中文比较常见的如宋体、明体、白体;没有衬线的字体,则叫做无衬线体(sans-serif)。简单的理解就是非衬线体(例如黑体等)就是没有装饰性笔画的末尾,无衬线体则更统一、时尚、简约,中文常见的如黑体、微软雅黑。这种无衬线体也被广泛应用网页端或手机端的产品,所以非衬线字体有醒目而且轮廓清晰的特点,是提升屏幕可读性的首选。


*需要注意的是,在常规页面的设计过程中避免使用多种字体或者精心设计的造型字体,因为这可能会造成用户混淆。营销页面不在此列



2、字号大小

根据Ant Design设计语言中讲到关于计算最小字体的方法,通过肉眼到物体之间的距离、物体的高度以及人的最小可接受视角,构成的三角函数关系进行计算。

普通用户的最小视角为0.3度时阅读效率最好,一般眼睛距离电脑屏幕为50cm。有学者研究表明,老年人由于视觉能力下降,最小可接受视角为0.75度,视距为43cm,换算之后相当于字高为5.62mm,经过换算为16px。

在JIS规格对于印刷品等反射原稿中《不同年纪最小可阅读文字大小》的建议中,60岁以上的老年人,最小可接受的字体大小的绝对高度是4.9mm,经过换算为14px。


考虑针对老年人的应用使用的文字越大越好,建议最小使用16px字号。为什么文本字号要设计为16像素呢?有研究表明在我们屏幕上 16 像素的文本大小与印刷在书籍或杂志上的文本大小相同,这很符合人的阅读习惯。但是人阅读还有一个因素是不能忽视的,就是人和屏幕之间的距离。


换算网站:https://www.gaitubao.com/tools/pixel2cm.html



3、颜色选择

建议使用相对融合的中性色;使用对比强烈的互补色来突出重要元素信息内容和功能位置。同时要符合WCAG 2.0(Web Content Accessibility Guideline,Web 内容无障碍指南)中对颜色对比度的指导意见:


- 对比度(AA级):文本的视觉呈现以及文本图像至少7:1的对比度;大号文本(字重为Bold时大于18px,字重为Regular时大于24px)以及大文本图像至少有4.5:1的对比度。


- 对比度(AAA级):文本的视觉呈现以及文本图像至少要有4.5:1的对比度;大号文本(字重为Bold时大于18px,字重为Regular时大于24px)以及大文本图像至少有3:1的对比度。


可以通过WebAIM`s Color Contrast Checker、Contrast-ratio、EightShap es Contrast Grid、等网站点击进行测试对比查看是否满足 WCAG 2.0 AA 的「色彩无障碍设计」标准。


避免使用蓝色和紫色

由于老年人的晶状体变黄、变浑浊,会选择性的吸收蓝光,从而导致老年人对蓝色的鉴别能力比红、绿色的鉴别能力下降的更明显,因此页面中的重要元素要避免使用蓝色或不同深浅的紫色。




4、听力和身体机能的退化

听觉也是我们获取信息的重要来源,可以考虑使用语音通道获取信息。但随着年龄的增长,人的大脑听觉中枢开始退化,脑皮质逐渐萎缩,耳蜗的基底膜、听觉细胞及听神经也开始老化,导致老年人出现听力下降甚至“老年性耳聋”,主要表现:

1、听到声音,但听不清内容; 

2、正常语速的音/视频无法全部接收;

3、低频段声音听不到(如鼓声),高频段声音受不了(如尖细的刮擦声),立体声成为噪音;


因此在进行语音通道设计时,需要考虑:

1、加大音量,老年人听觉平均感知音量在67.5~75.3分贝之间,因此在视频开始播放时,我们对低于设定值的音量适当增加到约44%。同时处理掉环境声音,使内容声音更清晰。


2、为了保证老年人有效的接收到声音信息并进行理解,音/视频的播放速度也需要适当下降。因此,我们减少了高档位语速,并提供了高、中、低3档语速,使老年人选择适合自己的速度,更有效的获取声音信息。同时加入字幕等实时信息,实时播放双层保障老年人的信息获取


3、使用语音交互形式,帮助老年人更方便的进行信息输入及获取,如百度大字版的语音搜索功能及“今日要闻”点击播放功能、酷狗音乐大字版听歌识曲功能、支付宝关怀版客服语音功能等。



3.2记忆力、注意力下降


1、简化交互操作

人在手机上的交互手势会有很多种,根据不同的业务场景,我们使用的交互手势也不相同。

大致分为四类:单击(tap);长按(long press);双击(Double Tap);长按&拖拽(long press & Drag)。

这么多交互手势,甚至还有组合手势。老年人在使用过程中会显的很烦索。所以操作手势尽量简单、符合人的常规, 以“点击、滑动” 为主。或者是一种切换支持2种手势切换页面。

老年人除了生理上的手指偏大,身体机能退化引起控制能力下降、行动迟缓,动脉硬化、震颤麻痹、帕金森等疾病导致手部抖动,使得老年人无法进行精确、复杂的操作手势;因此针对老年人应用的操作手势应该注意:


- 简化操作手势:单指操作的手势比双指和多指手势更易用(比如电脑触控板的多指手势);

- 尽量使用单击:单击屏幕比双击、多击更易用。老年人手指不灵活无法在指定时间内完成连续点击屏幕两次。

- 大的点击热区:在移动端,按钮尺寸根据手指触摸屏幕的最小点触区域,平均长度在10-14mm之间,指尖的长度为8-10mm,所以10mm x 10mm就是一个最小触摸目标尺寸。按钮高度35px-50px之间,字号13pt-17pt,圆角4-8·web端:按钮高度24px-48px,字号12-18,圆角6-10。



2、精减功能、减少信息干扰

内容可以多,内容要做好清晰分类,清晰易懂。信息导航不要多个维度嵌套,不要让长辈晕头转向。信息层级不宜过深,2-3层为宜,不要让长辈迷路。

要考虑哪些功能该提供,哪些不该提供?是否要针对老人提供一些专属的功能或服务?

如果可以,结合自己的业务,提供老年群体的针对性内容和服务。比如:如果你是做资讯的,内容推荐符合老年人口味,视频、音频形式,就很重要。如果你是做医疗健康的,老年人慢病管理,用药提醒,就比较贴心。


如高德地图长辈版:减少了很多不必要的功能,附近、消息、我的、打车等等。只保留首页而且把长辈会关心的公共厕所、医院、银行、公园等目的地列出。方便快速出行。做好了一个地图工具箱的职责。不去做干扰的信息。美团长辈版也是只保留核心的点餐功能。把更多的页面空间都留给了餐厅的信息展示。方便长辈点餐。



3、流程明确化、减少每屏信息密度

能懂会用,可以有效减少老年人在使用线上产品时焦虑感和挫败感。让老年人知道看到的是什么,正在做什么,接下来要这么做,可以达成什么目标,这是在使用线上产品进行一切操作的基础条件。

如做一件事情共需要几步,当前是百分之多少,还需要多少才能完成,在过程中少一些选择,多一些指引,将容易混淆的内容进行提示,告诉你应该如何操作,减少判断和操作失误。在长任务中,给出明确的反馈和最终目标的提醒



3.3认知能力、身体机能退化


1、理解能力

更易辨识的图标、提供图标名称。由于在互联网时代、年轻人接受的信息非常多,日新月异比如我们现在流行的矢量化图标、线条极简风格的图标,对于老年人来说,存在认知障碍。他们可能并不理解这些图标代表着什么意思。学习需要过程,因此,在老年人未熟悉我们的常用图标前,可适当调整图标的设计方向,更加“拟物化”,符合他们的认知。消除认知水平带来的差距



2、提示反馈

例如在一些需要精确移动的操作,而这个功能又必不可少的情况下。应该怎么解决。可以通过线性的视觉提示,加上每一个颗粒度的移动都给到振动反馈,加强长辈用户的感知。而不是所有的提示都通过界面单一展示。也是可以在资讯版块加入语音播放的功能,通过声音来告知信息。



四.信息获取优化—以证券交易为例的信息展示优化



1、信息展示的重要性

新闻资讯和行情列表展示的字段很大程度上决定着用户对行情的了解。是否做出交易的行为。行情列表阅读的现状:在一些产品中,基于阅读模块的相关设计在关注度和方法论上都有所欠缺。线上的行情列表阅读版式(参考同花顺、东方财富)处理较陈旧,视觉体验较差,用户在使用过程中障碍较多。归根究底,由于整体的设计思路缺失,表面的调整一直是修修补补状态,没有根本解决阅读体验的问题。


因此在信息展示上,需要加强逻辑与秩序,在易认性和可读性上优化信息传达和记忆质量,最终给用户打造0干扰的阅读体验。

这里解释下几个概念:

易认性:(Legibility)针对文字,能准确无误的让读者阅读,不因为过于接近带来困惑。

可读性:(Readability)针对版式,阅读的容易程度,文字的组合呈现。

0干扰:能将自己的设计不动声色的隐藏起来,不以设计本身分散人的注意力,达到阅读的沉浸状态。



2、目前证券交易产品列表存在的问题,总结与分析

基于此现状,分析了几个头部证券交易产品的页面,梳理目前存在的一些问题,每个列表的盒子宽度不一致,有的宽有的窄,导致在整体阅读时跨越度比较大。盒子的宽度不同对字段数据范围理解不清晰,导致同一页面数据字体大小不统一。展示的信息过多,密度高、信息过载出现视觉疲劳。又或者间隔太大显示的太松散



通过各个维度的对比,总结出这个表格

一、字体分析

1、字体iOS端文字基本以苹方为主,数字字体以din为多数(部分调整)2、字号整体以32-34居多。4个平台文字与数字字号相同常规状态下)

3、字重以中文常规体,数字中黑体为主

二、盒子分析

1、固定盒子间距,盒子宽度根据字段调整

2、固定盒子宽度,间距。字体大小(牛牛)

3、盒子间距不固定,超过盒子部分缩小字体

三、适老/大号字体调节

1、牛牛/腾讯自选股/同花顺:字体大小5档,可以全局调整,也可以分区调整,牛牛:行情、交易、资讯、聊天室、其他(同花顺有长辈模式)

2、东方财富/新浪财经:支持全局字号的修改,但是支持的档位有所不同有2档3档5档

3、老虎:不支持调整/雪球:只支持调整资讯部分字体



3、确认展现形式,并验证可行性

经过总结各家产品的体验分析,开始了设计方案的尝试。首先考虑了字段数据高频出现的范围、考虑极限值情况,确定字体大小在32-38之间比较合适。第一屏内仅展示最新价、和涨跌幅即可。同时把对比表中出现的高频率行高、字号。统一进行对比,产生问卷调研进行盲试,选择觉得最舒服的列表方式。最终34号字体/104列表高度被最多的人选择。


在确定字号大小和列表高度之后,开始设计验证,把要展示的字段和常规、极限状态的数据放入盒子模型内。确保在不改变字号大小和盒子间隔的的情况下都能完整展示。最后在适配泛金融交易的,A股、港/美股、期货、外汇等列表信息。在标题、或者数据达到8个-9个的情况下依然能完整展示。



最后在进行字号大小的调整,适合长辈用户使用。在保障展示完整的情况下,同时调整字号和列表高度,字号以2个字号为一档支持5档调节,最大支持44号120行高。同时在涨跌幅处用色块做视觉吸引,增强涨跌感知。详情页内也是全局调整,不能像某些产品一样只是单纯的形式上的做“适老化”


开发实现与落地,在和开发同事了解相关背景后,相当于是皮肤系统对应不同字号拥有不同的UI展示。由于不是时实展示,实现难道不大。全局调整字体,可以实现。但是具体效果不好确定。主要是自适应布局方式产生的问题。面临部分页面需要重新编写。由于目前使用的是frame布局方式需要调整成和Auto Layout(自动)布局才能比较好的适应效果。



4、文章资讯展示优化与落地

屏幕阅读与纸质阅读不同

人的阅读习惯会根据阅读环境而改变,包括文本的书写格式、文本的媒介、语言符号等。基于屏幕的阅读行为,往往表现了如下特征:很少人会一字一句阅读页面,更多的是在浏览、关键词确认、非线性阅读、有选择性的阅读。因此文章的间距非常影响阅读体验。文字的间距包括两部分,第一是横向字与字的间距;其次是纵向行与行的间距。



1. 页面版式留白探索(行间距,段落间距等)

行间距是决定版面中的栏宽是否具有阅读性的重要因素。许多平面大师都非常注重行距,段落间距的设置。过窄与过宽的行距会有意识或无意识的让读者困惑,造成某种心理障碍。


行距过大会打破文本连续性,每一行会被孤立,缺乏紧凑感,会降慢阅读速度。行距太小会让页面灰度过重,读者眼睛承受过多的负担,无法集中阅读单独一行,时间久了会增加疲劳感。



根据当前现状,再结合行业设计经验,我们选择了字号与行高倍数组合的一系列方案,进行了眼动实验和用户访谈,确定用户可接受的行间距为1.50-1.70的范围,再通过对比不同机型下的屏幕显示效果,以及不同档位字体显示效果、阅读效率,最后确定了图文落地页正文文字,扩大行间距1.65倍行号的设计方案。



2. 对齐方式研究

研究完行间距显示,段落里文字对齐的研究也很重要。

文字对齐方式有:左对齐,右对齐,左右对齐,居中对齐这几种,大段落文字阅读右对齐或者居中对齐几乎没有,所以这里我们对比左对齐和左右对齐的优劣。来看下优劣对比:

左右对齐的优势较多,主要体现在视觉感受舒服(规规整整的版式),更主要是眼睛在固定位置换行,在易读性上做得比较好。

缺点也是有的,文章存在2种字间距,而左对齐优势在于只有一个固定字间距。好在新闻阅读文章长度并没有特别长,篇幅受限,影响也就不会扩大,且2个间距尺寸也是在可接受范围里。


综上对比,我们认为左右对齐的版式在新闻类阅读里,是明显优于左对齐版式。



3.引入概念—「垂直韵律」

「垂直韵律」是阅读节奏感的重中之重,打造一切视觉阅读节奏。行距,是垂直韵律的基础属性(同版式中的网格概念接近)。

版式规范中,中文汉字1.5~2倍的行距是最为适合的。整体来说,字号越小,行间距应该相对越大,反之亦然。

确定1.65倍行距最符合各项指标行距确定完后,基础间距就有了数值a,之后页面相关的元素纵向之间间距都依赖这个数值(a的n倍)。



倍数间距的引用,整体页面来看,所有的留白都有规律可循,形成自己的韵律感。

这么做的好处就是用户对规律间隔的理解度更高,有节奏的留白除了满足了它本身需要的功能属性,用户阅读过程中不容易受到来自间隔过多的干扰,这样易读性就提升了。同时由于字号大小的不同,行间距相应的调整。展现的效果也不一样

来看下我们看看不同字号版式页面样子,自带韵律感~



4.字体、字重选择

我们除了需要选择无衬线字体,更应该选择字重更全的字体我们发现目前在一些安卓手机上,一些字体在增加字重后出现沾粘情况,不能保证可读性。

字重,即字形的重量,字重的等级用来标明同一字体家族不同粗细笔画的字形。

但通常一个特定的字体家族仅会包含少数的可用重量。若一个指定的字重不存在时,CSS会就近匹配其他字重:较重的字重映射到更重的重量、较轻的字重会映射到更轻的重量。

目前落地页代码中字体的设置,安卓使用的第一顺位的字体字重仅2档字重,所以在小字场景和分辨率较低的安卓机型上,会匹配到更粗的字重,出现文字沾粘的情况。




这里插入一件趣事,当时我走查安卓UI页面时,发现粗体字体比设计稿上粗很多,又对比了一下ios的粗细,就让他们改细一点。

他们表示:“没问题”啪一下,我一看发现加粗完全没有了,变成常规体了。就说“在加粗一点啊”。

开发小哥看了我一眼“行”啪一下,又回到那么粗壮的状态。

就问“为什么加粗会这么粗,iOS没有这么粗啊,不要这么粗,要细一点的那种粗!”

他白了我一眼说:因为是系统字体不一样的原因,iOS 用的是Helvetica,安卓字体是Roboto,其字体本身就设计加粗效果就是这么粗。没有办法了!

我:……暂时受挫,退去了!回去之后我越看越不行,就选择查找解决方案,最终在csdn论坛找到了方法。并且发现了相同遭遇的设计师与开发小哥。果然这个粗细问题都让设计师无法接受!




最终通过找到的方案化解了这个问题,不过我们还是调整了font-family中的字体适配顺位,在安卓端优先适配字重更全的字体,保证安卓端加粗字体的展现,优化内容可读性。



五、各家产品适老化改造成果

如今已经到2022年的年初,各家app适老化做的怎么样。是应付要求,还是真的为老年人打造适合他们用的产品呢?接下来我那几个正反面案例给大家分析一下。谁才在真正用心做产品


反面教材 :

支付宝

辨识度:支付宝仅在辨识度上还比较可观,字体、图标的色彩对比度都可以较好的辨识。但是在易懂方面,支付宝做的比较差劲,整体的交互依旧沿用普通版的,没有对于理解性做调整,对于老人来说操作比较复杂,难以学会。而且支付宝的老年版并没有很用心的去精简功能,比如这个个人中心页面,对于老人来说,支付宝会员、余利宝、蚂蚁宝、相互宝这些几乎没有用处,存在于页面中只会让老人误触,支付类软件对于老人来说核心功能就是支付、收款、查余额、查账单,类似于工具类的产品。在首页部分还是保留了蚂蚁森林的部分,一方面是基于公益的性至,另外一方面还是需要用户的活跃度、留存率。理财页面功能布局上是保留了稳健的、较安全的债券产品,以及保险产品。相对来是比较合理,但是进入到下一级页面后,又回归了正常模式。


而支付宝的口碑页在老年版中应该直接拿掉,口碑里的每个业务单拿出来,体量都不亚于一个大型APP,而且每个业务的内页都并没有去适配老年化,点进去依然是普通版的,这样的页面存在于老年版的业务中,只会分散老人的注意力,加大老人的误触率与学习成本。在新版本中加入的生活模块,更是连字体大小都没有改变,完全没有适配。如果是没有时间加入适配,不如在老年版不上这个功能反而更加干爽。


虽然适老化涉及的页面可能很多,资源成本很大回报率低,但是作为国内首屈一指的金融产品,立足于全球化的目标。格局也可以大一点,并且未来随着中国老龄化人口越来越多,老年人掌握的财富会越来越多。针于他们做优化也不一定是“亏本买卖”




同花顺

作为头部的证券交易产品,适老化做的可以用灾难来形容了。本来主要的用户人群就是中老年较多,界面风格也偏沉稳,结果在适配上做的像是在应付交作业。首页上半部分是加大了的图标,选项栏也是加大字号。但是下面资讯的部分似乎和上半部分图标分割了一样毫无关系,依然是正常大小,详情页中也是如此。行情列表页中一级页面是老年版的放大效果,点击查看更多时,列表又回到正常状态。列表页的适配难度是最小的,并且外面一层已经有了,结果还做的如此糟糕。并且在长辈模式中,字体大小调整也暂停生效了,也无法调节长辈模式效果不好的字号大小。



正面教材今日头条大字版 :

今日头条

是国内最具影响力的综合类资讯平台,内容五花八门,涵盖的分类众多,但是今日头条的老年版(今日头条大字模式)却适配的非常好,进入个人中心,把老人不常用的功能收拢起来,给人感觉就没有过多的冗余元素,把每个模块的字号与间距都做了适当的调整,整体非常易于阅读。首先在图标颜色上,调整成对比度强的颜色,同时今日头条的老年版了解老人喜欢热闹与分享的心理,将头条分享做的更加突出,便于老人方便的把喜欢的资讯转发到“姑舅一家亲”中。1、首先在图标颜色上,调整成对比度强的颜色,增强识别度。

2、图形化图标改成文字按纽,单一的图标,因为认知方面的差异,老年入无法理解。改用文字形式方便老年人理解涵意。

3、在交互方面的调整,比如暂停、全屏的调整外置,更加方便操作。

4、信息布局适应调整,重点需求突出,优化不常用入口。图标与文字相结合强化提示。

5、字体变大的同时,行间距离也做了想应的调整。


综合来说今日头条的老年版的适老化是非常成功的,不论从辨识度,易学,易操作上,都针对老年群体做了专门的优化 ,这样的产品才是更适合老人使用的。而不像某些产品的只是单纯的大、大、大而已。




写在最后

其实通过总结经验 ,结合案例来看,做适老化不只是将一个产品的字体放大了,而是根据老人的生理与心里特性将APP重新设计了一番,做一款更适合老年人使用的产品,让老人更加容易的学习并使用。


互联网产品的适老化之路道阻且长,做适老化可能会影响企业的利益,也可能会增加产品的维护成本,受制于某些原因,推动解决老年人面对智能技术的问题解决也是重中之中。但是设计师也需要运用自己的专业性,来帮助目标人群融入数字化的生活中去。

因为在不久的将来,我们也会变成这个群体,当我们面对这些束手无策时,那时的设计又会是如何适老的呢?适老化设计是适合所有人的设计,所有的设计师都应该密切关注。我们也应该让老人群体更好的体验互联网带来的便捷,享受中国科技腾飞所带来的福利,这也是我门后一代人应尽的责任。


文章来源:站酷   作者:枫枫枫枫锋 

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



万能活动方案策划篇

资深UI设计者

随着互联网行业的快速发展,关于活动方案策划是活动运营很必要掌握的一个技能,本文为大家提供了一个万能活动方案策划的一个技巧,传授给大家,有需要的小伙伴儿快快接招!

思想的高度决定运营的深度,而运营的深度则体现在方案的专业性,方案的专业性则用活动的效果来判定。所以,这篇《2021运营人年度工作总结- -万能活动方案策划篇》要远远比我的上一篇总结《2021运营人年度工作总结- -常用模型篇》更重要,它不只是强调纯粹的学习,而更重要的是学以致用。

很多人认为运营是服务产品和用户的中间纽带,在这里,我再次强调一遍,我并不认可这个观点。

我认为的运营是营销与运作的组合。首先,是通过营销帮助企业赢得市场和客户,让企业获得生存下去的可能;然后,才是运作通过营销获取的客户和市场,实现盈利。

如果说营销是运营中的重中之重,那么方案策划则是营销中的重中之重,而方案的落地形式活动则是保证方案效果的重中之重,这也是为什么我们做梦都想做一款爆款方案策划,执行出一款爆款活动的原因,为什么2022年元旦已经过去了1周,我还在孜孜不倦的整理《2021运营人年度工作总结- -万能活动方案策划篇》。

一、方案策划思维养成

在正式的活动方案策划模板讲解之前,我们先来简单探探方案策划思维的养成。如何通过唾手可得的身边小事培养思维,通过通过分析不同行业的方案策划中心,培养自己的方案策划思维的全局性。

1. 从身边小事养成

针对策划,根据体量大小可以分为:小方案策划与大方案策划。可能有些人会好奇,什么是小活动方案策划,什么又是大活动方案策划?

我们在各大社交平台发表观点、发布朋友圈、参与各种话题活动。有些人的内容非常具有吸引力、反响特别好;而有些人的内容确是平淡无奇。前者正是把这些事件,当成小的活动方案进行策划的,思考更容易燃的点;而后者完全是自嗨,只是注重自我感情的抒发。

而我们常见的线上线下的各种形形色色的活动、各大企业的品牌宣传广告和会议都属于大方案策划。而在互联网中常见的转盘抽奖、集卡活动、种树活动、砍一刀等等活动更是属于大方案策划,并且这种活动越来越常见、越来越繁多,对专业人手的需要越来越高。

2. 向不同的行业大厂学习

由于方案设计包含市场营销和活动设计,而市场营销又是一个特别大类别。所以,在这里我们不做分析,主要分析和运营息息相关的方案策划,特别是用的最多的活动方案策划。互联网公司包含社交类、电商类、内容类等公司。虽然同属于互联网行业,但是,不同的类别往往方案策划的方向、展现程度、关注重点也不同。

比如社交类、娱乐类软件往往更喜欢话题类、低价领会员类、信息推送类、短信通知类。

举例,职场社交软件脉脉会推送#选错专业的你,过的怎么样 #长期摸鱼会怎们样 等话题活动;短视频娱乐软件抖音可以添加各式各样的热门话题,比如#人类萌宠养成记 #厉害了,我的国等等。

电商类软件往往更喜欢满减活动、砍一刀、拼团等优惠类的活动。比如;每一年的618、双11、双12活动。

内容类活动由于考虑到内容的增长和用户的增长,往往喜欢培养作者、培养用户使用习惯的活动。比如:今日头条、知乎针对自媒体作者的培训活动;趣头条针对用户阅读达到一定时间的红包奖励活动。

所以,作为方案策划人员,或者希望从事方案策划的人员,需要全面的向不同类型的大厂学习,提前明确自己所在的行业或者未来期待的行业,基于行业的现实情况进行方案策划。同时,我们也可以尝试着把其它不同行业的优秀策划方案引入到自己所在的行业,带来新的增长。

二、万能活动方案策划模板

一个人焦虑,是因为对自己所做工作的不自信;

一个人害怕,是因为对陌生事物的担惊受怕;

而这一切都是因为缺少一位领路人,或者缺少一个简单明了易理解的知识体系。俗话说:麻雀虽小,五脏俱全。那么,活动方案包含哪些元素,这些元素需要注意哪些事项呢?

模板必需元素1:活动名称

能够占领心智、简单易懂、易传播

模板必需元素2:活动目的

活动目的分为5类,分别是拉新类、活跃类、转化类、留存类、裂变类,主要用于为活动定基调和方向。

模板必需元素3:活动目标

为什么有了活动目的,还要有活动目标呢?这两块是否重复呢?

其实活动目的是为了定活动的方向和活动的基调,活动目标是为了制定数字化、具体化、可量化、可执行、可考核的目标。这些目标一方面让方案策划人员,目标更清晰;同时,也便于公司后期对公司内部人员的考核。

模板必需元素4:活动预算

活动预算分为两类:

一类是方案策划人员根据活动提前预估的预算,这类预算只具参考意义,不可具体对下执行;

另外一类是公司审批通过的预算,这类预算是活动的具体可以开支的预算,活动方案策划人员需要根据最终的预算进行调整,以及寻找奖品合作方洽谈价格和预算,实现预购、预生产或者采购的行为。

模板必需元素5:可行性设计

大部分运营新人对活动无从下手,往往是因为缺乏可行性设计的切入口。可行性设计可以参考电商活动的RSM模型。

R指Role,通过数据分析,筛选符合参与活动的角色用户;

S指Scene,打造符合角色用户的常用场景,通过场景让角色用户尽快进入角色,参与活动;

M指Motivation,用户参与活动的动机。这方面的内容相对较为复杂,主要是对人性的分析。有些活动方案策划人员希望利用七宗罪分析,有些人喜欢利用九型人格分析。如果没有太多想法,可以基于人群对名、利、权、色的基本需求进行分析。

模板必需元素6:活动形式

活动形式多种多样,当然也更多的形式需要活动方案策划人员进行开发。常见的活动类型有排名互动、游戏活动、优惠促销活动、拼团活动。

拉新方向的活动往往使用拼团活动,效果更好一些;比如,我们常见的2人成团或3人成团的拼团活动,在理想状态下往往是依据2ⁿ或3ⁿ等指数函数进行设计的;

活跃方向的活动往往使用游戏活动,效果更好一些;比如转盘活动、红包活动、老虎机活动、蚂蚁森林、开心农场等等;

转化和留存的活动往往使用优惠促销活动,效果更好一些;我们常见的618、双11、双12、会员生日活动都是优惠促销类活动;

裂变方向的活动往往使用排名活动,效果更好一些;这种排名活动可以依据用户的订单数、成交额、邀请新用户数量进行排名,从而实现订单的裂变或者新用户的裂变;

模板必需元素7:活动内容

在互联网的活动中,用户很少可以见到原版的活动内容,我们通常看到的比较多的是活动海报、详情页、落地页、广告链接等等。针对这一块内容,普通人的理解往往也是缺失的。但并不代表没有这方面内容,或者这方面内容不重要。

举例,我们参加的新品发布活动、会销活动,是不是都有工作人员精心准备的PPT。讲师通过对PPT的讲解,让大家对活动的内容更清晰、更明了。如果,作为一种创新型的活动,是十分有必要对种子活动用户,进行明细的活动内容讲解。

模板必需元素8:活动规则

活动规则的设计,需要为活动目标服务,同时规则需要具备引导性、易读性、易懂性、挑战性。如果一场活动的规则,方案策划人都需要思考良久才能明白其中逻辑,可谓是非常失败的典型了。同时,我们也不建议活动不利于用户的规则,通过小字的形式在不明显的位置展现,这不符合用户思维、粉丝思维和诚信品牌思维。

模板必需元素9:活动流程

每一场活动都需要有明确流程、路径、排期等信息,这便于与其它部门进行沟通协作;同时也方便执行人员有着清晰明了的执行方向、节奏、动作。针对流程设计,可以使用免费的ProcessOn在线快速便捷设计。

为了方便活动的实施把控监督与后续复盘,建议活动设计时提前思考活动路径数据埋点动作。这些数据都将成为公司的宝贵资产。

模板必需元素10:风险预案

风险与机会同时存在,在活动策划的同时,需要全面考虑来自政治、法律法规、友商、道德方面的风险。

模板必需元素11:协调资源

一场优秀的活动方案策划,绝对不是一个人能够完成的。

需要产品经理在APP上的活动应用的规划;

需要研发人员在繁忙的开发工作中做好活动程序的开发和测试;

需要设计人员安排好海报设计、规则设计、奖品设计等内容的设计;

需要采购人员对奖品的提前准备和仓储人员对活动管理等等。

模板必需元素12:活动复盘

一场活动无论效果好,还是效果差,都需要进行复盘。为了更好的扬长避短,也是为了后续活动的不断迭代。这种迭代思维对于活动方案策划人员绝对是不可或缺的。复盘包括不限于数据复盘、路径复盘、成本复盘、文案复盘。

最后附上《万能活动方案策划模板》,通过工具化的内容和标准化的SOP让活动策划的效率高上数千倍。

三、最后

作为一名活动方案策划人员或者准活动方案策划人员,需要善于发现自己身边与活动方案策划相关的小事,比如:朋友圈、话题活动等,善于通过这些小事培养自己的活动方案策划思维;合理利用本文中的万能活动方案策划模板,培养系统化的大型活动设计思维;同时,还需积极参与和学习其它互联网大厂的活动,为自己提供更多的思考和参考;另外,积极洞察市场上新的营销知识、运营知识,快速学习并学以致用。


文章来源:人人都是产品经理   作者:互联网运营的那些事

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



B端系统配置功能设计的思考

资深UI设计者

在大型B端产品中,不可避免的出现各种配置,配置如同一个个控制阀,决定着业务的走向,并实现saas产品的千人千面,以满足不同客户的诉求,适应不同行业的业务场景。但在随着产品的发展,配置项也越来越多,逐渐变的不可设计与维护。给什么做的配置?配置是如何生效的?好的配置具有什么特点?如何确定配置的维度?针对这些问题,笔者就以自身的工作经验,来给大家说一下如何进行复杂B端系统的配置功能设计。

一、给什么在做配置?

在开始配置之前,我们要想清楚,我们到底在为什么在做配置。

软件系统是现实世界的抽象,在《THINK IN UML》一书中,表述了现实运行的机制:人驱动系统、事体现过程、物记录结果、规则控制运行。由于我们不可能利用一套固定的规则满足所有客户的业务场景,故我们需要支持规则可调整,调整规则的功能,就是配置功能。

我们习惯用用例(use case)的方法来抽象现实世界的需求,一个完整的用例定义由参与者、前置条件、场景、后置条件构成,其中:

  • 参与者通过系统输入物与系统交互,可以是输入的一段指令,一笔订单,一个商品信息等;
  • 前置条件:发生这个用例的前提条件,即输入物满足什么条件才可以发生这个用例
  • 后置条件:发生这个用例之后的结果,会产生哪些影响

那么当我们翻译成UML的语言时,配置就是定义前置条件和后置条件的系统功能。

那么当我们判断输入物满足什么条件时,还是分两类:

  • 当输入物存在时,即满足条件。如:当OMS系统发出打印指令时,即调用配置中指定的打印机进行打印;
  • 当输入物的属性和预设规则满足时,即满足条件。如:当ERP推送商品价格数据到OMS中,由于商品价格数据这一个输入物的所属类别分类属性,满足预设规则1,则自动加价5%;

当我们分析会产生哪些影响时,我们可以分三类:

  • 边界类:影响操作界面是否可查看可操作,或者接口是否可用。权限控制RBAC设计模型和接口的订阅配置,就是典型的对边界类造成影响的配置设计;
  • 实体类:影响数据库表,文档或其他具有持久化特征的数据的格式、内容;如OMS系统设计中的审单功能中,会根据配置在订单上加上赠品商品行;
  • 控制类:影响控制程序,工作流,算法体是否起作用;如OMS系统中,订单会根据配置来决定是否直接跳转到某个状态,如退单长时间未审核,则自动同意的配置

在复杂的B端系统中,我们往往发现一个业务无法用一个用例就描述清楚,导致配置设计还是无法进行,如这个业务场景:

ERP将商品资料同步到OMS,OMS加工后,同步至各商城。

由于用例体现了参与者的愿望,用例的执行结果应对参与者来说是可观测和有意义的,那么显然,同步商品资料到各商城,对于业务的起点ERP来说,并不是其愿望,也不可观测,但是不存在没有参与者的用例,用例不应该自动启动。由于参与者可以是非人的,换句话说,参与者可以是用户的一个指令,或者是上游系统的通知,故我们往往将用例根据参与者的不同进行拆分。以笔者参与的OMS产品为例,我们根据长期的实践,习惯根据参与者的不同,划分为三种不同的用例。不同种类的用例,配置一般影响的类别也不一样:

  • 输入用例:比如上游订单系统同步订单至OMS、ERP系统同步商品资料至OMS。配置一般影响边界类;
  • 处理用例:比如订单打印、订单拆单合单、订单履约、商品价格加价处理。配置一般影响控制类;
  • 输出用例:比如OMS输出订单发货清单至ERP、OMS系统同步商品价格至上游平台。配置一般影响实体类;

我们可以整理出下图:

二、配置设计要求

上文我们了解了在给什么在做配置,那么一个好的配置应该满足什么条件呢?

第一:配置逻辑自洽

1、根据输入物属性识配自己的规则时,规则之间不能相互冲突;

我们拿商品价格策略配置举例:

当我们识别商品的价格属性去适配规则时,我们应使用MECE分析法,按照完全穷尽,相互独立的原则,将属性的枚举值整理出来,当无法完全穷尽时,应设置默认规则;

2、配置与配置之间不能互相冲突;

我们仍拿商品价格策略配置举例:通过识别商品的价格、所属平台、所属门店等属性去适配规则时,可能会出现同一个商品同时满足多个配置的情况;

这种情况下,我们需要先判断多个配置是否可以叠加:

可以叠加:当对实体类进行配置设计时,一般策略是可以叠加的。在这种情况下,可以增加配置叠加规则,如设置上限\下限:加价策略都是以输入的原价为基准进行加价,累次加价不能超过原价的8%

不可以叠加:需要增加策略冲突时的应用规则

  • 应用最新的配置:适用最后更新的配置;
  • 指定策略优先级:为配置分配优先级,在配置不可叠加时,选择优先级最高的生效;

第二:配置变更有迹可循:重要的业务配置,需要提供配置变更日志查询,记录配置修改人与修改时间

第三:配置影响的前后数据对应:如果配置影响的是实体类的修改,则应在数据库中记录时,需记录数据原值和配置影响后的数据,不应在同一个字段,用配置影响后的数据直接覆盖原数据。实体类的新增则不需要;

第四:高拓展性:系统的能力建设是持续的,配置的设计可以延续标准的工作流程不断拓展新增;

第五:配置规则可理解:需要提供必要的功能指引,配置规则的入口和操作方式需要符合用户的认知;

第六:不同维度的继承关系清晰:在不同维度设计同一个配置时,需要理清楚是否要继承父辈维度的配置,一般要支持可配置是否要继承继承父辈维度的配置,以免造成修改此维度的配置后, 又因为继承了父辈维度的配置,导致修改配置不生效;

三、确定配置管理的维度

我们发现,存在配置需要对输入物的多个属性进行识别以决定应用哪个规则的情况,那么我们配置的维度如何设计呢?

当我们只有一项配置时,我们当然可以如下设计:

但是如果我们每次新增一个配置,就长出一个新页面,很快就会发现:

用户操作成本高,需要从大量的配置中,找到对应的配置进行操作;

配置设计拓展困难,每次新增配置,就要做一个新的页面;

这时,我们可以查看一下系统的领域模型,找到输入物的共同属性,来组织配置功能的架构:

这时我们发现,虽然输入物繁多,业务场景各不相同,但是他们都有一个共同的父类:渠道店铺。如果此时,渠道店铺作为输入物的一个属性,参与配置规则生效的匹配,则可以将渠道店铺这个属性抽离出来,作为配置管理的维度,如:

这样做的好处是,用户可以在一个页面,完成多个配置,而不用不停的切换页面。

我们也可以看到,渠道店铺可以继承渠道、渠道商家、商家、店铺的配置,我们可以根据真实的业务诉求,以尽量减轻用户配置负担为目标,灵活的选择配置的对象。

当某个用户在配置时,一个属性不同的枚举值对应的规则一样,例如期望所有美团渠道的店铺都适用自动打印配置时,我们到最小的配置维度【渠道店铺】去一个一个配置,无疑还是增加了用户的操作成本。这时我们就可以考虑将其父类作为配置的维度,子类继承父类的配置规则。

四、配置的入口怎么设置

确认配置的入口,我们一般这么做:

STEP1: 根据配置操作人确认在哪个系统上做配置;

STEP2: 根据业务用例上的参与者划分不同的配置模块;

STEP3: 根据配置维度,聚合配置功能;

STEP4: 易用性改造

以下为笔者负责的OMS系统中配置功能的统计(数据已脱敏):

关于易用性改造,我们一般做以下事情:

在业务或数据相关页展示配置入口;

利用接近原则,在业务或数据相关页展示配置入口。利用接近原则是一个心理学名词,指对于彼此接近的事物,人们总会下意识地将他们建立某种关联性,并视为一个整体去看待。这么设计可以减轻用户的认知成本。例如:

将业务流程中配置形成SOP;

如一个商家的系统进行初始化时,需要进行履约相关配置、库存价格策略配置、前台作业系统配置等,如果一个一个去找相关的配置,则学习成本较高,容易出现配置遗漏等情况,那么我们一般将业务流程抽象为一个SOP,在SOP中,展示对应配置的入口。例如:

3、支持查询配置

提供全局性的查询功能,支持查询对应的配置。例如:

五、示例:配置设计的流程

这天,运营给我反馈了一个问题,希望可以新增订单自动打印的功能,以支持OMS系统在多个业务节点下,可自动打印小票,而不用店员再去手动点击,而且要可以控制预约单在预约送达时间前1小时打印,由于门店使用的打印机型号不同,还要支持为不同的打印机配置不同的打印模板。

我识别到此需求后,我按照以下工作流程,进行了配置的梳理:

STEP1: 识别参与者,抽象用例:抽象出用例,才能拆分配置功能。强行在一个配置里,将所有业务规则都体现,是不现实的;

STEP2: 确定要配置的内容,确定配置的维度;

STEP3:根据配置的操作人和配置的维度,确认配置的入口;

最终可以整理出这个表格,接下来我们就可以根据这个表格、进一步梳理业务流程图、整理原型、撰写PRD了。

六、结语

配置设计纷繁复杂,今天我以实际的工作经验,给大家介绍了我对B端配置设计的一些思考,希望可以给大家一些思路,并且引导大家思考功能设计背后的逻辑,权当抛砖引玉吧,毕竟抄竞品简单,但是竞品因何发展成这个样子,其中的逻辑判断,与设计权衡,才是我们应该了解的。

文章来源:人人都是产品经理   作者:kathic

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



据分析体系构成框架

资深UI设计者

数据对于产品的发展起着决定性的指导作用,那么公司在运营的过程中具体需要一个什么样的数据来支撑服务呢?本文作者列举了产品经理需要了解的数据分析体系,一起来看看吧。

本文来自于我的新书《高阶产品经理必修课》摘录。

一、为什么需要数据分析体系

在很多不成熟的公司中,虽然也有使用数据去验证产品的思路,但是他们在实际工作中往往是这样取用数据的:

产品部同事找到数据分析师,问他昨天刚上线的版本用户点击率是多少。

运营部同事找到数据分析师,问他前两天上线的拉新活动是否带来了用户量的增加。

领导找到数据分析师,问他这两天的订单量是否有所增长,上月交易额环比增长是多少。

可见,各个岗位都会有自己的数据需求,所以数据分析师只能逐个地进行数据计算。由于人力资源有限,数据分析师往往无法及时反馈所有的数据需求,这将会导致一些运营活动或产品规划错过最佳的时机。例如,在“双11”前夕想要准备“双11”促销活动,却迟迟拿不到过往的运营活动数据。

正是基于这样或那样的原因,很多企业演化出了一类数据产品——数据仪表盘,如图1所示。

▲图1 数据仪表盘

数据仪表盘就是将各个数据需求方常关注的数据汇总在一张报表中,这样大家可以在这里统一看到整个产品的用户数、交易数等的变化,能在一定程度上满足大家对数据的需求。

但是随之而来的新问题如下:

产品部的同事抱怨:虽然看到昨天新上的版本中用户转化率下跌了,但是根本看不出来原因是什么,说不定是运营部的活动导致的。

运营部的同事抱怨:我虽然看到了拉新数,但我有三个用户拉新渠道,到底哪个拉新渠道的拉新能力最强,带来的用户质量最高呢?

面对这样的进阶需求,就需要一套完整的数据分析体系来做支撑,进而来帮助我们掌握数据变化情况并快速定位变化背后的原因。

二、数据分析体系概念的常见误区

一提到数据分析体系,常见的一个认知误区就是将数据分析体系等同于单一的某一个数据分析产品,如活动运营监控平台、用户画像平台等。

其实这里最大的错误就是将一个体系割裂开来,只看到了承载数据的产品而没有重点关注使用者的使用方法,就好像认为数据分析一定要有一把“利刃”,但是却不去关心舞剑者的功力一样。

最早提出这一认知的是钱学森先生,他在系统工程学中提出了软系统概念:

任意一个体系要想发挥正确价值,必须通过产品与使用者这两部分共同协作,这两者合二为一称为软系统。

所以数据分析体系的正确定义应该是:

数据分析体系通常由数据使用者的分析模型和数据分析平台这两部分构成。

这也告诉我们在数据分析学习与搭建数据分析体系的过程中,掌握使用数据的方法,方能以正确的方法去解读数据。但在部分公司的运营过程中,往往忽视了这一点,导致搭建出的完整数据分析平台无人使用。

确切地说,是大家没有以正确的思维或方式去使用,还是以老式的思维使用新的系统,并没有在思维与认知上进行升级,从而无法发挥其应有的价值。这就好比我们给数据使用者一辆汽车,但他们还是在寻找缰绳以期驾驶汽车。

这时数据产品经理就应该化身企业内部的数据分析咨询师,帮助他们看懂数据背后所反应的价值。所以数据产品经理在一家公司中应该有如图2所示的双重身份。

▲图2 数据产品经理的双重身份

三、数据分析体系构成框架

搞清楚了数据分析体系的定义,接下来就是了解如何才能搭建一个完整的数据分析体系。

笔者曾看到部分数据产品经理候选人的简历中经常会写到自己精通数据分析框架的搭建。而当面试中被问到他们的数据分析体系究竟要怎么落地时,他们给出的回答却是针对DAU(Daily Active User,日活跃用户数量)、留存率等进行管理,但是数据分析体系中的平台建设,就仅仅是对这几个指标的管理吗?那么请问,当遇到了以下场景时,这几个指标要怎么解决我们的问题呢?

场景1:某天某电商出现了GMV(成交总额)下降,此时应该根据哪一个指标解决问题?

场景2:某公司拥有3条产品线,A产品线中又细分为商品运营、活动运营等,3条产品线的若干运营团队都看同一套指标体系吗?

坦白地说,单看孤零零的某个或者某些指标是无法解决问题的,此时就需要依靠数据分析框架来解决问题了。

由前面的数据分析体系可知,数据分析体系落地涉及两个维度。我在《高阶产品经理必修课》书中为大家介绍了两个维度来看看数据分析体系在工作场景中是如何落地的。

维度1:通用数据分析模型

以下是实现通用数据分析模型的方法。

设置目标:确定当下业务中你的目标及完成现状。

问题假说:穷举现状是由哪些问题导致的。

数据证明:通过数据来证明该问题会导致怎样的结果。

数据分析:分析该问题的成因并形成解决方案。

维度2:数据分析平台

在数据分析体系中,数据分析平台的构成包含三大核心要素,分别是北极星指标、数据建模和事件分析。

数据分析平台定义中各要素的具体解析如下所示。

北极星指标:每个阶段针对具体业务领域确立的商业/业务目标

数据建模(又称指标体系):DAU、GMV、留存率、订单量等

事件分析:漏斗模型、海盗模型、杜邦分析等

注意:北极星指标(North Star Metric)又叫作OMTM(One metric that matters),它是第一重要指标,为产品现阶段最为关键的指标。之所以叫北极星指标,是因为就像北极星一样,该指标可以指引全公司所有人员向着同一个方向迈进,是全公司统一的指标。

数据分析体系其实就是通过一系列的方法量化特定的业务,因为我们如果无法量化一个事物,那么本质上就无法衡量它的好坏,也就无法定位业务发展中的症结所在。因此好的数据分析框架就是在告诉我们:当下的整体业务是什么样?为什么会这样?应该怎么办?

回顾前面面试者所说的那几个指标,我们可以发现其根本无法清晰地反映业务上的这三个问题。

当然,这里只介绍了数据分析体系的宏观框架,还未涉及具体的数据分析体系搭建过程,在数据分析实战中还会涉及相应的方法论。

在我们知道了指标体系与其对应的作用后,接下来就要来学习如何为自身企业业务量身打造一套数据指标体系了。

要想搭建一套完整的指标体系,除了对业务有非常熟悉的敏感度之外,拥有一套正确的建设方法论也是必不可少的。

这里我直接给出一个标准的指标体系的建立方法,共分如下4步:

1)确定数据分析目标。

2)纵向指标维度定义(层级设计)。

3)横向指标维度定义(指标填空)。这其中,又分为自上而下探寻(业务域驱动指标定义)和自下而上探寻(功能逆推指标定义)。

4)各维度指标项定义。

文章来源:人人都是产品经理   作者:三爷爷

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务



用户规模测算: 为用户增长设立目标

seo达人



通过问题定义、拆分成计算公式、公式中的每个指标可被量化赋值:

  1. 自上而下法,也被称之为「从供应端出发」,从产能方面,比较适合供给端存在瓶颈,供<求,例如下雨天不好打车,用户需求远远高于司机供给,只能通过司机能提供多少供给去测算单量。
  2. 自下而上法,也被称之为「从需求端出发」,从用户需求方面,比较适合供给端能满足用户需求的情况,供>求。

按照这类方法的特点是:

  1. 偏于宏观方面的估计;
  2. 测算方法相对成熟;
  3. 测算速度比较快,测算精度上有待不足。

测算精度的问题主要是基于每一步计算过程都是数量级的估算,导致颗粒度比较粗,但企业中一般存在相对精确的数据,因此可以使用市场规模测算的方法做出相对精确的测算,本文着重介绍市场规模测算中的自下而上法在企业中的应用。

 

Chapter One .
用户规模测算的使用场景?

对于公司来讲,产品上线之后,通常需要设立用户增长目标,设置过高的目标往往难以达成,过低的目标通常过于容易达成,进行用户规模测算可以为用户增长提供适当的参考范围。

  1. 对于不同的产品阶段都可以使用,比较推荐新产品上线阶段,这时候往往还没有那么快去设立增长目标,这时候业务方对于业务增长的信息较为模糊,通过用户规模测算可以设置一个较为清晰的目标和数量级。
  2. 在制定年度规划阶段,对于未来的增长目标不确定,可以通过此确定量级。

 

Chapter Two .
为什么不直接用数据库里面的数据去预测?

这个问题确实值得被考虑,而且在大数据分析领域中,也有各种模型预测,为什么不用数据分析模型去进行,而使用调研去获得相应的数据,如果数据层面有相应的行为数据可以进行相对准确地预测,则也可以数据模型预测,比如电商、快销品等。

实际上,除了行为数据之外,还有用户态度数据,比如需求情况、购买意愿、购买偏好等,这些很有可能无法通过数据库数据得到,因此可以通过问卷进行推算。

 

Chapter Three .
测算的流程是怎样的呢?

图片

先来划分一下市场:

  • 潜在市场:这个潜在的需求有多大,
  • 可服务市场:有多少需求已经被满足了,满足需求的形式不限。
  • 可获得市场:有多少需求被我们满足了。
  • 独占市场:有多少需求是别人无法满足的,只使用我们去满足的。

图片

如何去获得相应数据呢?

我们通过问卷抽样,来确定每个切分市场所代表的部分,然后按照问卷抽样推算总体的情况。

这个总体可以分成:域内总体和域外总体,总体由用户导流来决定,比如如果是一个新产品的孵化,一般会从域内先去导流,通过域内的流量能做前期的产品价值点验证,再逐步拓展。如果是领域有明显差别,需要从域外导流,那么后续的用户增长目标大概率由域外向域内的流量或者是线索。

 

第一步:通过问卷得到需求和使用数据

根据目标设计问卷问题,在总体用户中进行问卷投放,投放问卷得到相应占比。

图片

 

第二步:获得总体大盘的相应数据

如果是域内导流的产品,则总体数据既是大盘数据(特别地:抽样期间的大盘数据);如果是域外导流的产品,则总体数量可以选择市场占有率计算。市场占有率的计算方式,可以去第三方平台投递问卷,经过计算得到相应的数据。

 

第三步:计算产品数据

根据总体大盘数据和问卷相关比例,计算产品日活(highcase~lowcase)

  • highcase,属于最大需求量
  • basecase,属于某产品满足需求的情况,可以作为基准线,basecase可以
  • lowcase,属于某产品优先满足需求的情况,独占市场的份额

图片

 

第四步:计算细分需求量、使用情况等

除了日活、月活、销量等数据,还可以计算细分数据,比如行业、职业、会员等,可以采取同样的思路进行计算,为细分领域的拓展提供思路。在这里需要注意的是也需要考虑大盘中的量,最终的需求量、使用量是有总体大盘的数量、针对该产品的需求量来决定的。

需求占比=所在总体中的细分领域用户规模比例*细分领域有需求的用户占比。

 

Chapter Four .
案例

我们通过问卷获得了以下的数据:

图片

图片

看到最后,大家会不会好奇?

图片

 

原文链接:酷家乐用户体验设计(公众号)

作者:鱼日

转载请注明:学UI网》用户规模测算: 为用户增长设立目标

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


如何系统化的思考设计改版?

seo达人


1.为什么要改版?

如果你已经开始工作了,那么对于设计改版你应该不陌生。改版目的是为了优化产品体验,增加品牌粘性,提升数据转化。

一般情况下,产品在一年中至少会有一次大改版。其他情况下不会特别大的变动,毕竟每次改版都是会影响数据的变化,领导也不敢随便冒险。

那么到底什么情况下会改版?下面看一张图,就一目了然。

图片

从上图看出,通常在这些条件下,公司业务层、用研侧、设计侧驱动、年久未迭代、产品需求出发,企业基本就会做设计改版。

这里简要说下用研报告,用研团队和设计配合完成一份研究报告。那么这份报告里面就会有用户对产品主观评价,和测试过程中发现的一些体验问题或者产品问题,这些关键结论可作为设计改版的依据。

如果你在的团队有会每年都去改版,那么恭喜你,要好好把握每次机会,改版最能锻炼设计师的时候,也是设计师价值体现,平时小迭代版本真的就像小修小补一样。

 

2.改版中常出现的问题

  • 目标不清晰或者说不知道如何推导

在启动改版过程中,很多设计师不清晰设计目标,要达成什么要的效果。从大家作品集逻辑推导中就能看出,比如,很多设计师的目标关键词常出现的情况是:简洁、清晰、高级等等,我们可以想象下这样的词汇,是不是对任何产品都能用,没有体现出产品要真正解决的问题。

那么对于设计目标来说,我们应该从哪几个维度思考?

图片

在一般情况下,可从以上四个大维度去挖掘设计目标。设计师首先就需要对每个目标充分理解,最好能和老板、产品、领导对齐各方向目标后,开始去拆解可量化的设计目标。

这里补充说明下,如果只是单纯的视觉层面的改版,是很难得到多方协同支持,而且价值意义不是很大。所以,改版一定要挖掘出对产品产生明显影响的问题。

  • 不知所云的用户画像

在包装过程中,如果你只懂皮毛的用户画像,还是尽量不要把用户画像东西放进去,没有多大意义。放进去反让人觉得你是套模板,大家可以看看大厂公众号中改版文章,几乎很少看到用户画像。

那么用户画像一般什么情况下会出现?比如是0~1设计启动,这时候是需要细分人群定位,但是在设计侧角度来说,建议别放,除非你对这块非常懂。

 

3.设计改版流程

虽然网上流传出很多各种经典设计思维模型,比如斯坦福大学设计学院设计流程、尼尔森诺曼集团设计流程等,这些都大同小异。在真正做的过程中,还会有很多问题出现,我们还需从实际情况出发,遇到问题解问题。

图片

上图就是一个大致的改版设计方法,从洞察问题、目标确定、发散收拢、方案探索、结果汇报、推动落地等6个步骤,每个步骤都有很多事情要做,所以设计改版真的是一个很庞大的工程。

除了我们日常工作中这样去推进,在包装作品集思路时,也是可以使用这样的流程去思考,只是可以去掉最后两个步骤。

 

4.写在最后

前面有说到,我们真正在改版过程中可能并没有很顺,会出现很多突发状况,这也是考验设计师是否会灵活变通。最重要的一点是在启动项目的时候,不要单点去看产品的问题,最好能系统的思考和业务方对齐关键目标,找准发力点,循序渐进,这样也是为了减少设计过程中的返工问题,或者考虑不周的情况,不然会有失专业水准。

设计师路还很长,我们都需要在过程中学习成长,通过实战提高思维应变和设计能力,通过设计驱动价值体现。

 

原文地址:功夫UX(公众号)
作者: Tony
转载请注明:学UI网》如何系统化的思考设计改版?

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务

用例驱动设计,让你的设计更严谨!

seo达人



图片

复杂的AutoCAD与Inventor工具

 

用例(Use Case)的概念早在1986年就已被提出,它是需求分析的好帮手,可有效的划定范围、锚定用户、区分关系、定义价值,通过不同颗粒度的抽象层次,不断瓦解复杂系统,使设计和管理有序化。本文基于早已发展成熟的用例驱动设计理念,试图从中找到一条适合体验设计师介入的小径,来应对复杂业务的产品设计。(备注:用例、参与者、UML等详细的内容不在阐述范围内,本文仅探索一条可行的方式。)

 

1、什么是用例

定义:参与者与系统交互的一系列活动的集合。

可以发现,一个用例以一组活动集合来表现,集合中包含两个角色,参与者、系统。参与者是“活的”(不一定是人类),TA的诉求驱动了这一系列活动,此诉求即用例的核心,也是价值的体现。一个参与者可以对系统有多个诉求,详见如下案例:

图片

由用例驱动的体验设计过程,着重关注对“行为”的设计。与系统的互动“行为”被协调的、有组织的设计后,为界面表现设计建立坚实基础,避免因逻辑的变更使界面设计反复推倒重来。试图通过在界面设计的过程中寻找线索和灵感,反向的去设计背后逻辑是本末倒置的,个中原由在于我们更易于把控具象的视觉感知,较难把控抽象的行为。

 

2、系统用例和业务用例的关系

在划分用例前,有必要澄清系统用例和业务用例的关系。

业务用例是从客户当前的业务逻辑中抽象出的用例,与数字产品无关,即便没有该产品服务,客户的业务体系也可以流转。新的产品服务实际上是对传统业务体系的替换关系,而系统用例就是从该产品服务中抽象出来的,图示业务侧和产品侧的对接关系:

图片

 

用例驱动设计的案例:

总述:

为清晰阐释我们是如何利用”用例“这个概念作为切入口,最终一步步驱动、解构、细化体验设计的,下面将完整展示一个注册登陆试用产品的案例进行讲解,本案例为虚拟案例,方便设计过程的串连。

图片

 

step1:  整理故事与确定用例

故事中包含了用户的行为及其所处情境,将更易于被理解、共情和传递,故事情节的内在联系,上下游的完整性也直指价值的辐射范畴。在开始设计前,我们能从各个渠道收集到相关、相似的诉求,整合这些信息后以“故事”的方式表达出来,非常重要。

本案例的注册登陆试用故事从”企业“、”用户“两个维度进行描述,能确保在用户诉求达成的情况下,也能达成商业诉求,和谐统一的以产品服务提供出去。

 

1.1 企业故事:

公司统一了Platform账号体系,在保证多设备产品端的一键畅通体验的同时,收集用户行为信息,以提供更精准的售后服务。同时与授权中心合作,通过网上商城定期开展活动,以下放试用天数,获得试用授权。产品经理与销售部门达成持续的合作,通过试用用户的手机号进行电话回访,提高购买转化率。同时软件的设计应能最大限度的提升客户自发购买行为,需要在何时的时机,合适的位置提供购买入口。

获取用例的方式:

  • sys_运营人员→获取用户信息
  • sys_运营人员→开展活动

 

1.2 用户故事

新家装项目开展在即,大量的图纸设计使张经理感到困难。在受到同行推荐的Platform出图软件后,回到办公室,通过Platform官网找到软件信息,并利用现场wifi网络下载安装;迫不及待的启动软件,虽没有购买,但软件提供了试用入口,张经理提交Platform账号后开始试用软件。连续使用了两天,后面每次自动登录提高了试用的体验过程,产品一键自动化生成图纸初步解决了张经理的烦恼。经过和集团沟通后,张经理在界面上找到购买入口,并购买软件正版。他将软件推荐给朋友刘经理,他是Platform造价产品的老用户,且已购买过Platform加密锁,启动软件后,界面自动显示为正式版, 不用登录试用让张经理艳羡不已。

获取用例的方式:

  • sys_采购经理→试用软件

 

step2: 快速描摹流程图

用户和企业的“故事”是一种情节式的、场景式的描述,它易于想象、理解和整合。但为了更清晰的辅助设计,我们需要根据描述,进一步梳理出流程关系,将其具象化。在绘制流程图时,可不用关注角色的职责关系,旨在快速描摹出所涉及到几个业务点的关系,将企业和客户的诉求点包含进去,并在反复确认过程中思考、推敲,大体设计出其中的基本结构。过程中,可能需要补足新的故事描绘,或对既有的故事描述进行修正,以达成一个诉求与技术实现的平衡点。

图片

 

step3: 泳道角色化

理清核心业务流程关系后,将进一步绘制其角色泳道图,每个泳道下对应参与的角色。泳道图仍然是分析过程的一步,它在这里的意义是可清晰的观察到各个模块间的协作互动,是细化过程,各个“对象”的职责不同,他们之间的交互关系存在进一步优化的可能,以保证整体行为的和谐,减低系统冗余。

图片

 

step4: 业务实体的获取

事实上,带有角色的泳道图仅是在很粗的层面描述了业务所参与的对象,是单纯从流程图层面归纳出来的“对象角色”。在面对详细的功能分析时略显不足,可能缺失实际参与的“对象角色”,如不分析出来,将导致用户与系统的交互”行为“的缺失。我们需要进一步挖掘其中涉及的各个参与“角色”,完整的描绘出其交互行为过程,才能对该封闭系统做完整的设计。

从哪里可以获取到全部业务实体呢?当然还是故事。业务实体天然的包含在用户或企业故事中,才得以支撑故事的完整发生,这与故事描述的程度有关,我们第一步就需要填充完整的故事。

备注:什么是业务实体——用于达成业务目标的实体与过程中的记录信息。诸如“点餐”用例中的“打印单”就是一个实体,打印单上的手机号是记录信息。外卖员之所以能将外卖送到你的手上是通过打印单,查看上面的手机号和地址才能找到你。

下面是结合”故事“,进一步获取业务实体的案例,把所涉的可见的业务实体标识出来。

 

4.1 企业故事:

公司统一了Platform账号体系,在保证多设备产品端的一键畅通体验的同时,收集用户行为信息,以提供更精准的售后服务。同时与授权中心合作,通过网上商城定期开展活动,以下放试用天数,获得试用授权。产品经理与销售部门达成持续的合作,通过试用用户的手机号进行电话回访,提高购买转化率。同时软件的设计应能最大限度的提升客户自发购买行为,需要在何时的时机,合适的位置提供购买入口。

图片

 

4.2 用户故事:

新家装项目开展在即,大量的图纸设计使张经理感到困难。在受到同行推荐的Platform出图软件后,回到办公室,通过Platform官网找到软件信息,并利用现场wifi网络下载安装;迫不及待的启动软件,虽没有购买,但软件提供了试用入口,张经理提交Platform账号后开始试用软件。连续使用了两天,后面每次自动登录提高了试用的体验过程,产品一键自动化生成图纸初步解决了张经理的烦恼。经过和集团沟通后,张经理在界面上找到购买入口,并购买软件正版。他将软件推荐给朋友刘经理,他是Platform产品的老用户,且已购买过Platform加密锁,启动软件后,界面自动显示为正式版, 不用登录试用让张经理艳羡不已。

图片

 

step5: 时序图的绘制

接下来,我们将进行最重要的一步:基于已明确的核心业务流程和已拆分出的业务实体,构造出一整套完整的系统行为。将使用到UML语言的重要工具——时序图。时序图能天然的表达多个对象间的复杂行为关系,在产品研发领域应用广泛。(时序图的绘制有一整套完整的语法,本文不讲解该部分内容)时序图的“对象对话”形式,原生的契合了“交互”这一概念,游戏大师Chris Crawford和设计专家Jon Kolko都对此有所定义:

发生在两个或多个活跃主体之间的循环过程,各方在此过程中交替地倾听、思考和发言,形成某种形式的对话(conversation)”

——《Chris Crawford on Interactive Storytelling, 2nd Edition》

“所谓交互设计,是指在人与产品、服务或系统之间创建一系列对话(dialogue)”

——《houghts on Interaction Design, Second Edition》

时序图重点强调了“行为”的发生与互动,使整体目标达成。一系列有边界的行为活动合集,就组成一个完成的、有意义的“用例”。让我们再次回到开头的“用例”上来,并将该用例系统化。

用例:

  • sys_运营人员→获取用户信息
  • sys_客户人员→试用软件
  • sys_客户人员→授权软件

图片

除确保能服务于运营人员、客户外的核心逻辑能达成外,为带来更好的使用体验。我们需要从诸多体验维度考虑各个系统行为。“体验因子”将作为系统行为的一部分目标,使整个交互活动更易于理解和顺畅。可直接借鉴一些通用的体验因子来评估,对于不同形态、业务的产品,体验因子有所偏重,诸如工具类产品对“操作便捷度”、“工具易学性”、“工具帮助引导”有较高要求。

回到注册案例上来,考虑到“易学性”和“帮助引导”两个体验因子,可以对用户“输入手机账号”的行为进行优化设计,提前或实时对手机账号进行校验,避免出错后再提示,徒增挫败感。同时提供“获取验证码”的触发入口,引导用户执行该操作,很大程度上降低系统的理解负担。在行为设计过程中,存在颗粒度问题,复杂系统涉及到大量互动会话行为,可以有粗细的逐步细化。

图片

 

step6: 触点行为的竞品调研

完成系统互动行为的设计后,可以开始正式的界面信息设计。“行为”的表达是极度精炼的,行为本身就是价值取向,并暗合用户的内心想法,由用例行为来驱动界面设计,才能真正做到按需设计。诸如“我感到肚子饿,第一想法是吃饭“、”早上该上班了,第一想法是走路去、打车去或坐地铁“。

在面对”输入手机号码“行为的界面设计时,除了个人创新外,也可调研市面上有哪些优秀的界面承载方式,作为一种”学习输入”,或者激发出新的创新行为。这种由内而外的驱动设计,能使设计过程变得更有序,且避免遗漏。

图片

 

step7: 触点支线、异常、极限情况的排查

最后一步是对支线、异常、极限情况的排查,得益于时序图系统行为的可视化表达,我们可以清晰、有序的排查每一个对话过程中可能出现的异常或错误,诸如“验证码无法到达”、“信息返回错误”等异常,都将被有效地排查出来。同时,还能从行为对话结构中,洞察到新的设计优化机会点,诸如“提交账号信息”环节,必然需要网络的通畅,故断网环境下需要给出明确的反馈。如下示例:信息返回错误、异常流程高发地、页面跳转……

图片

图片

时序图会话的先后顺序也将直接影响到界面的表达,图示中“输入手机账号”与“填写验证码”是有先后时间顺序的,如果同时在界面中展示两个输入信息,无疑造成并列的误解。(可惜市面上几乎大多数注册环节都如此,大家早已习惯)

 

3、找到体验的最大撬动点

总结

所谓用例驱动体验设计,是借用例的概念来定义问题和范围,并使用UML来分析问题,使整个设计过程变得有序、系统、严谨,在应对复杂系统、多链路多角色的业务时较为有效。用例在整个设计过程中是核心的存在,一旦模糊就会出现偏差,引入无关内容,同时也会失去对用户价值的把控。用例的获取很不容易,而精准统一的用例更难,涉及到颗粒度、抽象层次、参与者、受众等等内容,本文未对“用例的获取”做详细阐述,仅专注在用例如何驱动设计过程,有兴趣者可移步学习。

 

撬动点

以用例为中心的体验设计,从业务逻辑出发,转化为系统逻辑,在构建这个过程时就持续考虑体验因素,是把控体验的有效办法,我们站在结构上思考体验,将彻底的优化系统的体验。单纯从界面表现和框架呈现上做体验优化,上限明显,只有扎得更深,才能从结构上找到优化的“最大”杠杆点,带来体验提升,并有可能直接对研发程序设计带来指导。而UML的建模语言是有效的辅助工具,两者的配合使这一切成为可能。

图片

 

原文链接:酷家乐用户体验设计(公众号)

作者:同舟

转载请注明:学UI网》用例驱动设计,让你的设计更严谨!

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档