An utility for designers and developers to help them see and measure differences between design comps and design implementations
You tell if you need pixDIF if you answer yes to any of these questions:
1. Do you ever find that you need to measure the pixel distance/size of something when you're not in Photoshop? Or, put another way: do you wish you could take the guides in Photoshop with you to the computer desktop?
2. Do you ever want to know what a graphical asset will look like in the context of a website or application. For instance, do you wish you could take an image and move it around over your website to see what it would like like in various places before you start writing the code to place it there?
3. Do you ever have a website or application design that you need to break up into pieces and build into a working site/app? And then as you write the code you need to see how close to the design you are?
Here's how pixDIF works:
1. You install it to your desktop ( Adobe AIR application, see install badge at the top of this post. )
2. Launch it
3. Drag-and-drop your design comp images into the app
4. Select one and it will launch in it's own chromeless window
5. You can now move that window over your functional app and look for the differences
About Adobe AIR
Adobe AIR runtime allows Adobe AIR applications to be deployed on computers and devices running the Linux operating system. In addition, Adobe Flex Builder for Linux can be used to build rich internet applications that deploy to the desktop and run across operating systems using proven web technologies.
- alpha fading of the image
- turn the image visibility off
- create horizontal or vertical guides
- drag the guides around
- use the guides to measure pixel distances very precisely
- use the arrow keys to move the guides - if it's selected/red
- or use the arrow keys to move the image/window around on your desktop
- hold down the shift key to move 10 pixels at a time