当用户进入页面时,除了浏览当前页的信息内容还需要寻找接下来可执行操作的可交互区域,即按钮区。除了单纯通过视觉差异区分按钮和页面其他元素外,还需考虑到用户在信息浏览过程中的视觉动线。结合古腾堡法则和格式塔原理,给出以下设计建议: 1)放置在用户的浏览路径中 在没有其他视觉效果引导时,F型和Z型网页浏览模式可以作为用户视觉动线的基础指导,关于以上2种浏览模式网上有太多相关介绍,此处就不再赘述。 将关联性强的信息放在一起,可以降低阅读成本,提高用户的感知效率。 1)保持用户的操作惯性 这里先讨论一下开头提到的问题:主操作项放在左边合适还是右边合适?我们先来看看一些案例: 文章地址:https://www.woshipm.com/pd/3104897.html具体的实验过程不再详细赘述,直接来看结果:对于新用户而言,确定按钮的位置对操作时间和错误率影响并没有太大差别。并由此得出更关键的结论:不要轻易改变当前产品中用户已经习惯的按钮位置。 在此基础上对于操作项不固定的页面,给大家整理了以下建议: 2)同类操作项按组分类 最典型的案例便是编辑器类产品的操作项,将同类操作区整理分组,方便用户查找。 此处的阅读顺序并非特指从左往右、从上往下,而是依据用户当前视觉动线,优先满足用户预期或操作可能性最大的按钮需要最先被用户发现。 4)流程操作遵循方向认知习惯 流程属性的按钮如上一步、返回、后退等操作用户习惯在左边,而下一步、前进、更多等操作在右边。 如删除或清空按钮,尽可能放置在远离主按钮的位置,甚至可以下钻至更多按钮中,避免误触。 在文章开始基于强调程度划分按钮类型时,按钮的视觉样式便是基于其强调程度划分的,页面中越是需要强调的按钮其视觉权重越高。前文中只划分了主按钮、次按钮、文字按钮、图标按钮这4种基本类型,天剑狂刀页游,此外还可以通过文本粗细、内容量等方式进一步细分。 7.1 按钮的尺寸 按钮的尺寸优先体现在其高度上,而宽度一般根据内容区大小自动适配。通常会将按钮分为大、中、小这三种规格,以满足不同场景下的使用需求。 高度: 大尺寸:通常使用在企业官网、账号登录、导航菜单等场景中。一般高度设置为40~64px。 中尺寸:按钮的默认尺寸,适用在B端页面的大部分场景。一般高度设置为28~40px。 小尺寸:常用于气泡弹窗等小型控件中。一般高度设置为12~28px。 宽度: 关于按钮宽度需要注意的是,由于按钮内容的不固定,同规格按钮可能因为内容量差异引起视觉上的层级误判。故为了减少按钮错综不齐的情况,建议设置按钮最小宽度的界限,一般为4个文字+左右内边距。 相较于其他方面,似乎大家对产品文案总是保持着"点到为止"的态度,但是并不意味着文案不重要,错误的文案会让用户产生疑惑,严重影响用户体验。相反好的按钮文字甚至可以做到即使不去阅读上下文,单凭按钮文案即可做出正确的判断。在一些关键节点的CTA按钮,文案的优化可以带来转化率大幅度的提升。因此关注文案细节也是设计师平时需要考虑的问题。优秀的按钮文案包含以下几个要点: 1)内容简洁,删除赘词 按钮区域寸土寸金,每一个字都要有其存在的意义,如果删除也不影响信息表达即没必要存在。 文字表达清晰,避免使用用户难以理解的专业术语。 |










