New Reverie is out, and this blog is now Foundation 5 based.

(Articles that I liked: Friday, December 20, 2013)


Foundation 5 rocks. It is awesome and now this blog is using it, thanks to Reverie!

New Reverie is out! I have just ran a code that I detailed before to sync the forked repo, and boom, without much work, this blog is now Foundation 5 based. Nice.

My next step is to take advantage of such neat feature as Interchange and Orbit right inside of WordPress. It is quite exciting.

I’ve been posting links that I liked at Posterous (RIP) and then my tumblr blog. Here are the week worth of links:

Font awesome, and php split() to explode()

Couple of update notes

Noticed couple of things that I am doing over and over, and everytime I am doing it, i had to look it up (Thank you, Google for making us dumber and dumber…) thought to put it in a place for my future self…

Going from font-awesome 3.2.1 to the current 4.0.3

It used to be
<i class="icon-btc"></i>
but now you have to make it
<i class="fa fa-btc"></i>

PHP Split

split() is deprecated as of PHP 5.3.0. So if you want to convert something like 1974-05-25 into an array, an was using it, you can use explode() insted, like so:

list($Year,$Month,$Day) = explode('-',$info[dob]);
$stampeddob = mktime(12,0,0,$Month,$Day,$Year);
echo date("M. j, Y",$stampeddob); 

Scaling Your UX Strategy, and other articles that I liked: Fri, Dec 13

Interesting. As you may or may not know, I work for Harvard Business Review, and love it. It has a lot of interesting contents that is published on our magazine. I’ve been subscribed to email groups and just saw this article “Scaling Your UX Strategy” originally written in January 7, 2013 — almost a year ago — by Robert Fabricant, translated into Japanese and appeared on the listserve. It is a very good overview of how to implement UX in your organization. I almost want to bring this up and say “Practice what you preach!” I have been reading Users not Customers by Aaron Shapiro of Huge Inc, and really really liking it. My job is front-end developer, and not UX designer, but I deeply care about UX, and there are many many things (and some of it simple!) that we could be doing. I hope to implement some of those things.

Many things that I wish I could do, but don’t have time. But I’d like to make it happen!

I’ve been posting links that I liked at Posterous (RIP) and then my tumblr blog. Here are the week worth of links:

Random links, mostly web dev articles that I liked: Fri., Dec. 6

It is so interesting — or predictable — that now that the baseball season is over, my interest is all over the place. Mostly web dev stuff as that is all most all what I am doing lately.

Nicolas Gallagher of twitter wrote this almost two years ago. He says many good things and I should re-read it time to time, because everytime I read it, I found something that I didn’t notice before. It is amazing.

SassMe is a great resource for colors, when using color transformation in SASS.

I have to figure out a better way to post those links. I have been using delicious, but they are very unreliable, and I have been trying to use geeklist, but to no avail. I have sort of settled on LinkedIn as my link place and linking ifttt to post it to tumblr. It seems to work. See how it goes…

I’ve been posting links that I liked at Posterous (RIP) and then my tumblr blog. Here are the week worth of links:

Continue reading…

Emmet is AWESOME


While I thought it was great idea, I was not super crazy about HAML. Thanks to css and jquery, I always think DOM in css selectors. However, I just couldn’t stick with HAML. I liked to be able to code in html with < and >.

Meet Emmet.

Yes! Just like haml, you can write html with css selector, but you are coding in html. Let me show you what I mean. For example:


Will produce

<div class="row">
	<div class="medium-3 small-6 columns mycalss1">
		<img src="" alt="">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolor, aspernatur ex magni magnam tempora hic accusantium expedita quia quaerat dolorum natus minima doloribus nostrum laboriosam autem ab voluptatum laborum maiores!</p>
	<div class="medium-3 small-6 columns mycalss2">
		<img src="" alt="">
		<p>Ipsam, dolores, facere voluptatem deleniti at qui sunt! Facere magnam aspernatur eos adipisci doloremque vel explicabo magni! Tempore, quisquam, architecto, nulla facilis ducimus ex sequi porro nam mollitia placeat odio?</p>
	<div class="medium-3 small-6 columns mycalss3">
		<img src="" alt="">
		<p>Quaerat, deserunt, odit eveniet impedit error quo necessitatibus tenetur ab sunt suscipit ipsam eligendi ea quibusdam! Error, modi, repellendus quos est doloribus temporibus ea sed voluptas reiciendis hic sunt assumenda.</p>
	<div class="medium-3 small-6 columns mycalss4">
		<img src="" alt="">
		<p>Recusandae eligendi nisi ipsam nam. Assumenda, omnis reprehenderit distinctio illo at obcaecati nemo vitae magni iste enim molestias consequuntur debitis soluta eius sunt aspernatur ipsam sequi id sed maxime quos.</p>

