美文网首页UI设计头条
搜索怎样设计采用起来顺手?

搜索怎样设计采用起来顺手?

作者: 王旋子同学 | 来源:发表于2018-07-16 23:21 被阅读440次

A 要不要设置搜索?

首先,要明确为什么应用要有搜索?是因为产品提了需求就要加上吗?是便于用户寻找吗?其实关注电商的人都知道,电商的大部分流量及转化都是来自搜索。这也很容易理解,就是需求的不同。如果在沙漠里有一个口渴的人,你给他玲琅满目的物品倒不如直接给一瓶水能满足他的需求。所以如果应用当中要添加搜索,那必定是希望搜索能够快速相应用户需求,从而带来转化。

B 搜索的分类

接下来,我们看看目前搜索有哪些分类,大纲如下(为啥直接大纲?因为每篇文章都有大纲,牛奶已经打扰的我写不了文字了,所以直接上图)

搜索分类

【入口位置】

1. 独立的一级tab搜索

这种样式十分强化搜索,适用于应用主要功能基于搜索操作,常见的有社交、电商。

2. 顶部搜索框

这种样式优先级比第一种低,但是因展示在顶部栏,用户在使用的时候可以随时使用。

3. 顶部搜索icon

相对于2更弱化,用户可点击icon随时进行搜索操作

4. 下滑搜索

这是一种交互样式设计,当用户在下滑页面的时候会显示搜索框。这种样式适用与页面长度不可控(多为页面较长),也可以随时进行搜索。

5. 页面搜索框

功能重要度最低,用户需在页面首屏位置才可进行搜索,适用于较短的页面。

搜索位置

【形式】

1. 文字搜索

(图片来自网络)

2. 语音搜索

(图片来自网络)

3. 图像搜索

(图片来自网络)

4. VR/AR搜索

(躲避牛奶截的图)

【功能】

1. 单一搜索功能

最常见的样式

2. 搜索推荐

(图片来自网络)

3. 搜索前分类

(图片来自网络)

4. 搜索后分类

先搜索后分类

5. 搜索后筛选

搜索后筛选

C 搜索结果

搜索结果一般有三种样式,未找到匹配结果、文字结果和图文结果。

D 走心小设计

最后,来看看在做搜索的时候可以有哪些走心的小设计。

1. 搜索入口便于发现,使用结果路径短

2. 搜索框中有提示文字,让用户在不知道搜索什么的时候也可以搜索到推荐的结果(也是一种营销手段)

3. 搜索框输入文字时有文本删除按钮

4. 输入时进行搜索词匹配

5. 历史输入结果,有单个删除按钮和批量删除按钮

6. 精准推荐适合用户的关键词

今天先写到这里,明天补充图片说明。

相关文章

网友评论

    本文标题:搜索怎样设计采用起来顺手?

    本文链接:https://www.haomeiwen.com/subject/diripftx.html