Dropbox 2.0 in Mac ejects itself

That’s a really nice touch. After installation of Dropbox 2.0 in Mac, it ejects the .dmg for you. I do the usual — you know — after install, eject the .dmg file. I’m pleasantly surprised I don’t have to do that. That’s a great experience you gave me as a user. Although in all good intentions, I wonder does that mean applications can eject my external hard disk should they choose to.

Still it’s a nice touch and I will remember it as that. And the new user interface for Dropbox is amazing too. Kudos there:

Dropbox 2.0

With the recent USD100m acquisition of Mailbox, I am excited to see what’s coming up next.

Notes on frontend development

I’m a Web UI Developer in Singapore and I realized frontend development has gotten really complex. It wasn’t far long ago when users were bitching about Internet Explorer. Today’s Internet Explorer is becoming a better citizen and whoever still screaming about its deficiencies apparently aren’t realizing the bigger issues with UI design in general.

Your pixel is not a pixel

The new issues are resolution independences. Much of the web is still defined by pixels and this no longer makes a lot of sense given Apple having their Retina displays and Samsung having their high resolution Samsung Galaxy S4 coming to Singapore soon. One pixel is no longer one pixel any more.

And given the higher resolutions, the devices do deserve better images. Sometimes this acts as a competitive advantages, your icons are prettier than your competitor, it shows dedication. The issue is not every device support such high resolutions and sending these images to them is just a waste of their bandwidth. Lower end devices might not have LTE either. There’re lots of CSS tricks and JavaScript detection methods to deduce the device capabilities and these workarounds aren’t the most elegant.

DevOps dude says lower number of requests per page

Mobile also has a new priority, to come up with icons all embedded into one image file. This lets the server only load your sprites just one. Sounds like a good deal? It really is, only problem is putting up with the hassle of doing background-position. It’s just too tedious. UI developers struggled and there are better tools to automate this process now.

Backend development might be a little easier these days

Contrasting to backend development, frontend has a different sort of complexity. The challenges of UI development is always learning new technologies and how to achieve productivity through embracing these technologies. There’s often a set back initially and we have to discover (or even make our own) automation tools to remain as agile while still delivering within our deadlines. If you don’t do that, you just can’t survive for long.

Tools of the trade

This is a quick update of the tools I used these days. I am a web user interface developer now so some of these tools might be kinda niche!

  • Text editor: SublimeText 2, because it loads fast and I swear by its open by file name feature
  • Computer: MacBook Air 13″, a decent screen size with good portability. I like working at cafés and this gadget fits my lifestyle.
  • Browser: Chrome 25. I lost track of Chrome’s version, comes with Chrome is the excellent debugger I cannot live without.
  • CSS generator: Less, because Less can be compiled by JavaScript on the client side. It’s easy to get started developing.
  • Revision control: Git or SVN. My vote is to Git but my company is on SVN.
  • Image editor: Photoshop. We use Photoshop for general slicing.
  • Programming and markup languages: Mainly JavaScript, HTML and CSS. We have quite a bit of Handlebars.js stuff as well. We use JavaScript extensively these days.
  • JavaScript framework: Backbone.js and Marionette.
  • Web server: Apache Tomcat. We have a Java stack.
  • Page profiling: Just Chrome.
  • Automation: Ruby Guard and Grunt.js. There’s a bit of LiveReload as well, but only when I develop on a Mac.
  • Quality checks: JShint and Chrome Audit in the console.

I can see what I use previously as a more general web developer.