摘要：
阅读全文
摘要：
我们开着小车，哼着小曲，告别工作的喧嚣，告别城市的浮躁，来到了古色古香的小河直街。自宋代以来，这一区域一直是运河沿线的重要区域，经过民国年间的繁荣后留下的历史遗迹类型众多，历史文化内涵较为丰富多样。小河直街也曾经是晚清时期的320国道。小河直街历史文化街区是集中反映清末民国初期城市平民居住文化生活、生产劳动文化和运河航运文化的重要历史文化街区之一，是一条以保持传统居住商住功能为主，延续杭州地方传统特色文化和展示运河航运文化，集商住、居住、休闲功能为一体的历史文化街区。在云水谣吃完颇有风味的丽江菜之后，我们小憩了一会，开始论表格。相信所有的交互，视觉，前端对于grid都有很深刻的接触和各自的理解 阅读全文
摘要：
如今，随着智能手机、平板电脑等移动手持设备的普及，越来越多的Web网站都在向这些平台做兼容。同时，这些移动设备上的视觉设计与交互设计也在影响着Web端的设计。所以，现在我们的设计是不是要变得更加的popular一点呢？是不是可以总结出一些方法让我们的web端产品跟上时代的脚步呢？ 阅读全文
摘要：
文字，这种与人类历史几乎同步的信息表达形式，同样也是视觉传达设计中最重要、最基础的元素之一。她的历史沿革应该已经有非常多的同学做过分享介绍，这里就不再赘述。我想讲述的是字体在网页设计中的运用，她最为常见的一种承载形式：banner字体设计，这几乎是每个Web设计师都会遇到的设计内容，不论是通栏、半通栏，还是各种大大小小尺寸以及活动营销推广的页面头部，都可以看到字体设计的身影。阿里巴巴中国站首页改版后对于页面内的banner推荐位有了更高的要求，这也引发了我对如何做好一条banner的思考，我觉得在banner设计中相对图形及背景元素的运用，文字本身的设计与排版要重要很多，即使在没有任何背景元素 阅读全文
摘要：
本文没有咬文嚼字的地方，只是一个技巧的分享，十分简单，简单到流泪。网页视觉层面主要是由形式（或叫布局）、色彩、图片和文字信息组成，设计师通常对形式感关注的比较多，因为视觉冲击力、设计差异性或创新大多都仰赖形式呈现，而色彩主要影响整体观感、设计品质以及受众情绪，很多时候我们设计了一个不错的形式却未能做出这个稿子应有的品质，会不会太可惜？形式需要思考创造，图片素材需要学习处理，文字需要梳理编排，但网页色彩是不是一定需要有天生的色感、丰富的理论和多年经验沉淀才能运用自如？当然不！关于网页配色网页配色的文章在网络上很多，甚至有些泛滥，稍微关注过的同学应该都知道“色轮”、“色卡”等辅助性配色工具，但那更 阅读全文
摘要：
CSSSprites技术对于广大的前端工程师来说应该是一点也不陌生。这个被国内开发者昵称为CSS精灵CSS雪碧的家伙到底解决了什么问题，我们又怎样合理使用这个技术呢？下面让我们详细的聊聊。在大家还在拨号上网的“远古时期”，由于网速的限制，页面开发者都喜欢把网页里面的图片字节数控制的非常小，往往在一个图片文件夹里散落着n多的小碎图。随着网络技术的发展，网速的提升，大家越来越重视页面的加载速度，页面效率问题，过去的那些小图便成为了前端开发者的眼中钉，因为每加载一张图片都会产生一次浏览器请求数，发起的请求数越多那么页面加载的速度也越慢。还有当页面加载时，图片一个个的零星显示，鼠标经过时候背景闪白等也 阅读全文
摘要：
3月份，Photoshop CS6 Beta版(下文简称PS CS6)发布公测，有着多项惊艳的新特性，工作中整天和像素打交道，感触比较深的特性就是PS CS6支持矢量对象绘制、变换时像素自动对齐网格。 当然，对象绘制、变换时像素对齐网格并不是PS CS6独有的功能，只是更智能更好用了，PS CS6的像素自动对齐网格功能在绘图过程中，无疑方便了很多，不必再担心图形边缘会出现模糊，但是我们在实际的图形设计过程中会发现，还是会经常需要调整一些路径没有完全对齐到网格产生的半透明的过渡像素，用来平滑图形边缘减少锯齿感，或让图形看上去更饱满、更细腻，我们称其为次像素(或亚像素，Sub-pixel，一... 阅读全文
摘要：
如果想让你的移动应用更活泼更灵动，丰富的动效是不可少的，丰富的动效可以让你的应用更具活力，充满生机；丰富的动效可以让你的应用彰显效率，提升品质感；丰富的动效可以让你的应用充满魅力，引人探索；丰富的动效可以让你的应用减少焦虑，消除等待感；丰富的动效可以让你的应用充满韵味，有节奏感；丰富的动效可以让你的应用有出奇的信息组织，整洁高效。这里主要介绍六种简单通用的方式——转场、邀请、过渡、反馈、缩放、吸附。由于手机屏幕空间有限，更多的内容会被隐藏在屏幕后边，或者屏幕的左边、右边、下边，转场动效能帮助应用营造一种空间方位感。转场动效是目前应用最多的动效种类，毕竟iPhone、Andoird、Wp7都有提 阅读全文
摘要：
以前也写过类似的实现方案《用css的border属性实现三角》、《Tip中小三角的实现》。两种方法都是类似的方法：利用 border 来实现2个三角形将三角形叠在一起，实现一个类似的效果。今天在小鱼的博客上看到了据说的终极方案。貌似很强大的样子，推荐一下，实现原理是这样的：创建一个有 border 的四方形，用 CSS3 transfrom 作 45 度旋转利用 IE 的 matrix filter 实现 css3 transfrom 的兼容方案例子HTML：1<divclass="tips">2<divclass="tips-text" 阅读全文
摘要：
用户体验团队网站1、UCD大社区http://ucdchina.com/2、腾讯WSDhttp://wsd.tencent.com/3、腾讯CDChttp://cdc.tencent.com/4、腾讯ISDhttp://isd.tencent.com/5、淘宝UEDhttp://ued.taobao.com/6、著片会http://www.shupianhui.com/7、口啤UEDhttp://ued.koubei.com/8、阿里UEDhttp://www.aliued.cn/9、阿里妈妈UEDhttp://ued.alimama.com/10、163UEDhttp://www.ued16 阅读全文