iosart blog web ~ music ~ photography ~ life Sat, 17 Nov 2012 06:59:11 +0000 en-US hourly 1 Iosart Loop Commerce Sat, 17 Nov 2012 06:59:11 +0000 Excited to be starting Loop Commerce, my new venture. We are funded and already in full-throttle execution mode. Loop is based in Mountain View, CA and is hiring exceptional engineers to join our team and family.

If you’re a developer and are passionate about joining the core team and taking a key part of building a beautiful, reliable and scalable platform and product, please reach out. If you can think of awesome developers who are up for an exciting new challenge, please send them our way.

Check out our evolving jobs page at

]]> 0
ColorZilla for Chrome is here Thu, 12 Jan 2012 16:31:40 +0000 ColorZilla It’s been more than 7 years since the original ColorZilla for Firefox was released. It was one of the first Firefox add-ons available, to be more precise it was add-on number 271 (out of more than 350,000 add-ons available today). Also, ColorZilla was the first browser based color picker – for the first time it allowed web developers and designers the convenience of sampling and adjusting colors right within the browser, without the need to use any external applications. Over the years ColorZilla has become very popular with hundreds of thousands of web developers and designers using it every day. Thanks to everyone in the awesome ColorZilla community for suggesting features, reporting bugs and supporting the product from the very beginning.

Today, after a quite some time spent in development, testing and refinement ColorZilla for Google Chrome is finally out. It has all the most popular features you came to expect from ColorZilla, and great care has been taken to adapt the user experience specifically for Chrome.

For example, because picking colors from web pages is one of the most used features, it was very important for this functionality to be as easy to trigger as possible. So, on Windows when you click on the main ColorZilla toolbar button you’ll immediately be in color picking mode. On MacOSX and Linux all you need to do is choose the first menu item (the closest one to the main button).

Also, ColorZilla for Chrome allows you to pick colors from Flash objects and at any zoom level (which you can’t currently do with some of the other color picking extensions for Chrome).

Main ColorZilla Menu

Main Features

  • Eyedropper – get the color of any pixel on the page
  • An advanced Color Picker similar to ones that can be found in Photoshop and Paint Shop Pro
  • Webpage Color Analyzer – analyze DOM element colors on any Web page, locate corresponding elements
  • Ultimate CSS Gradient Generator
  • Palette Viewer with 7 pre-installed palettes
  • Color History of recently picked colors

ColorZilla Eyedropper

Additional features

  • Displays element information like tag name, class, id, size etc.
  • Outline elements under the cursor
  • Auto copy the generated or sampled colors to the clipboard in CSS RGB, Hex and other formats.
  • Keyboard shortcuts for quickly sampling page colors using the keyboard.
  • Get the color of dynamic elements (hovered links etc.) by resampling the last sampled pixel

ColorZilla Color Picker

ColorZilla Palette Viewer

So, check out ColorZilla for Chrome and let me know what you think.

]]> 0 – exposing the dangers of insecure login forms Wed, 27 Oct 2010 15:55:46 +0000 This issue has been bugging me for a long time, and finally I decided to do something about it – check out

You might not be aware of this, but many of the biggest sites on the web implemented their login forms incorrectly, and this potentially allows malicious attackers to steal your login information, which could then lead to them stealing your social security numbers, bank information or your identity.

Among sites that have this security problem are Twitter, Facebook, AT&T, Netflix, GoDaddy, Progressive, Tivo and UPS. has the full story, background and technical details.

]]> 0
New color tool – Ultimate CSS Gradient Generator Tue, 28 Sep 2010 11:02:55 +0000 Just released the Ultimate CSS Gradient Generator – it’s a powerful online Photoshop-like CSS gradient editor that will output cross-browser HTML5 / CSS3 gradients and will complement the ColorZilla set of color tools.

As you might know, HTML5 introduced many exciting features for Web developers. One of the features is the ability to specify gradients using pure CSS3, without having to create any images and use them as repeating backgrounds for gradient effects.

A few features in this first version of Ultimate CSS Gradient Generator:

  • A convenient ‘presets’ panel for pre-selecting a wide variety of gradients.
  • A gradient editor control that allows adding and removing stops, changing their color and position etc.
  • ‘Preview’ panel allows previewing the current gradient as a vertical or horizontal one, and also allows quickly previewing how the Internet Explorer fallback gradient will look in IE.
  • ‘CSS’ panel always has the CSS for the current gradient for easy copying and pasting into your stylesheet.

