规划师给你科普什么是卡片规划

      目前“卡片式规划”在越来越遭到规划师的青睐，尤其是在APP的界面规划上。“卡片式规划”已经渐渐进入到各行各业之中，咱们耳熟能详的linkedin和facebook都是在用卡片式规划。那么什么是卡片式规划，卡片式规划又会带来怎样的用户体会呢。现在就由规划师给咱们科普一下吧。

1. 遵从「一卡一概念」准则

      卡片的一切内容只能和一个主题相关。一个卡片能够包含多种元素，但应该首要表现同类信息或内容。这样用户才能更轻松地挑选他们所喜欢或愿意分享的内容。

一个模块(或卡片)「包含」一次用户交互。

2. 保证整个卡片都可点击

     遵从菲兹规律(Fitts’s Law)，要让用户能够点击或触击卡片的任何部分，而不只是文字链接或图片。无论在移动端的触击屏幕，仍是需求鼠标操作的主桌面端，有相对大面积的触击区都可大大提高卡片的可用性。菲兹规律是人机交互领域一个非常重要的法则。其基本观念是，当一个人用鼠标来移动鼠标指针时，屏幕上的方针其某些特征会使得点击变得轻松或困难。方针离得越远，抵达就越费劲;方针越小，就越难点中。

小提示：推荐运用一点暗影来呈现深度，让咱们知道卡片是可点击的。

3. 保证卡片的视觉享受感

      要说什么样的卡片才是成功的，那必定是有杰出规划和可用性的卡片了。对卡片稍加打磨，参加少许美学特征，卡片会让人感觉了解，一起构思十足。

当开端着手规划卡片时，你应当特别注意以下几个方面：

     根据卡片的规划一般首要依托视觉规划，而运用很多图片便是卡片规划的一大亮点。研讨发现已证实，图片能够提高网页或 app 的全体规划。所以，参加图片也使得根据卡片的规划愈加引人入胜。

暗影和突变

      参加暗影和突变这两种元素，能够有效地让用户将你规划的卡片与现实生活中的对应什物联络在一起。但在规划时，一定要仔细考虑怎么运用这两种元素：如果卡片四周和旮旯都加上暗影，要再想让用户将它与现实生活中的对应什物联络在一起就有点难了。带有圆角的卡片从视觉上看来就像是一张扑克牌。当然，要想吸引用户注意力，还能够经过排版来实现。卡片一切内容都应该简略易懂，无妨试试从最大可读性角度来规划：挑选简略的字体和易于阅览的配色方案(文本内容在纯色布景下，且布景色彩和文字色彩有鲜明对比的，这样的文本才是最清晰易读的)。
尽量操控字体的种类数量。关于绝大多数状况而言，单一的字体足矣。
小提示：卡片主内容文本，选用 sans-serif 字体正常粗细的作用非常好。

4. 约束卡片内容篇幅

      卡片一般不大，其作为用户了解更多细节信息的「入口」，所以它本身不需求承载过多细节内容。当你试图在卡片里添加很多内容，导致卡片变得过宽或过长，那它就会失去其原有的「拟物」作用。

5. 参加动画和动效

       动画如果运用得好，能够大大提高用户体会。其能够协助用户在根据卡片的界面中更好地定位，并树立不同卡片状态之间的视觉相关。

视觉提示

视觉提示协助用户更好地了解怎么与界面进行交互。当需求向用户展示某些详细功用怎么操作时，它就显得颇为有用了。展示导航功用的提示。

视觉反应

视觉反应在界面规划中适当重要，因为它能直接和用户的自然希望相相关。在现实生活中，各种物品一般都会对咱们的行为作出反应，这也是大众习以为常的反应。比方电脑的开关按钮，当你按下开关键时，你能够感遭到按钮被按下的力气反应，一起还有声音反应。在电脑端，你能够经过「悬停作用」来显示相关元素的交互行为。悬停动画能够增加功用的可发现性，一起，也运用户体会愈加风趣。在卡片中参加悬停动画。运用悬停作用还能够激活更多选项。

扩大

扩大能够呈现从原图到细节视图的过渡：用户选中卡片就能够直接看到相关详细信息。不过要注意，要确认让用户感觉他们仍在相同布景框架下进行交互。

动画能够将缩略图和细节视图相相关。

结束语

      卡片是界面规划领域创新型新元素。它不仅仅是一张卡片，它仍是发明优质内容和规划最佳用户体会最灵活的布局方式之一。