My non-TUAW job is in print journalism, where I spend my nights as a designer for a newspaper in central Pennsylvania. Part of that work involves being able to estimate, from the glance at a photo in InDesign or a paper dummy, how much of a story I can fit on a page, photo dimensions and more.
The same goes for online design. Design veterans will tell you that knowing how big your elements are, aligning them, how they'll look on various screen sizes and other metrics isn't exactly easy. Icon Factory and ARTIS Software's xScope is a premium tool for helping streamline design for the web and the screen.
Nearly three years after version 2 was rolled out, xScope 3.0 makes its debut today. It rolls eight tools into one, including the ability to mirror the contents of any Mac desktop on an iOS device via the free xScope Mirror app. The app's been redesigned with an updated look that meshes well with OS X 10.7 Lion, smart tools that toggle on and off automatically depending on the app you're using, optimized code base and more.
Mirror: This is the newest item in the Xscope Swiss Army knife, and it's pretty handy for demoing your work to clients or co-workers. You can bring up an iOS design prototype in Photoshop, mirror it to an iPhone or iPad to see how it would look on the smaller screens and lock it so you can pass it around without someone accidentally bumping the window.
Dimensions: This tool is a universal favorite for those who use xScope. It allows you to take on-screen measurements of pretty much anything you can throw at it. Improvements for version three include pattern recognition and screen capture. Place the dimension tool at any location on your monitor, and you'll get crosshairs (what xScope dubs "laser beams") that let you know the distance from the center of the crosshairs to the next element it encounters. Move it around and it adjusts. You can take screenshots, learn the aspect ratio of an item and more.
Rulers: The built-in ruler in InDesign is one of my most-common used tools. xScope's built-in ruler can measure any element and can snap to the edge of the element to make it even easier when you press the control key. The rulers can be rotated and the calipers and mouse-position indicators can be toggled on and off. Keyboard shortcuts allow for fine-tuning measurement increments.
Screens: This places an overlay on your monitor to let you know where design elements fall on a particular platform. In the gallery example, we look at the regular TUAW site as seen on an iPhone with a red-shaded box indicating where the keyboard should be. This gives you an accurate view of how a web page would look on an iPhone.
Loupe: Loupe allows you to zoom in extremely closely on a page element, grabbing color details that can be used for creating palette or making sure design elements align perfectly. As with the other tools, the loupe tool will update as you move your mouse around the screen and allows for fine-tooth measuring of very small items such as buttons. You can lock the loupe in place to make changes without the risk of bumping your mouse.
However, this is when I began running into issues using xScope. Every time I activated the loupe tool, xScope crashed on my iMac, so I wasn't able to test the loupe. The other tools were pretty stable, so I imagine the crashing will be fixed fairly quickly with an update.
Guides and Frames: Most design tools have the ability to create multiple guides, and xScope's guides feature is fairly solid. You can create a number of them using a keyboard shortcut and quickly clear them as needed. A guide wizard is available to help space the guides out evenly. I wish guides could be set to a particular window rather than the entire screen. Depending on your background, the guides are hard to see, so you'll have to set guide color via preferences if you have a dark background. Frames are like guides, but for a particular grid area.
Crosshair: The final and simplest tool, it tells you coordinates based on where your cursor is on the screen. You can set any point as the origin, be it the entire monitor, within a window, or whereever you set your center point to via a keyboard shortcut.
xScope normally costs $29.99, but it's currently on sale via the Mac App Store for $19.99. It's also available through direct download if you want to give it a try before you buy it. If you're a designer, it's a solid set of tools to have.