设计协作,用摹客

更好的产品协作设计平台,设计师的利器,产品经理的帮手,工程师的伙伴

文章分类
设计1+2,摹客就够了!

摹客,支持Sketch/PS/XD/Figma/Axure设计稿交付、自动标注切图、全流程协作。助力产品团队高效工作!

立即开启
【友情推荐】uimaker - 专注于ui设计,为ui设计师提供ui设计相关教程、素材及灵感。

了解更多
入门教程 了解更多
成都君德鑫力达科技发展有限公司

分享到微信朋友圈:

打开微信,点击底部的“发现”,使用 “扫一扫” 即可将网页分享到我的朋友圈。

博客 > 网页设计 > 网页设计之六大原则,第五条很少有人知道!

网页设计之六大原则,第五条很少有人知道!

Berry
2017-06-15
83957

随着互联网时代的快速发展,设计师不再只是为互联网创造漂亮美观的图片那么简单了,作为一个WEB设计师,除了基本的设计技能之外,还需要考虑一些其他的问题,比如用户体验,算法,代码等等。如今用户体验设计越来越重要,对于WEB表单的设计尤其如此。

WEB表单设计的目标是设计出一套让用户能够从填表到点击提交按钮的最简单的流程。从非常简单直接的表单到花哨、多彩和创意的表单,每个网站都会呈现一种表单风格。不论是登录/注册表单,还是联系表单,或者其他类型表单,设计师们需要牢记一点:这些表单的目标是要赢得用户的注意,引导他们在其中填入信息。根据多年的设计经验,Mockplus归纳了在WEB表单设计中的六大原则。

(一)保持醒目和简洁


我们经常会遇到一个问题,非常多的用户抱怨注册表单需要太多的信息。如果你设计的网站正在想办法增加注册用户数量,那么首先必须保证设计的表单尽可能的简洁,易于填写。同时对于着重强调的版块和信息,在设计时可以采用更醒目的方式加以强调。

(二)合理组织信息


对于较为复杂、填写项多的表单,如果不对信息进行组织,很容易显得繁杂混乱,让用户在一开始就产生抵触的情绪,甚至选择放弃。合理有层次的组织信息,可以利用框线、空间间隔、颜色的不同,按照不同信息的类别、属性和相关性进行区块的划分,用步骤条指示当前的进程。清晰的浏览线,合理的标签、提示文字及按钮的排布,避免不必要的信息重复出现,能够降低用户的视觉负担和物理负担。

(三)更大的输入框


根据实际的用户反馈,表单设计中更大的文字输入框、适度的留白空间会让人更有填写的欲望,优雅的动画效果也能增加填写的趣味。设计师在设计表单的过程中,需要缓和不同输入元素之间的冲突。加粗的文字提示用户哪些区域已经填写了,哪些区域还空着,当激活某一输入框时,它会变成淡蓝色,提示光标现在所处的位置。

(四)为用户节省时间


需要花大量时间填写的表单容易让人失去耐心,用户是懒惰而繁忙的,试着删去所有不必要的填写项,考虑除了让用户机械的通过键盘在表单上输入数据外,还有没有别的更优方式(如后续进行用研调查)收集所需信息。

(五)一条龙服务的设计理念


表单的终点并不是提交,设计师在设计的时候需要抱着为用户提供一条龙服务的理念,形成流程闭环,避免用户在中途跳出。一个好的表单设计,不仅需要考虑用户填写前的引导、填写时的及时校验与帮助、还需要考虑填写后的整个流程体验。思考用户填写表单的初衷是什么,让他在填写完表单后能够最快得到他最想要的东西。即便是他暂时无法得到的,也需要告诉他相应的原因和能够进行的替代操作。

(六)提供设计关怀


根据不完全统计,互联网中大约有12%的人具有或轻或重的色觉障碍。如果将色彩作为区分不可点击文本和可点击链接的唯一元素,可能会让这部分的人使用时出现困难。我们在设计表单的过程中可以通过给链接文字加下划虚线、使用按钮或其他形状做区分,让这类用户能更加清楚的知道哪些是可点击的区域。

上一篇
UI设计规范:单选按钮 vs 复选框,没那么简单

庸   06/15

设计师都是美工?NO!网页设计 VS. 平面设计有区别!

Grace   06/13

下一篇
需要帮助?

我是小摹,你的7*12小时产品顾问

立即扫码加入官方微信群

官方热线:19130671449

服务邮箱:service@jongde.com