Check it out and let me know what you think :)

Important: You’ll need a recent version of Firefox, Chrome or Safari to use this Gradient Generator. The resulting CSS gradients are cross-browser – they will work in these browsers and will also fall back to a simpler gradient in Internet Explorer.

The CSS Gradient Generator will also be included in the latest version of ColorZilla.

Credits: The ‘Ultimate Web 2.0 Gradients’ preset gradients were derived from the great work by deziner folio and SGlider12 (their work was released under Creative Commons Attribution-ShareAlike license). The Color Picker is a minor adaptation of John Dyer’s awesome Color Picker.

]]> 5
New version of ColorZilla – v2.5 Sun, 12 Sep 2010 08:16:52 +0000 A new version of ColorZilla (v2.5) is now available. This version is still beta, so please let me know if you find any issues.

New in this version:

  • Color Picker Dialog:
    • New Photoshop-like ‘new/current’ color split panel
    • New smooth color map and color slider controls (based on John Dyer‘s JS Color Picker)
    • Experimental Lab and CMYK color spaces support
    • New ‘Eyedropper’ button allows sampling document colors while working in Color Picker
  • Eyedropper:

    • Limited Flash sampling support
    • Allow scrolling the document while color sampling
  • Web Color Analyzer: better color palette sorting
  • Firebug integration: fixed Firebug ‘Inspect’ panel opening for the last sampled element

By the way, if you missed the last v2.2 version, it added support for Ubuntu Linux 64bit, Firefox 4, HSL colors and more.

As always, you can download the latest v2.5 beta, along with the latest stable v2.2 version at

]]> 11
Cool Flickriver video tutorial Thu, 26 Feb 2009 15:23:21 +0000 Just found this cool Flickriver video tutorial:

Thanks, gfurry! :)

]]> 3
Rippomania or how I’m digitizing my entire music collection Sun, 21 Sep 2008 15:00:42 +0000 I’m slowly but gradually moving my life to digital. I went from film to digital photography a few years ago and never looked back. Now’s the time to do the same with my music – I’m now in the process of ripping my entire music library and making it playable through out the house.

Having to go over hundreds of CDs each time I want to listen to a specific album can really take its toll on your music listening experience, so making all your music available at your fingertips anywhere in the house is great. Beyond that, the sound quality playing well-ripped lossless sound files with good equipment should be better than with any CD player. Basically, playing music with a CD player often introduces various artifacts (such as jitter etc.) – due to mechanical moving parts and lack of good error correction. On the other hand, because while ripping the CD the software can “double-check” that it’s getting a good copy, and re-read the original CD several times if needed, the end result is often better quality music playback.


My CD ripping setup:

  1. Plextor Premium U external CD drive – this is an excellent drive for ripping music, especially because you can only use the Plextools (see below) with Plextor drives. These drives have long been discontinued, but you can still try and get one on eBay etc.
  2. Plextools software – excellent for ripping, if you have a Plextor drive. Similarly to EAC, this program allows you to rip your CDs without worrying that CD scratches or defects will produce a bad file. Basically, these programs perform some advanced verification and error correction algorithms to make sure the ripped data is exactly the same as the original one present on the disk. Make sure that you setup Plextools correctly so all of the advanced ripping algorithms I mentioned are turned on. Plextoor is reportedly faster than EAC, but both are really considered the industry standards for this sort of thing.
  3. FLAC – the lossless music format of choice, especially if you want bit-perfect copies of your music and widest possible support across various platforms. Plextools can rip to FLACs out of the box, which is great.
  4. Freedb – this service allows you to automatically get metadata about your CDs, so you don’t have to manually enter the names of your album, artist and the tracks for each ripped CD. Again, Plextool works with Freedb out of the box.
  5. MediaMonkey – an excellent media player, great for managing big music libraries. MediaMonkey has many useful features, but automatic tagging is probably one of the most useful ones. This allows you to automatically fix or complete the metadata of your songs and even find album covers.
  6. Sonos – multi-room digital music system. Basically, you setup all your music on one of your computers or a network storage device and then add a small box to any place in your home you’d like to have music at. Then you can have Sonos wirelessly play any music in your library at any location in your home, or have it synchronize all locations to play the same music. Sonos also comes with a very nice remote control to wirelessly drive the whole thing.

Guitar HeronoidSo, my ripping flow is as follows:

  1. Insert a CD, have Plextools pick it up and get the metadata from freedb
  2. Rip the CD, my file naming convention is “Artist\Album\Track # – Track name.flac”
  3. Use MediaMonkey to fix the metadata if needed, add album cover etc.
  4. Play the music on my machine with MediaMonkey, or throughout my home with Sonos
  5. Enjoy! :)

Sounds simple and easy, right? Not always. There are several problems you might encounter, some of them are:

  • Unicode problems, especially with non-English CDs
  • Damaged or scratched CDs
  • Missing or bad metadata, especially with classical CDs

I will post my solutions to these problems in the following posts.

For now, I’m off to listen to some music :)

]]> 1
ColorZilla v2 is here Mon, 07 Jan 2008 00:53:53 +0000 RGBIf you’re not familiar with ColorZilla, it’s a Firefox extension I wrote a while back to help me with my web design and development tasks. Over the years, it became quite popular with web developers and designers.

Anyway, over the course of this past year I added a few new features to ColorZilla (mainly because I needed them for my own work :) ), but because 2007 has been a very busy year for me, I just couldn’t find the time to properly test and release the new stuff to the public. Now, with Firefox 3 just around the corner, I finally took a bit of time to put everything together and release ColorZilla v2.

So, here’s what’s new in ColorZilla v2:

Webpage DOM Color Analyzer
Basically, this feature started with several simple questions – what colors are in use on any given Web page? What HTML elements use them and what CSS rules define those colors? So, Webpage DOM Color Analyzer analyzes a Web page and produces a palette of all the colors on that page. By hovering on any color, you can see what elements use that color, and by clicking on a color you can see a detailed listing of all the CSS rules that apply that color to DOM elements. You can even click on a CSS rule have ColorZilla open the corresponding style sheet file with the rule highlighted.

You can save the page colors as a ColorZilla palette, or open the palette in ColorZilla Online Viewer.

Webpage Color Analyzer

ColorZilla Online Palette Viewer
The online palette viewer is a simple webapp that can be used to view a color palette, bookmark it and share it using any number of bookmarking services such as, Google Bookmarks etc.

It works by providing a simple semantic URL that describes a set of colors:[/PALETTE_NAME]

Each color should be specified in a hex notation similarly to CSS, so for example red is FF0000 and yellow is FFFF00. The ‘palette name’ portion of the URL is optional.
Here’s an example of a palette URL:

Click here for an additional example.

When viewing palettes online, you get an online eyedropper (that works in all browsers!) that displays color information in many different formats for any color in the palette.

The online viewer can be opened from the ColorZilla Webpage Color Analyzer, or from the ColorZilla Palette Viewer dialog. The simple format of its URL also allows using it with any other application or Web service – all the application has to do is to generate a list of colors, append it to URL and launch that URL in a browser.

Online Viewer

Additional features

  1. Firefox 3 has a new Full Page Zoom functionality that allows viewing pages at any zoom level and handles both text and images very nicely. With Firefox 3 ColorZilla will use this new functionality for its internal zoomer.
  2. Firebug support – until now, ColorZilla allowed you to quickly open the selected element in Dom Inspector. Now, if you have Firebug installed, it will also allow you to quickly open it in Firebug.
  3. Ubuntu support was added. Basically, because Ubuntu’s Firefox was compiled using a slightly different compiler, ColorZilla eyedropper didn’t work unless you installed an official Firefox build from Mozilla. This version solves this problem by providing two versions of the eyedropper module, one built with the newer compiler (gcc4) and one with the older one.
  4. ColorZilla is now compatible with Firefox 3
  5. 3 new languages were added – Indonesian, Korean, Norwegian. Thanks to the BabelZilla team!

ColorZilla v2 (v1.9) is still in beta, but should be stable enough for everyone to try. Check it out and let me know what you think :)

]]> 57
PlainOldFavorites and FirefoxView for Firefox 3 Sat, 29 Dec 2007 22:39:46 +0000 ColoreflectionsAs you might know, Firefox 3 will be released very soon, so I needed to go over my extensions, make sure they are compatible and make the necessary adjustments here and there.

I started with PlainOldFavorites and FirefoxView, here are the new versions:

PlainOldFavorites 1.0.1

  • Compatible with Firefox 3
  • Catalan, Czech, Danish, Greek, Portuguese translations – thanks to the BabelZilla team!

FirefoxView 1.0

  • Firefox 3 compatibility
  • 24 new translations: Catalan, Czech, Danish, German, Greek, Persian, Finnish, Galician, Gujarati, Hebrew, Croatian, Hungarian, Italian, Japanese, Korean, Dutch, Polish, Portuguese (Portugal), Russian, Slovak, Turkish, Ukrainian, Chinese (Simplified), Chinese (Traditional) – thanks to the BabelZilla team!
  • Graduates to version 1.0!

So, check the new versions out and let me know if you see any issues.

Also, stay tuned for the new version of ColorZilla coming soon – unlike its two siblings above, ColorZilla’s new version will be a bit more major 😉

]]> 12
OpenSocial and Facebook Platform side by side comparison Sat, 03 Nov 2007 08:19:41 +0000 iPalmSurely, you’ve heard about Google’s new OpenSocial platform.

I believe this is indeed a very significant step forward, especially taking into account the launch partners who are already on board.

Naturally, a lot of comparisons between OpenSocial and Facebook Platform have been made, mostly having to do with the fact that Facebook Platform is closed and proprietary, and OpenSocial is open and standards based. While I couldn’t agree more, after reading the OpenSocial documentation carefully, I couldn’t help but notice that there’re several Facebook Platform features missing from OpenSocial – mainly having to do with app management, permissions etc. To try and make some sense of the differences, I created the following table, comparing the two platforms side by side.

Facebook Platform Open Social Notes
Universal + Facebook apps work only on Facebook, OpenSocial apps (will) work everywhere
Standards based + Facebook – FQL, FBML, OpenSocial – JavaScript, HTML
Extensible + OpenSocial allows certain containers to expose additional data to apps etc.
Publish user stories + + Both platforms allow posting user stories or activities
Get friends list + +
Get user info + +
Persistence + OpenSocial provides an integrated solution for storing app data
Send app notifications + Facebook allows apps to communicate with users via email
Send app requests + Facebook apps can send requests and invitations to non-app users
Spam controls + Facebook monitors and allows users to report spammy apps and takes appropriate actions
App permissions and privacy settings + Facebook provides fine-tuning of each app’s permissions and privacy settings
Access to events, groups, photos, marketplace +
Application directory +
App added notifications + Facebook notifies user’s friends when they add new apps
Additional container hooks + Facebook apps have icons on profile page, left sidebar links etc.
Dynamic profile box + Facebook uses push model with which user’s profile box needs to be explicitly updated by the app. OpenSocial allows fully dynamic profile boxes
Image caching + Facebook caches all 3rd party images. Pros – higher availability, cons – difficult to create dynamic images

Conclusions – first, OpenSocial is only at its 0.5 version, and I’m sure it will be significantly improved and extended in the near future. With that said, looking at the features side-by-side today, it’s clear that OpenSocial currently provides two basic functionalities – containment and access to container data. It doesn’t provide any of the higher level functionality present on Facebook – things like application directory, application permissions and privacy settings, spam controls, additional application links and hooks, ‘app addded’ news posts etc. Each container site will need to implement most if not all these functionalities independently, as they obviously address pretty common needs and problems. This also means that within each container there will be slightly (or maybe even significantly) different app virality, discovery and distribution dynamics.


One thing is for sure – OpenSocial makes developers’ life much much easier. Unlike Facebook platform, OpenSocial doesn’t require learning new markup and query languages, and the specific platform quirks associated with many of the proprietary mechanisms. Also, with OpenSocial developers won’t have to work hard to figure out how to easily push updates to user profiles, or how to include dynamic images or initially interactive flash elements into the profile box. On the other hand, many of these restrictions were introduced by Facebook for a good reasons (at least in their opinion), and it would be really interesting to see how removing these restrictions will affect end-users’ experience.

I’m personally really looking forward to seeing what effect OpenSocial will have on the Web and how Google’s recent move will affect Facebook, Yahoo, Microsoft, AOL and other big players, and what will be their response. Exciting times!

]]> 10