Jensen Wu UED

原创 user agent stylesheet 处理

今天在处理项目页面样式，发现原本同样两个页面，但展示样式风格就是不一样，一个字体大一个小；有user agent stylesheet样子正常样子经过chrome查看样式，发现多出了一个user agent stylesheet样式，覆盖了原来样式经查询，原来user agent stylesheet是浏览器自带样式；通过与前面正常文件对比，发现自己

原创 各种JS模板引擎对比数据(高性能JavaScript模板引擎)

最近做了JS模板引擎测试，拿各个JS模板引擎在不同浏览器上去运行同一程序，下面是模板引擎测试数据；通过测试artTemplate、juicer与doT引擎模板整体性能要有绝对优势；js模板引擎JavaScript 模板引擎作为数据与界面分离工作中最重要一环，越来越受开发者关注，从而出现在各大型网站 Twitter、淘宝网、新浪浪微博、腾讯QQ空间、腾讯微博等。那么他们各自性能怎么样？请

原创 Dreamweaver正则表达式与示例

正则表达式是以文本描述字符组合的模式。在代码搜索中使用它们有助于描述一些概念，例如，以“var”开始的行以及包含数字的属性值。下表列出了在正则表达式中使用的特殊字符、其含义和用法示例。若要搜索包含该表中某一特殊字符的文本，请在特殊字符前面附加一个反斜杠，令其转义。例如，若要在some conditions apply*短语中搜索实际的星号，您的搜索模式应类似于：apply\*。如果您没有令星号转义，您将找到“apply”的所有匹配项（以及“appl”、“applyy”和“applyyy”的所有匹配项..

转载 世界杯主题QQtoy项目总结

作为世界上最盛大体育赛事之一的世界杯，是今夏最火最HIGH的话题。QQTOY也适时推出了世界杯主题系列公仔，这是我们第一次做大型主题类项目。– 设计先行，驱动产品 –一. TIMELINE这个时间点做什么好？这就是产品运营时间线的重要性。借之前做闪屏的经验，QQtoy团队同样会罗列每年的热点，节日，以便更有效的定位重点。而世界杯无疑是第一重要节点，项目需求也就自然产生。

转载 【设计经验传承】图标设计初阶要先型

UI最重要组建之一就是图标，随着扁平化设计的发展趋势，越来越注重图标的简洁与寓意表达，平面图标已占主导地位。每位设计师所处的阶段所关注的要点是不一样的，我把图标设计分为2个阶段–初阶与高阶，这样分是为了有步骤性的学习和进阶的加强，当然，能人的话一步到位，对于新人来讲会较难，需要实际工作中辅导与自己经验总结。我不会华丽高大尚的语言，但是我可以分享一些实实在在的基础方法，也是这几年会给带的学生反复必讲

转载 数据分析基本思路及手法

数据分析，是产品运营极具战略意义的一环；从宏观到微观分析，通过表层数据挖掘产品问题，是每个运营人的必修课。首先，我们来看比较常见的分析方法：5W2H分析法：What（用户要什么？）Why（为什么要？）Where（从哪儿得到？）When（我们什么时候做？）Who（对谁做？）Howmuch（给多少？）How（怎么做？）PS：（what）用户要极品装备！（why）因为他们要增强战

转载 [图]小米内部培训PPT曝光：这待遇真不错

转载 用户体验设计师常用的21款工具和应用

工作在用户体验团队中会经常需要用到一些在线工具。对于UX的世界，不管你是一个新手还是一个经验丰富的老鸟，你都不应该停止寻找一些会让你的工作变得轻松的工具。在这篇文章中，我们为你准备了21款有用户体验设计的相关工具。其中一些工具你可能已经使用过了，但是我们希望通过这篇文章给你带来一些新的感受，我把这些工具分成了三类：用户调查/测试/回馈原型 / 图表协作用户调查/

转载 情境化——让活动页面击中用户

背景：市面上为大众所喜闻乐见的活动专题页面基本是：以漂亮精美有视觉张力的人物及卡通形象做视觉主体+有效衬托主题的场景元素做渲染背景，结合活动的主题、操作详情等等元素，达成体验上清晰便捷、视觉上有冲击力和感染力的页面，像这些：问题：这类的页面往往乍一看很吸引，但没有太多内在力量，并且我本身负责的项目之前以红钻营收为主，常面临素材缺失的问题（受红钻特性所限，QQ

转载 浅谈服务设计

