一直觉得30岁之前要努力改变现状，越晚，惯性越大，改变越难。
也正好有这么个好的创业机会，有这几个志同道合的好友。
在这个浮躁的时代，有那么一群能沉下心来做事的好友，能为同个目标共同拼搏，真是很不容易。

带着家人朋友的支持与期许，我们在年中扯旗上路。
作坊虽小，事情虽多，却也是忙苦并快乐着。
创业之艰辛于我们来说并不在体力精神，在于不断试错，调整方向，在于匮乏可用的资源。

人人都有压力，巴士大叔也不例外。
也许国内环境真已不适合草根起家，或者选择的方向有偏差，
在漆黑的下一个弯口，我们选择黯然离场。
但我们深知，内心留存着一团火，
在未来某一刻，它终会光亮敞透。

转变，从设计师到码农。
转变，从执行到业务模式的探索。
转变，从交付产品到持续交付运营。

2011，来的飞快，去的飞快。
感谢一路相伴的朋友，感谢家人，这一年的经历，值得好好回味。

前段时间的成果，伙同产品、设计一起加工出来的demo

webgl，canvas，svg，各种前端技术能用上的，都用上了

音乐 Tydi –  The Camera Doesnt Lie But You Do (Original Mix)

线上地址 -< 点此，用chrome观看

StarGate最初的功能是要同步腾讯微博/新浪微博，实现到一半时想法有变，大概因为最近视觉信息的内容看了不少，手痒想实践一把。同步的功能后面会陆续添加，以及发微博的时间/节点/传播途径等等，想法很多，逐步实现。

作为一个视觉控，自然在表现上会想要雕琢一番，正好前段时间研究的webgl可以派上用场。表现层使用了three.js，three.js是一个轻量级的webgl框架，有多种渲染引擎，webgl，canvas，svg。前段时间很火的webgl mv 3 black heart就使用了three做为骨架来构建场景。

在后端，数据库使用了天生和nodejs很搭的mongodb，用mongoose + express搭建后端应用，再用socket.io传输数据，这样，一个应用就跑起来了。。。

附上视频：

p>{Click }+a{here}+{ to continue}

展开后就是

<p>Click <a href=”">here</a> to continue</p>

更多的更新内容请看0.7 release notes，这里还有一个web版，可以体验下zen coding的强大功能。

最后说说我的页面制作流程

1. 在Espresso中搭建html，这个时候zen coding可以帮上大忙
2. 编写css，还原设计稿，Espresso的实时预览功能会使这个过程轻快许多，在“所见即所得”的情况下做页面修整是非常舒服的
3. 页面搭建完毕后转战Textmate，在神器中完成js的编写，后期调试也都在Textmate中完成，借助jsLint和jQuery bundle

过程看起来复杂了些，为什么不在一个工具中完成所有事情呢？我的答案是前端的活杂，很难找到一个能囊括所有流程的编辑器，要有，也是各项表现平平。不如把各阶段分解一下，选择最合适的工具应对，乘波逐浪，岂不快哉！

废话不多说，直接上代码

// shim layer with setTimeout fallback
    window.requestAnimFrame = (function(){
      return  window.requestAnimationFrame       ||
              window.webkitRequestAnimationFrame ||
              window.mozRequestAnimationFrame    ||
              window.oRequestAnimationFrame      ||
              window.msRequestAnimationFrame     ||
              function(/* function */ callback, /* DOMElement */ element){
                window.setTimeout(callback, 1000 / 60);
              };
    })();

    // usage:
    // instead of setInterval(render, 16) ....

    (function animloop(){
      render();
      requestAnimFrame(animloop, element);
    })();

参考： requestAnimationFrame for smart animating

Things是我一直在Mac上使用的GTD软件，相当好用。不过可惜的是，它不支持多台Mac的同步，所以只好自己来搞一个简单的同步+备份。当然云端同步的功能开发者貌似也是在开发中，也许不久之后就能用上。

Things的数据保存在  <your home folder>/Library/Application Support/Cultured Code/Things/database.xml

用google storage来备份那是相当方便了。。附上things的备份还原faq

gsutil [-d][-D] [-h header]… [command args...]

1. -d [option] http请求详细信息
2. -h [option] http头，设置Content-Type等，具体参照http协议。

cp [-a canned_acl] [-R] [-t] [-z extensions] uri… dst_uri –用于上传/下载文件

• -a    acl有4个选项，分别为[public-read]、[public-read-write]、[authenticated-read]、[bucket-owner-read]、 [bucket-owner-full-control]
• -R   把该目录及其子目录所有文件都上传到gs
• -z     gzip方式压缩(主要用于html、txt、css等文件)

