在塞班时代对于网络我们的喜好可以很纯粹，就像这款应用“天天动听”几乎所有玩塞班系统都会安装一款音乐播放器。因为喜欢所以去学习xml设计了这款播放器的主题并实现它！
CSS清除浮动详细方法
浮动会使当前标签产生向上浮的效果，同时会影响到前后标签、父级标签的位置及 width height 属性。而且同样的代码，在各种浏览器中显示效果也有可能不相同，这样让清除浮动更难了。解决浮动引起的问题有多种方法，但有些方法在浏览器兼容性方面还有问题。
下面总结8种清除浮动的方法（测试已通过 ie chrome firefox opera，后面三种方法只做了解就可以了）：
1，父级div定义 height
<style type=”text/css”>
.div1{background:#000080;border:1px solid red;/*解决代码*/height:200px;}
.div2{background:#800080;border:1px solid red;height:100px;margin-top:10px}
.left{float:left;width:20%;height:200px;background:#DDD}
.right{float:right;width:30%;height:80px;background:#DDD}
</style>
<div class=”div1″>
<div class=”left”>Left</div>
<div class=”right”>Right</div>
</div>
<div class=”div2″>
div2
</div>
原理：父级div手动定义height，就解决了父级div无法自动获取到高度的问题。
优点：简单、代码少、容易掌握
缺点：只适合高度固定的布局，要给出精确的高度，如果高度和父级div不一样时，会产生问题
建议：不推荐使用，只建议高度固定的布局时使用 Continue reading
Material Design 中关于动效的设计
随着移动设备的发展，关于界面视觉元素的动效设计被人们越来越关注，好的动效设计能够给用户带来感知上的亲切与真实，在Google的Material Design中对设计原则是这样描叙的：“实体感就是（通过设计方式来表达）隐喻，通过构建系统化的动效和空间合理化利用，并将两个理念合二为一，构成了实体隐喻。”
设计有意义的动画效果
动画效果(简称动效)可以有效地暗示、指引用户。动效的设计要根据用户行为而定，能够改变整体设计的触感。
动效应当在独立的场景呈现。通过动效，让物体的变化以更连续、更平滑的方式呈现给用户，让用户能够充分知晓所发生的变化。
动效应该是有意义的、合理的，动效的目的是为了吸引用户的注意力，以及维持整个系统的连续性体验。动效反馈需细腻、清爽。转场动效需高效、明晰。
真实的动作
感知一个物体有形的部分可以帮助我们理解如何去控制它。观察一个物理的运动可以告诉我们它轻还是重，柔性还是刚性，小还是大。在material design设计规范中，动作不止是呈现着它美丽的一面，它还意味着在空间中的关系、功能以及在整个系统中的趋势。
体积和重量
物理世界中物体拥有质量，所以只有当施加给它们力量的时候才会移动，因此，物体没法在瞬间开始或者结束动作。动画突然开始或者停止，或者在运动时突兀的变化方向，都会使用户感到意外和不和谐的干扰。
最佳实践
material design规范中，一个重要方面在于如何在“动作”完整的展现物体的各个真实的特性，譬如优雅、简约、美观和神奇的无缝的用户体验，下面的动画将帮助大家理解这些理念。
要：迅速的加速和平滑的减速会感到自然和愉快
不要：线性动作会感到机械，在结束和开始的时候生硬的速度变化意味着物体突然开始运动或停止，这是不贴合现实的。
特殊情况：进入和退出的场景
当一个物体进入这个场景时，请确保它在最高速度下移动，这个行为模拟了自然移动：一个人进入场景的时候，并不是从场景的边缘开始走入的，而是从更远的地方。当然，一个物体退出这个场景时，需要维持它的速度，缓慢的离开场景，逐渐的进入和缓慢的离开会把用户的注意力吸引到这个动作上，在大多数情况下，这是你希望的效果。
要：小球在最大的速度下进入和退出场景，创造了一个确信的过渡效果。
不要：快速进入和缓慢离开，不要让用户因速度变化转移注意力。
需要做的调整
不是所有物体的移动方式是相同的，轻的/小的物体可能会更快的加速和减速，因为它们质量比较小，所以只需要施加给他们较少的力就可以。大的/重的物体可能花需要更多的时间来到达他的最高速度或者回到停止状态。仔细琢磨如何将他们的动作应用到你的应用的UI元素中。
感谢：翻译：7heaven 校对：KongZhen
闲时绘制的一套手机图标（它将应用在一套完整的SO PHONE）
智能手表用户界面
让互联网更好的服务于生活
随着互联网的发展我们从最初的PC到移动手持设备再到我们所畅想的智能设备时代，我们经历互联网信息获取到信息互动再到信息生活，无不一次改变着我们的生活方式。
手表作为我们最传统也是最为基础的信息载体，他有着最为便捷与象征意义的优点，更为人们所喜爱与习惯佩戴！那么在接下来的智能互联网设备兴起时代，智能手表又将给我们的生活带来怎样的期许呢？我们与大家同样期待。。。
智能手表的用户界面设计受限屏幕展示空间的局限不同于PC与移动设备，在更小的空间展示无限的信息与交互需要我们不断探索更为人性化的行为引导与设计！
我们如何去定义和设计一款智能手表它该具备那些功能？
我们起初思考的是我们为什么需要它，哪些人需要它，它又将给我们带来什么！
首先我们从手表最为原始的功能与使用场景思考，手表是时间信息的载体，人们通过手表获取时间信息从而决定行为下一步做什么，是等待还是计划还是取消。。。等等，在这些场景中我们了解到人们的行为驱动离不开时间。而传统的手表时间信息是被动的，也就是说只有当我们主动获取到时间才能断定当前或下一步的行为，那么我们就在思考是否可以让时间更加智能与主动的驱动我们的行为呢?那么我们首先要做的就是强大智能提醒功能！
提醒与计划安排日历等等这些功能的工具，在手机上已经非常成熟与普遍，但我们认为这些功能在手表上更为合适，因为它方便快捷更接近我们生活场景。
JavaScript 获取浏览器窗口的大小
获取窗口大小
- 要得到窗口的尺寸，对于不同的浏览器，需要使用不同的属性和方法：若要检测窗口的真实尺寸，在Netscape下需要使用Window的属性；在IE下需要深入Document内部对body进行检测；在DOM环境下，若要得到窗口的尺寸，需要注意根元素<html>的尺寸，而不是<body>元素。
- Window对象的innerWidth属性包含当前窗口的内部宽度。Window对象的innerHeight属性包含当前窗口的内部高度。
- Document对象的body属性对应HTML文档的<body>标签。Document对象的documentElement属性则表示 HTML文档的根节点。
- document.body.clientHeight表示HTML文档所在窗口的当前高度。document.body. clientWidth表示HTML文档所在窗口的当前宽度。
JavaScript Code
var winWidth = 0;
var winHeight = 0;
function findDimensions() //函数：获取尺寸
{
// 获取窗口宽度
if (window.innerWidth)
winWidth = window.innerWidth;
else if ((document.body) && (document.body.clientWidth))
winWidth = document.body.clientWidth;
// 获取窗口高度
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
// 通过深入Document内部对body进行检测，获取窗口大小
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth)
{
winHeight = document.documentElement.clientHeight;
winWidth = document.documentElement.clientWidth;
}
// 结果输出至两个文本框
document.form1.availHeight.value= winHeight;
document.form1.availWidth.value= winWidth;
}
findDimensions(); // 调用函数，获取数值
window.onresize=findDimensions;
实现步骤
- 程序首先建立一个表单，包含两个文本框，用于显示窗口当前的宽度和高度，并且，其数值会随窗口大小的改变而变化。
- 在随后的JavaScript代码中，首先定义了两个变量winWidth和winHeight，用于保存窗口的高度值和宽度值。
- 然后，在函数findDimensions ( )中，使用window.innerHeight和window.innerWidth得到窗口的高度和宽度，并将二者保存在前述两个变量中。
- 再通过深入Document内部对body进行检测，获取窗口大小，并存储在前述两个变量中。
- 在函数的最后，通过按名称访问表单元素，结果输出至两个文本框。
- 在JavaScript代码的最后，通过调用findDimensions ( )函数，完成整个操作。
桌面日历用户界面
一套ICON应用于智能手表用户界面
UI/WEB设计师的必备站点聚合
1.Awwwards 最佳网页设计展示平台
Awwwards汇集了来自世界各地的网页设计师，在这里他们分享设计经验和网页设计知识，探索Web设计的最高境界，倡导网页设计要实用、新颖、直观，为用户带来最独特的个性化体验。
2.Dribbble 你正在创做什么
Dribbble是一个面向创作家、艺术工作者、设计师等创意类作品的人群，提供作品在线服务，供网友在线查看已经完成的作品或者正在创作的作品的交流网站。
3.Iconfinder icon搜索引擎与买卖市场
Iconfinder提供数百万计漂亮图标供设计、开发、创意等专业人士使用，Iconfinder目前拥有全世界最大的icon库，以及icon买卖市场！
4.ZCOOL 站酷设计师互动平台
设计师互动与设计素材分享平台。聚集了中国大部分的专业设计师、插画师、摄影师，艺术院校师生等创意人群是中国目前最活跃的原创设计交流平台。
5.UI.cn 专业的界面设计师交流、学习、展示平台
UI中国，前身为iconfans.com。是中国最大的UI设计师聚集地，会员均为一线UI设计师，覆盖主流互联网公司。
开篇
UIZHI将以互联网产品服务设计为中心，围绕个人兴趣爱好分享产品设计、经验、以及相关技术为主！