前言做交互设计也有好几个年头了，最近一直在思考一个问题，我们这些俗称线框仔的交互设计师，如何保持自己的竞争力，我们的未来会是怎样的？在互联网公司里担任交互设计师，往往只是一个项目里的螺丝钉，工作内容不外乎分析需求、分析用户、画线框图、做原型demo，在web时代如此，在移动互联时代亦是如此，我们往往只是着眼于屏幕上的信息与用户进行交互，从而容易陷入一个怪圈：交互设计师就是捣鼓U

转载 产品经理入门到大神的资料全推荐

菁菁小提示：谢谢晓生的推荐书单，有了它再也不用去问产品经理应该看那些书籍和浏览那些网站了，需要的伙伴们记得打包拎回家。。。 大约两年前整理的资料库，有一段时间关闭了这个页面。发现很多新人对这类资料有很强的需求，所以开始重新整理已知的资料，并持续更新，希望对大家有所帮助。这些资料都是自己阅读过的，并认为有阅读价值的资料，适合移动互联网的界面设计师和产品经理，并加上了阅读的难度

转载 嗨！菜鸟~我们来谈谈你的新工作（文档与思维篇）

写给我的第一任助理是一个菜鸟产品经理写给她的菜鸟产品助理的入职培训教材，教材分为“习惯”“流程”“文档”“产品思维”等几个部分。 文档篇 如果我给你一篇文档，让你按照我的格式来写。而实际上你并不明白为什么要写这些内容？为什么按照这个顺序来写？这个内容是不是真的需要？在这样的情况下，你可能会做一些毫无意义的文字堆砌浪费珍贵的时间，或者总是无法确定自己的文字是不

转载 发布产品并了解用户行为（2）

4.案例研究：烹饪食谱应用程序我们已经到达了用户体验流程的最后一部分，现在让我们看一个开发食谱应用程序的案例研究。游戏名称应用程序背后最初的想法是创建一个数字版本的珍贵的家庭食谱剪贴簿，用来维护家庭的历史和传统。这就促成了这个名字的出现——家庭的最爱，就像在图9中的线框图所示——这个名字我们是用了很长一段时间。图9. 私人化，但缺少的标志性内容在我们

转载 发布产品并了解用户行为（1）

本文摘自《Killer UX Design》第八章，作者：Jodie Moule，由江南大学设计学院研究生刘兆峰翻译。本章主要介绍了产品发布上线前的一些注意事项，还包括为了达成重塑用户行为这一目标，后期的版本迭代更新和用户反馈测试中需要做哪些研究，交互文档的整理留存和微细节处理等内容。在项目初期，我们从习惯商业角度来理解设计问题，从而开始推动项目展开。然后我们去到产品实际使用场景中验证自

转载 制定可用性测试计划（2）

列出任务清单任务清单包含被试在测试中要完成的所有任务。清单包括在使用产品、文档等过程中进行的常规任务。任务设计经历两个阶段。早期阶段，任务清单是为项目团队成员，而不是真实用户设计的。你只需要提供尽可能详实的细节，以便测试计划的审阅者可以评估是否任务是正确且可执行的。然后，才是将任务扩展为丰富的任务场景脚本，供被试使用。场景脚本应该有现实细节和情境，帮助被试无需主持人的介入就

转载 制定可用性测试计划（1）

本文摘自《Handbook of Usability Testing》，作者：Jeffrey Rubin和Dana Chisnell，由天翼阅读用户研究员张晓雯翻译。测试计划是整个可用性测试的基石。计划应当阐明如何测试，何时、何地，由谁来推动测试，为何测试以及测试内容。不过，有时在项目期限临近的巨大压力下，你可能不打算写一份详尽的测试计划。毕竟，你认为自己对即将进行的测试已了然于心，不必再

转载 为儿童设计

获得作者 @爱奇艺_晓生 许可，小编终于能在儿童节把这篇为儿童而设计推荐给大家。本文转载自爱奇艺高级设计经理晓生的博客http://daichuanqing.com，里面干货超多，大家也可以关注他的微信公众号：Appdesign  作者：晓生原文：http://daichuanqing.com/index.php/archives/4994公众号：A

转载 App动画全集

BaseAnimation基于开源的APP,致力于收集各种动画效果

转载 浅谈iOS和Android的产品交互设计：iPhone和Android的控件对比

感谢沙洋信息网的投递新闻来源:盆地观察开发者在产品上同时覆盖iOS平台和Android平台时，则会遇到同一个功能在不同平台中界面和交互如何展现的问题。了解两个平台间的控件对应关系和异同点，对同时面向两个平台的产品和交互设计是有帮助的。一、前言开发者在产品上同时覆盖iOS平台和Android平台时，则会遇到同一个功能在不同平台中界面和交互如何展现的问题。了解两个平

