
课程咨询: 400-996-5531 / 投诉建议: 400-111-8989
认真做教育 专心促就业
搜索框是UI设计师在设计网页或者是app软件的时候大多数情况下都会用到的一个设计功能,而本文我们就通过案例分析来简单了解一下,搜索框设计应用注意事项分析。
搜索框无疑是中间页众多功能中的C位,如果说其他功能是可以自由组合的配菜,那么搜索框肯定就是无可替代的汤底啦,是每个搜索中间页的标配。它位于中间页的顶部,样式应延续其搜索入口的设计风格,需要我们注意的主要有两点:
取消与返回
不同于一般页面的导航栏左侧是”返回“的设计,搜索中间页多数选择的是无”返回“按钮,而在搜索框右侧加“取消”,通过键盘的回车键确认并进行搜索。这也与iOS人机交互指南中的建议一致,多数产品都采用了这种设计。
除了这种主流样式也一些不同的设计,比如左侧依旧为”返回“按钮,右侧是”搜索“按钮的设计。
两种设计在只有一级的搜索页面时并无明显区别,无论是返回或是取消,都是结束当前搜索行为,二者的区别更多是体现在出现二级页面时。
比如拥有搜索分类的微信,搜索一级页面采用的是右侧取消的,而进入二级、三级页时,加上了左侧返回,这里”返回“对应回到上一步的操作页面,”取消“则对应结束整个搜索行为,直接回到初页面。
是否默认弹起键盘
多数产品进入搜索中间页后,搜索框光标闪烁,键盘自动弹起呈待输入状态,让用户可以更方便快捷的操作。但也有一些产品进入中间页后需要重新点击搜索框唤起键盘,为页面内容预留更多展示空间,侧重于突出中间页的推荐内容。
关键词联想
关键词联想是在用户输入搜索词的时候实时反馈,对该词进行模糊匹配,以列表展示节约用户的输入成本,帮助用户更快速的找到目标完成搜索。
色彩区分
表现关键词与匹配内容的关联度,有三种形式分别是:无区别显示、弱区别显示与高亮显示。
无区别显示更加注重匹配结果的整体感,适合在格式统一的列表中使用;高亮显示则较为注重匹配结果与关键词的关系,在格式多样的列表中可以更好的突出重点。
【免责声明】:本内容转载于网络,转载目的在于传递信息。文章内容为作者个人意见,本平台对文中陈述、观点保持中立,不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。更多内容请加danei0707学习了解。欢迎关注“达内在线”参与分销,赚更多好礼。