检验鉴定| 还珠格格2部| 工藤新一和服部平次| 模拟人生中世纪秘籍| 黄文奇| 门窗防盗报警器价格| 丰丸| 豪瑞斯| 霍尔特比| 昆明租房信息| 延时冲洗阀| 金敏静| 金线岭| 无锡塘南招商城| 改革开放30年纪实| 惠氏奶粉事件| 黑道教父杜月笙| 景天阁| 武汉风水| 大功率光纤激光器| 广渠门桥| 昆山红星美凯龙| 心港| 打破一切常规| 锋尚99| 家居就| 美标卸扣| 仙剑几最好玩| 待我长发齐腰| 天津无抵押贷款| 安乐茶饭| 古国天使| 福州二手房价| 慧芝湖花园二期| 冒险岛冰雷加点| 仙剑奇侠传灵儿续传| 奔跑的蜈蚣| 工艺之道| 建军80周年| 海鸥沙发| 结婚证真伪查询| 门铃电路| 土桥二手房| 先考是指| 仙剑奇侠传电视剧有几部| 本拉登传| 沉星档案| 独孤意| 胡延平| 教育心理学书籍| 盈禾网投网站| 运动365体育| 沙巴365体育| 365k体育在线| 本田365体育| 365体育3659| 365体育网球| 外围体育365| 体育外围365| 365体育沙巴| 365体育试玩| 威廉希尔游戏| 365bt体育官网| b365体育备用| 类似365bet的网站| 365体育赌场| 体育365网站| 365bet娱乐场网站| 365bet比分| 365足球体育
365体育论坛 各地区各部门要结合实际认真学习、深刻领会、切实贯彻。

当前位置:首页 > 新闻关注 > 网站建设 > 卡片式设计的基础概念和运用方法

卡片式设计的基础概念和运用方法

发布时间:2019-12-13关注:25301编辑:内蒙古航佳网络科技有限公司标签: 卡片式设计有什么优点?什么时候可以运用卡片式设计?  

在互联网产品中,除了内容型外,一些功能型的产品信息内容也是相当巨大的,特别是管理控制系统,业务管理、功能操作、数据展示等。在信息量这么大的页面中除了重视内容质量外,形式功能的组织与呈现也是同等重要,对提高用户获取有效信息的效率有着非常大的帮助。

上面所说的形式功能的组织与呈现其实讲的是设计排版上的问题,当然对设计师排版功力也有相当的要求。这种排版优化的方法有很多种,我这里主要围绕卡片式设计的理论进行深入探讨,相信大家对卡片式设计已非常熟悉,虽然已流行了好多年,但是设计形式并不是随着使用年龄的增长而消失,芝加哥学派路易斯.H.沙利文提出过:“形式追随功能”就能说明这一点。最近笔者在项目改版中也运用了相关卡片方法,发现效果不错,所以希望借在项目里的思考与尝试,抛出引子,供大家参考。

卡片式设计的定义

在生活中,我们经常接触到各式各样的类似右图中的卡片,比如扑克牌、名片、机场和地铁的指示牌等等。

如上图,大家可以看出,他们普遍具有以下特点:

一清晰直观,二简单易懂,三信息模块化。

比如扑克牌我们可以看出虽然只有一个图案,一组文字,但很清晰传达出这张牌所代表的含义;又比如机场和地铁的指示牌,采用了图标、字体元素,很清晰直观地引导乘客方向,这种由文字或图案组成的方块样式叫做“卡片式设计”。这种轻巧、简洁的实物设计也被慢慢应用到虚拟设计当中。

如上图,现在卡片式设计的应用场景非常广泛,最有代表性的是微软Win8、Win Phone 7的metro风格,他们也是采用了大量的卡片式设计,据说这种Metro的设计灵感也来自于机场、地铁指示牌。

另外google +、 google play等很多谷歌产品也同样采用了这种设计,如下图

正是因为卡片式设计在微软、谷歌的产品界面的大量运用,很多互联网企业也纷纷采用这种设计,这是应用在PC端的界面,内容部分也都采用了卡片式设计,如下图:

下图中的移动端的界面,模块中可点击部分也采用了卡片风格。

这是印刷类的杂志界面,如下图杂志里的部分展示信息,也采用了这种卡片式风格。

卡片式设计的优点

1. 增强点击感

这是诺基亚手机的win phone系统(下图),系统桌面的所有内容都是一个个小方块展示,类似一个块状类的按钮,让人联想到是可以点击的操作入口:

而且每一块入口都是有区域大小(下图),从而避免造成误点击。

2. 排版整齐

如下图,将信息、图像归类整合到一个方块里,清晰直观又避免页面因为信息多而散乱,卡片的排列方式是按列或者行的方式进行对齐展示,视线沿着横向或者纵向浏览能快速找到想要的信息,此外,这种固定大小的卡片方块也有利于栅格化排版。

比如下图,页面按5个单元进行栅格,利用卡片方块的展示,很轻松地计算并调整它的大小进行栅格布局

3. 信息模块化

如下图,这是google now的一个界面,将信息、图像按维度分类整合到一个卡片里,能有效地避免信息散乱、同时避免信息分类不明确像这种模块化展示有效地减少用户思考的时间,能快速找到自己所需的信息。

4. 响应式设计

卡片方块的高度和宽度的大小都是可以调整的,正是因为这种特性很适合用在响应式设计里,卡片在不同的平台展示,由于分辨率不同,卡片能自适应地展示,以上是卡片设计的优点。

总结

在信息量大的页面中除了重视内容质量外,形式功能的组织与呈现也是同等重要,对提高用户获取有效信息的效率有着非常大的帮助,这时应用卡片式的设计方式是不错的选择。

内蒙古网络公司航佳网络网站建设为您讲述最新的网站运营、网站制作、网站优化、网站优化推广知识,有何疑问就赶紧咨询我们,销售电话:0471-4599590  18698468112  15947112866

相关新闻

销售电话:0471-4599590   18698468112   15947112866
客 服QQ:303799553
微      信:gaowei1318
地      址:呼和浩特市金川开发区宽城小区#A6-4
网      址:www.nm9988.com www.航佳.com

内蒙古网络公司航佳网络专业服务 呼和浩特网站建设呼和浩特网络推广呼和浩特网页设计呼和浩特建网站呼和浩特做网站,做网站还是选择 呼和浩特网络公司呼市网络公司航佳网络。

关于我们  |  联系我们  |  网站地图  |  广告禁词检查
版权所有:内蒙古航佳网络科技有限公司  Copyright  www.nm9988.com  备案许可证号:蒙ICP备14002651号    蒙公网安备 15012102000128号  
365体育官方网 365体育客服 365体育网投群 365体育排行 港城365体育
蚀刻因子 岭南鞋城 常德市二中 金轮国际广场 爱丽小屋韩国官网
zghsy 成都熊猫基地地址 杭州乌镇一日游 北大口腔医院第一分院 海星未来城
汪金玉 曼湾 济南如家快捷酒店 哈尔滨艺校 金铸成
陇南酒店 刘振华将军 北京艺考画室 栾茂田 广药王老吉
北京凯旋城 港中旅维景国际大酒店 爱幕 福州团购 科冕木业
北苑之星 飞扬影院 京林 妈咪宝贝杂志 tanweiwei
菏泽学院怎么样 万朋学堂 鞭炮批发 赣州住宿 洪祥