加入收藏 | 设为首页 | 会员中心 | 我要投稿 核心网 (https://www.hxwgxz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 建站 > 正文

超详细解读:UI导航设计不仅仅指的是导航栏

发布时间:2017-10-25 08:52:23 所属栏目:建站 来源:优设网
导读:副标题#e# 编者按:其实网页或者App中的导航(Navigation)这个概念远不止我们熟悉的导航栏,而是一个更加广的交互概念:引导用户和产品进行有效的交互,实现用户的目标。本文将详细地介绍界面的导航设计。 一个网页或App产品要想有很好的可用性(usability

行为召唤(CTA)

CTA是用户行为召唤的简称(call to action)。CTA简单来说就是指设计师通过设计,刺激用户去做出一些行动。相应的,CTA元素就是指那些能刺激用户做出行动的交互元素。典型的CTA元素是按钮,标签或者链接。

不管在什么界面,CTA元素都是高效的交互行为的核心,极大的关系到产品的可用性和导航有效性。如果CTA元素的设计不到位的话,用户会产生困惑并且得费劲地去尝试。产品的转化率和用户体验都会大打折扣。这就是为什么CTA元素特别值得注意。无论什么样的界面,它都必须是最瞩目的元素之一,用来直接地告诉用户怎么用这个产品。

超详细解读:UI导航设计不仅仅指的是导航栏

△ 作者:Eugene Cameel

一些CTA元素直接用图标形式而没有任何文字说明,但只适用于大家都熟知其含义的图标,比如听筒图标和信封图标。上图这个例子中,这个听筒图标就是这个界面中一个焦点,是一个典型的CTA元素,引导用户快速地实现他们的目标。不需要任何文字说明,用户也能懂点击这个图标的结果。

但是,如果一个图标的含义不是那么明显或者可能造成误解,最好还是加上文字说明。

超详细解读:UI导航设计不仅仅指的是导航栏

△ 作者:Tania Bashkatova

上面这个例子是一个关于制作海鲜的网站的着陆页(Landing page)。页面的标题let’s cook还有食材照片是一个CTA,但不是一个可交互的CTA。可交互的CTA是下面这个红色按钮,用户点击这个按钮能看到更多关于不同主题和菜谱的信息。 抓人眼球的颜色强调了页面的视觉层级关系,把用户的注意力拉到关键的交互区域中。

条(Bar)

条(Bar)指的是界面中一组用户可以点击的元素,用来快速与产品进行互动,或者还能让用户知道事件的进程。

标签条(Bar)

(编辑:核心网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读