转载 用户体验的5个注意事项

第一，用户体验的核心是用户需求。一是用户体验的核心，我们都是设计师，是不是设计？很遗憾，第一核心的不是设计，用户体验最基础的是用户需求，如果脱离了用户需求，一个设计再漂亮的产品，是无法和用户共鸣，我在外国转了一圈，很多大学生创意团队做的很多东西，我举个例子，在过去两年一个曾经很热的概念LBS，还有一个概念叫O2O，大家看到什么成功的产品了吗？没有，很简单，童话故事大全用户选择一个产品，你们

转载 网站建设美观性展示的五点原则

互联网是信息的海洋，内容包罗万象，形式千变万化，容易使人产生视觉疲劳，要抓住眼球越来越难。赏心悦目、富有创意的网站才能让人流连忘返。网站的美观性原则主要可以从六大方面来体现； 1：有创意。好的电子化形象展示，必须有好的创意。具体而言，设计思路要与内容相吻合，能体现企业或产品形象中的某一因素，立新意，原创性强，设计内涵深刻、清晰、独特，具有很强的现代感。要注意创意不是单纯突出那些无意义的

转载 【开源推荐】JavaScript开发工具大合集

本文为大家整理了一系列关于JavaScript的常用工具，包括常用工具、前端和后端工具，从测试到构建，内容丰富，值得收藏。下面是根据推荐工具整理的思维导图。点此看大图常规工具脚手架工具 Yeoman：它旨在为开发者提供一系列健壮的工具、程序库和工作流，帮助开发者快速构建漂亮的Web应用。构建工具（自动） Grunt.js：生态强大，发展速度快

转载 如何用 Chrome for Android 做远程遥控 debugging

Chrome for Android有一个针对开发者很贴心的功能，就是远程遥控 debugging，在桌面电脑上为移动浏览器进行debug。首先你需要在电脑上安装Android SDK和Chrome桌面浏览器，并将移动设备设置为开发模式，通过USB线让Android手机与电脑连接，打开Android Debug Bridge (adb)，并在手机的Chrome里打开Settings - Und

转载 浅谈Lean UX：我们到底该怎么设计？

传统的UX和产品设计讲究的是分工和专业性，但随着移动化的推进，设计成功与否不再是由产品经理、设计师决定，也不是死板地按照设计需求清单来，而是直接由用户决定。设计需要持续迭代改善，也需要用户的参与。在CMDN俱乐部第28期活动中，ThoughtWorks前端工程师张玳以“精益式用户体验设计（Lean UX）”为演讲主题，将精益创业与用户体验设计相结合，详解UX精益之道。图：Tho

转载 findbugs清理总结

findbugs警告26个。主要有以下9类问题。 1、Bug: Hard coded reference to an absolute pathnameBUG描述：This code constructs a File object using a hard coded to an absolute pathname（此代码包含文件对象为一个绝对路径名） 问

原创 JScript调试程序 错误

今天在测试上传材料，点击添加按钮总是报错，提示Jscript联调程序 问题；最终发现问题在a标签 ，onClick事件上。原代码：elementStr = elementStr+ "+ indexInArray+ "' style='left:"+ (parseInt(valueOfElement.orgin_x) / _C)+ "px;top:"+ (parseI

转载 JS快速获取图片宽高的方法

快速获取图片的宽高其实是为了预先做好排版样式布局做准备，通过快速获取图片宽高的方法比onload方法要节省很多时间，甚至一分钟以上都有可能，并且这种方法适用主流浏览器包括IE低版本浏览器。我们一步一步进入这个过程。一、简陋的获取图片方式1234567891011

转载 百度，淘宝，腾讯三大巨头HTML页面规范分解