See the Pen plwIt by Daigo Fujiwara (@daigofuji) on CodePen

Amazing. $ for number, * to multiply, and lorem to put lorem ipsum in there. Awesome.

To install emmet on my sublime text 2, I have already had Package Manager installed on it, so all I had to do was run Package Control, which you could do by Menu > Tools > Command Pallete. Or hit Cmd+Shift+p. Type in install, select “Install Package.” Find Emmet, select. Done.

But what really sold me on Emmet was the “action” for comments. You can comment things with Command-/. Which works with both html and css (didn’t try with js, yet).

In css, m is margin, p is padding, bd for border, bg for background, etc. Great cheat sheet here.

Open a new file, save it as index.html, type ! and hit tab. Boom. HTML5 document is created. Crazy. I love it. Thanks Emmet!

Simplicity, patience, compassion.

“Simplicity, patience, compassion.
These three are your greatest treasures.
Simple in actions and thoughts,
you return to the source of being.
Patient with both friends and enemies,
you accord with the way things are.
Compassionate toward yourself,
you reconcile all beings in the world.”

— Lao Tzu, “Tao Te Ching

Precious life

Every day, think as you wake up, today I am fortunate to be alive, I have a precious human life, I am not going to waste it. I am going to use all my energies to develop myself, to expand my heart out to others; to achieve enlightenment for the benefit of all beings. I am going to have kind thoughts towards others, I am not going to get angry or think badly about others. I am going to benefit others as much as I can.

— Dalai Lama XIV

Front-end Style Guides (and Articles that I liked: Fri., Nov. 22)

I just bought this book this week, and it is excellent. It may have been one of the best spent $3.
“A Pocket Guide to Front-end Style Guides.” by Anna Debenham

Quote from the book:

“Where front-end style guides excel is in encouraging collaboration between designers and developers. I love sitting down with designers and going through the guide, making tweaks straight in the CSS with them. It saves a lot of time (and sanity) that I used to spend going back and forth between mock-ups and live sites, and it also prompts some great conversations about responsive design.”

She gives a lot of examples of style guides

More useful links on Front end Style Guides:

At my work, we are embracing the Atomic Web Design principal and probably create a pattern-lab for our selves, but something like Pattern Primer would also work. Much less overhead than the Pattern Lab (though Pattern Lab is AWESOME!)

I’ve been posting links that I liked at Posterous (RIP) and then my tumblr blog. Here are the week worth of links:

Installing node and npm on my Mavericks MacBook Pro


Package management is great. Yes, it is… WHEN IT WORKS. At least that was my attitude before.

As I anticipate release of Zurb Foundation 5 on November 21st, I couldn’t wait for it to go live. So, I decided to peak into their github branches. They are using Grunt in their process, and Foundation will be included in bower. And documentation is built with Grunt using OK, those things are things that I have not have time to play with. I hear all the good things that node.js and its npm installed application can do… a lot of it like magic, they say. I just have never done it, partly because I was using Red Hat’s rpm when it went from Red Hat to Fedora and it stop working, and more recently, something went wrong with ruby version control RVM thing.

I am still a designer-turned-himself-into-developer, and even with all of my geekiness, still don’t quite understand, or still have a fear, about “computer science”.

Anyway. I decided that the time is now. Just do it.

So, here are my notes while I struggled through it all. I will likely have to do it again when I get a new computer or anything like that. I figured it would be good to leave trace.

(Note: If you are here for “npm: command not found” problem, skip the middle part when I struggle with it and go to the end of the post for solution. It’s a permission issue and you need to run this: sudo chown -R $USER /usr/local)
Continue reading…

A mess, that is Posting System. (and articles that I liked: Fri., Nov. 15)

Posting system. What. A. Mess.

They were restructuring or revisioning the system, so I heard. Good I thought. The system is terrible. But as it turns out restructuring was all for the benefits of owners of MLB teams. It does not concern or address problems that players like Hiroyuki Nakajima or Hisashi Iwakuma had. Their rights were won, but the team with winning bids — Yankees in 2011 with Nakajima, and Athletics in 2010 with Iwakuma — didn’t negotiate players compensation fairly. After all, Japanese player have no leverage for negotiation once the bidding is over, which I think is the biggest flaw of the system. Japanese Players Association, just reluctantly accepted the deal because they really had no choice. Now, the MLB says the deal may not happen because “When we made that proposal, we told them it was important that they give us a timely response. Unfortunately, they have not been able to do that.”

What a mess. Makes me sick. Japanese baseball is really just becoming the farm system for the MLB. Very sad. Or, from what I can see, at least the people who run it is treating Japanese leagues like one.

Also watched a great video about MLB schedule makers who were recently replaced by computers.


I’ve been posting links that I liked at Posterous (RIP) and then my tumblr blog. Here are the week worth of links: