Gonna Pivot

I upgraded to Yosemite in the day when Apple release its first DP, on my primary laptop unfortunately. I have to say the hand-off feature is really impressive, but in the meanwhile I was suffering from frequent system crashes.

When I decided to downgrade my Macbook to Mavericks, I find out it's not that easy.

After some googling I found out a painless way to do this.

Step 1. Backup your system

At the very first, make sure you have already backup your documents by Time Machine.

Step 2. Get Mac App Store ready

Launch the Mac App Store, navigate to page of OS X Mavericks. DO NOT click the download button here, or you'll be prompt kinda "OS X 10.10 has already been installed.". Just leave the window open and we'll get back to here very soon.

Setp 3. Update the system version number

Then open this file /System/Library/CoreServices/SystemVersion.plist using XCode (or other apps which could edit a plist file, like TextMate). Open it and find two string of current version number 10.10. Cause we're gonna to downgrade to 10.9 Mavericks, to ensure the download could start we change it to 10.8.

Save the changes and enter your password when you see the dialog.

Step 4. Download OS X Mavericks & install

Now get back to Mac App Store, click the download button of Mavericks. After entering your Apple ID it would start downloading. Just wait it to finish then the installer will automatically start.

Now the only thing you need to do is to complete the install process as usually. All your settings, documents will remain in your system.

昨天，Microsoft 终于放出了 Office for iPad，可爱的是 Cook 在 twitter 上欢迎它们来到 App Store （废话，App Store 能从中间抽30%，一句话能多赚多少钱）。

言归正传，我个人是非常看好 Microsoft 开始走出这一步的，从 Office 365 开始。

Office 365 是什么？

在以前，Microsoft 在我看来是一家非常非常“传统”的软件公司，按部就班地开发、销售软件产品，提供企业咨询服务。 但是在互联网的时代， 面对企业日新月异的需求变化，尤其是当老古董们走出办公室，新生代开始用更新潮工具的时候，这家老牌软件公司将会面临更加巨大的压力：

• 软件授权费用真心不便宜
• 年轻人更愿意尝试新的技术
• 何况很多新服务、新平台都是 FREE，连 Cook 都把 iWorks 免费了
• 洗脑术 Remote - Office not Required

所以，Microsoft 终于走出了第一步，推出了 Office 365。粗略来说，Office 365 相对于原来独立销售的 Office 软件，差别在以下三方面

1. 一概以往卖软件的模式，改为订阅服务，例如家庭版每月付$10，就可以在5台电脑上使用 Office 软件，对个人用户来说这个成本降低太多了
2. 从单体软件向云端转移，Office 软件有类似 Google Docs 的浏览器版本，有 SkyDrive 提供云端存储
3. 协作。这点估计很多人都不知道，以前的 SharePoint 非常难用，但是 Office 365 （Office 2013）开始越来越不错了

最大的改变：SaaS

没错，微软现在可以称得上是互联网公司了，软件即服务，通过订阅和云端的结合，将现金牛转移到了互联网阵地。

这点也是我最看好这次变化的原因。

考虑以下，Microsoft 现有的用户群体，都是办公室用户，以及即将进入办公室的新生代。诚然新冒出来的互联网企业很多都不会采用 Office 作为日常办公软件，但是更多的公司仍然是这套软件的忠实用户（无论正版盗版），这是不争的事实。面对新生代逐渐取代老一代的趋势，企业主想要再利用一个 Windows 平台，将员工绑在办公室的想法已经收到越来越多的挑战，在软件成本、员工成本上看不见地水涨船高。

但是 Office 365，加上 Office for iPad，和即将推出的 Office for Mac，情况越来越不同了，这是一个非常好的信号，这个老牌软件巨擎开始看重在新生群体中的发展。通过 Office 365 的改变

1. 用户的使用成本直接降低，大企业有大企业授权，但是中小企业无疑使用成本降低了很多；这个变化也通过个人版惠及到个人家庭用户
2. 终于 Office 套件不再限定在 Windows 平台上，也进入了全世界最好的移动平台 iOS。很多年轻用户会非常喜欢这一点，无论是在 Mac 上使用新版的 Office，还是在 iPad 上
3. 移动办公将会是未来的趋势，将软件和自身的平台解绑，看似挥刀自宫，实则是解开了多年的枷锁，给用户更多的（部分的）选择

无论对于雇员还是企业主，成本降低，使用便利，如果软件还不是那么差，很多人就会没有必要改变自己多年的习惯，去用其他的软件或者服务。

到底用 Office 还是用其他，这不是个选择题

我不认为 OneNote 在 Mac App Store 上获得首页推荐是公关因素，而是这个软件确实出彩。可以看出来 Microsoft 这次在软件设计上下了很大的功夫。Office for iPad 我还没有深入去用，但是看放出来的资讯和评价，应该也不会太差。

而且，Office 到底好不好，这并不是一个选择题。

你们可能会喷，用其他软件去比较，例如 iWork 更加便利人性，EverNote 功能更加丰富，Google Docs 协作 Office 根本不能比，等等。但是试问一下，微软的根基是什么？是他们的商业用户。

这部分群体，他们有的没有能力去使用新的软件和服务，有的是受制于工作的环境，也有的就是 Office 的死忠，对他们来说，完全没有必要迁移到另外一个不熟悉的环境。

It's just a job, and it's not the whole life. 这是这个群体和我们最大的不同。他们不会断了路由器就要死要活，他们不会不断尝鲜，去玩新的服务和软件。他们所需要的，只是用他们最顺手的工具，完成他们的工作。这是 Office。

而我们所需要的，并不是要找一个 Office 的替代品，只是因为之前的 Office 还不够好。这也不是一个信仰问题，而关乎商业利益 。

所以，我真的觉得 Office 真的在做一件对的事情，保护好自己的用户，给他们更多的选择，把软件做的更好。

接下来，我也非常期待 Microsoft Office for Mac 的新版本能够带来更多的惊喜。

As far as I know, most web designers / developers are using Bootstrap as front-end framework in their projects. But today I wanna talk about another framework: Foundation .

What's the other guys talking about this

However Felippe Nardi has a very well post Top 5 Core Differences Between Bootstrap 3 and Foundation 5 about this topic, and summarized his opinion as below:

ZURB and Twitter made their objectives and intentions very clear when naming each CSS Frameworks: Bootstrap tries to give you everything you’ll ever need to bootstrap your project. Foundation just gives you the foundation to build upon.

Strongly recommend you to read.

The components

Foundation is more light weight comparing to Bootstrap, so it provides less complements built in - but doesn't mean that Foundation comes with no component.

Check out Foundation's documentation here and you'll see, hmm, lot of "things". Bootstrap has a well-organized doc set than Foundation does.

Anyway, basically you can find most components you'll use in common web projects - the grid system, buttons, forms, navigations and other add-on javascripts, in its own way.

Again, Bootstrap tires to provide you everything (and more options) you may need in web development, while Foundation only provides the necessary parts.

I think it is good to me because, with the basis by Foundation I use the framework only for architecture but leave the details to alternative, better choices. Not everything should be bootstyle.

Since make your own customized components cost more time, it is just a balance between full-stacks and flexibilities. You're the boss.

REM vs. Pixel

To honest I have never use REM in my projects before. But now I'm thinking about how to use REM in future projects and what's side effects (maybe, but who knows?).

By REM you're granted the ability to "scale" your website including the components as you want and easy to go. With SASS it is just a line to change. Although you can do the same in pixels by defining a variable and then make the components using metrics calculated from the variable.

Save it and just try a shoot with REM.

The only problem is that REM is supported by modern browsers. I'm okay with that.

Why I prefer to Foundation

I use Bootstrap in past projects but I believe I'll seriously consider to using Foundation if possible. My reasons? Foundations let you

• write cleaner Semantical HTML
• mobile first
• be different

Personally I really enjoy playing with new stuffs like this one. And during this you may find out something really useful and helpful to yourself. Keep learning is not bad, right?

Dig deeper through a real rails application

In order to have a much clear image of the differences between Foundation and Bootstrap, I decide to spend some time to dig deeper. It takes me about a day to switch an existing project from Bootstrap to Foundation 5, through Ruby on Rails 4.

• It won't take you a long time if you know well about the design principle behind "grid system". Both of these two are based on a 12-columns pattern.
  Of course it depends on how many pages you have in your project.
• Foundation as another front-end framework, there's also a gem called foundation-rails, by which you could build your very own stylings using SASS.
• Also simple_form provides support to foundation but need some more tweaks. I haven't pay my time on this part yet so I just using the native form builder in this project.

Since both Bootstrap & Foundation a front-end framework, there's not much thing to do with Rails the server side.

By the way, fortunately simple_form supports both of them by providing flexible form builder wrapper. If you're using simple_form's form builder in your Rails application it would save you some time.

Which one should you take

As coins have two sides, Bootstrap have more related documents / libraries, more support which Foundation is not. Secondary you really should discuss with your teammates if they want to play with a new toy.

1. If you're facing serious business, need more support and components, take Bootstrap
2. Or if you'd like to build your very own website, enjoy reinventing things, take Foundation

Though we're meeting forms everyday while surfing the Internet, there always be tons of great ideas to improve user's experiences on filling forms.

Inspired by Float Label with CSS and Float Label Pattern, I totally agree with that the placeholder is not a replacement of label, even it is not semantic.

So I spent some time to make my own implement.

Here's the showcase

Checkout the codes on gist.github.com.

Principle Behind

1. First of all, as I said, the placeholder is not a replacement to label, even you're just wanna save some space in design. Alternatively you could use a float / dymanic label like this.
2. Color hints / labels is really a good choice responding to user's input. Besides it is easy to implement and need no change to your HTML stracture.

The Real Tricks

As mentioned in the source posts, there're some tricks on implementing this effect using pure CSS:

1. Label status & color based on valid or invalid input values
2. Combination of :focus, :valid, :invalid to highlight label status
3. transition on label to make the animation

Problem?

Yep, I'm still feeling that the HTML code a little bit ugly, because the label tag comes after the input. However, I cannot found the way to select the previous sibling element by pure css selectors.

If anybody knows how to fix it, please kindly let me know :)

今天 @tualatrix 在 Twitter 上提到 Mac App Store 上一个可以把内存当硬盘的 App，想到自己用一个脚本做这样的事情很久了，所以分享一下。

其实很简单的：

1. 下载 diglloyd 的脚本
2. 将脚本添加到 LaunchAgents 里面，每次登录自动启用

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>Label</key>
    <string>Ramdisk</string>
    <key>ProgramArguments</key>
    <array>
        <string>/Users/hozaka/bin/crd</string>
        <string>512</string>
        <string>ramdisk</string>
    </array>
    <key>RunAtLoad</key>
    <true/>
</dict>
</plist>

应用场景

RamDisk 胜在速度快，并且不需要频繁在硬盘上存取，所以非常适合进行临时文件的缓存，处女座的人也不用担心伤硬盘。当然你也可以用来跑分然后吓唬别人。

我将 Safari、QQ、Skype 的下载目录都放到这里，收到的文件可以直接使用，并且这些文件一般都没有长期保存的必要，省去整理清扫的麻烦，每次弹出都会自动清空，非常方便。

参考来源

How to Create and Use a RAM Disk