【兼容html5方案】百度贴吧，百度图片的实现[if lt IE 9]>(function(){ var tags = ['header','footer','figure','figcaption','details','summary','hgroup','nav','aside','article','section','mark','abbr','met

转载 用户流失原因调研四步经

用户流失原因调研四步经曹爷 / 用户研究 / 2013.07.0326　　用户流失原因调研时不知如何入手？　　不知如何才能找到用户真正的流失原因？　　不知如何把调研结果应用到产品改善中？　　到底要怎样才能做好用户流失原因研究呢？　　在做了一些用户流失原因调研项目后，笔者总结了用户流失原因调研四步经。  第一步：

转载 五招加速网页响应时间（2/2）

2. 使用CSS精灵减少HTTP请求CSS Sprites 可能是自从Tesla发明了电流以后最cool的事情。呃，我的意思是爱迪生。嗯，不大，但是非常紧凑。CSS sprites 可以通过合并你的css背景图片，减少页面向服务的HTTP请求，轻松的降低页面的加载时间。许多教程只是教你如何使用CSS精灵制作导航，我要说的是使用它制作整个网站的用户界面。首先，

转载 五招加速网页响应时间(1/2)

网页尽可能的快速加载对网站非常重要；用户希望快速的查看他们想要看的页面，假如你不能满足他们，他们就会另寻它处。在这篇文章中，你会看到五种为你的网页加速的简单而有效的技术的相关讨论。1. 使用Yslow概览与测量网站加载时间在决定什么出问题之前，知道网站的加载时间是第一步。它也能让你知道你是否需要为网站加速进行更改。在我们开始之前，如果你还没有安装YSlow， 请安装

转载 文字适度阅读的宽度或者字数

先看几个数据。。一大堆文字滴，不管人家是不是故意的，字数还是这样：news.163.cn：14px，39个中文字符news.sina.com.cn：14px，42个中文字符news.sohu.com：14px，38个中文字符news.qq.com：14px，40个中文字符搜索引擎的搜索结果google：41 *3 ，宽度34em*16px=544px，在第39/40个字符有插上

原创 IOS开发库

IOS开发库: http://developer.apple.com/library/ios/navigation/

转载 解决iframe，div在移动设备上实现局部刷新的方法

iOS系统（iPad、iPhone）不支持iframe或div出现滚动条，这个问题困扰了我好久，终于在网上发现了解决办法。iScroll.js，一个纯js文件，用于解决上述问题。这里有几种不同的特效：Pinch / ZoomPull up/down to refreshImproved speed and momentumSnap to elementCustomiza

转载 专家购买二手房注意事项 看好这九条买房不吃亏

1、核实卖方的身份。如果是个人，看他的身份证；如果是单位，到工商局看它的档案资料；如果卖方有代理人，看他有没有经过公证的授权委托书。　　2、到房管局查验卖方的房产证。看该房屋是否有房屋共有权人，如果房屋为多人共有，则须卖房人提供所有共有人的身份证件及同意出卖房屋的书面文件；如是夫妻共有财产，是否经过卖方配偶的书面同意；如果房屋已出租，则须卖房人提供承租人同意出售的书面意见；如果房屋已被抵押

原创 jq 获取 iframe 父目录高度与宽度

$(window.parent.document).find("#Docpreview").height();$(window.parent.document).find("#Docpreview").width();  var s = "网页可见区域宽 ："+ document.body.clientWidth;  s += "\r\n网页可见区域高："+ docum

转载 11 个处理触摸事件和多点触摸的 JS 库

触摸屏是现在所有智能手机的标配，还包括各种平板设备，而且很多桌面也慢慢在开始支持触摸操作。要开发支持触摸屏设备的 Web 应用，我们需要借助浏览器的触摸事件来实线。下图是各种触摸事件说明：本文我们介绍 11 个用来处理触摸事件以及支持多点触摸的 JS 库：QUO JS Events: Touch, Tap, Double tap, Hold, Fingers,

转载 测试工具

JavaScript测试库：Yahoo! UI Library: YUI TestJavaScript测试一件很麻烦的事情，现在有了JavaScriptMVC测试插件Yahoo! UI Library: YUI Test，能够让你模范大部分DOM动作，比如写，拖拽，比如模范AJAX响应，并且能够使用断言(assertions)。它能够象函数一样运行，并且能够在不同的console窗口进行集

转载 HTTP 协议详解

作者: 小坦克  来源: 博客园  发布时间: 2012-02-14 13:32  阅读: 15351 次  推荐: 11   原文链接   [收藏]  　　相关文章：HTTP 协议之压缩　　当今web程序的开发技术真是百家争鸣，ASP.NET, PHP, JSP，Perl, AJAX 等等。 无论Web技术在未来如何发展，理解Web程序之间通信的基本协议相当重要， 因为它

转载 CSS技巧：清理无用的CSS样式

我们在编写CSS样式的时候，往往或遭遇CSS样式的修改或者界面设计的变更，页面的CSS在经历几个版本的修改之后，可能有些样式已经用不到了，或许将某些样式更名了而原来的忘了删除，总之页面中可能存在着一些无用的样式。这些无用的浪费了一些服务器空间和带宽消耗，也会增大我们的维护成本。那么有没有一些办法来清理那些无用的样式呢？今天就让我们来了解一下几个比较有用的工具。　　一、Dust-Me sel