public-read表示权限为任何人可读(默认不可读)。public-read-write 可读可写，其他的也不用说了吧？演示：

gsutil cp -a public-read demo.html   gs://buckets    –将demo.html上传，并权限为所有人可读.

gsutil cp -a public-read-write demo.html     gs://buckets     —同理

gsutil cp -a public-read -R ./images  gs://buckets   –把当前的images目录及其子目录下所有文件上传，并权限为所有认可读。

下载和上传没什么两样，就是本都目录和gs目录调换一下就行了。

cp  gs://buckets/img.jpg   file://dir cp参数也支持用正则表达式，如
gsutil cp gs://mybucket/[a-f]*.doc localdir

注意：cp命令不能以gsutil cp img.jpg   gs://bucket/img/img.jpg  这样的方式上传，即不能直接上传到bucket的某个文件夹。要实现这个功能，必须在本地创建一个和服务器一样的文件夹，再进行上传，如bucket有 个img的文件夹，你就在本地创建一个img，然后按以下方式更新文件

gsutil cp ./img/img.jpg  gs://bucket/img/img.jpg

一定要以上面的方式，最后的img.jpg可以任意改名，但一定要有。cp命令可以用-a参数。

如果你在上传的时候忘记用-a参数设置权限，之后可以用setacl 命令来修改，具体为

setacl acl_name uri… 如

setacl  public-read gs://bluckets/img.jpg

其他基本的可以用 gsutil –help 来查看帮助

用法如下：

参数说明：
sURL
必选参数，类型：字符串。用来指定对话框要显示的文档的URL。
vArguments
可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures
可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号“;”隔开。
dialogHeight 对话框高度，不小于１００px，ＩＥ４中dialogHeight 和 dialogWidth 默认的单位是em，而ＩＥ５中是px，为方便其见，在定义modal方式的对话框时，用px做单位。
dialogWidth: 对话框宽度。
dialogLeft: 距离桌面左的距离。
dialogTop: 离桌面上的距离。
center: {yes | no | 1 | 0 }：窗口是否居中，默认yes，但仍可以指定高度和宽度。
help: {yes | no | 1 | 0 }：是否显示帮助按钮，默认yes。
resizable: {yes | no | 1 | 0 } ［ＩＥ５＋］：是否可被改变大小。默认no。
status: {yes | no | 1 | 0 } ［IE5+］：是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
scroll:{ yes | no | 1 | 0 | on | off }：指明对话框是否显示滚动条。默认为yes。

可以在传vArguments的时候传父页面的window对象进去，这样在子页面也能调用父页面的全局方法，例如关闭时刷新父页面的指定区域。vReturnValue是子页面返回值。

具体使用时传入了父页面的window，结果f5刷新的时候发现被刷掉了，还是老老实实拼了url传过去，处理完成之后用vReturnValue回传结果。

opengl红宝书看完,就开始练手了,processing真是很方便的一个工具,不用太多纠结语言的一些特性,用来作快速prototype再合适不过了,还有众多强大的第三方类库.尤其是toxiclibs,几乎所有需要的东西,都方便的提供了,值得好好研究.

回到opengl上,Vertex Buffer Object看起来简单,第一次编写的时候还是挺费劲的,好在processing论坛里有着众多的资源,我着的道,前人早已经提出来过,只要放狗搜就有答案.这次还没有用到纹理,法相和光照,3d缺了这些怎么可以.还有残影的绘制,也许可以用一下glsl.

Muse，最近看过的视频中最有印象的一个，有种梦境的梦幻感，音乐也很赞。

网站field.io，需翻墙。flickr上也有一些视频和往期project的截图。

单位球空间到模型空间转换可以计算出旋转轴和旋转角度，从而得到变换矩阵。该转换可以通过四元数来实现。一个联合的四元数q=[v, w]=[x, y, z, w]由两个部分组成，一个是数量w，它等于cosθ/2，其中θ是旋转的角度，一个是向量v，它等于沿着旋转轴的向量的sinθ/2倍。两个四元数运算的结果就是它们旋转组合的结果，这样旋转组合操作就可以采用四元数叉乘来表示。ArcBall获取转换四元数的计算公式如下：

[q.x, q.y, q.z] = V3_Cross[p0, p1];
q.w = V3_Dot[p0, p1];
TM = QuatToMatrix(q);

其中q表示四元数，p0和p1表示旋转的起始点和结束点（可以通过转换一获得）；V3_Cross表示向量的叉积，它记录了旋转的轴的方向；V3_Dot表示向量的点积，它记录了旋转的角度；TM表示旋转矩阵，QuatToMatrix把四元数转换为矩阵。