Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Design > Adobe Creative Suite

  • Print
  • + Share This
From the book Go from Print to Pixels

Go from Print to Pixels

As you already know, this is a book about designing for the screen, whether your target user platform is a laptop or desktop screen, tablet screen, smartphone screen, or TV screen. But out of the box, Illustrator is set up for working with print documents. You’ll need to make some adjustments so that it’s more appropriate for screen graphics.

Choosing the Right Units

The first option to modify is Illustrator’s unit of measure. In the print world, measurements are usually picas and points, inches, millimeters, or a combination of those. However, in UI design, pixel measurements should be the standard. Fortunately, this is simple to change.

  1. Choose Illustrator > Preferences > Units (Mac) or Edit > Preferences > Units (Windows).
  2. The Preferences dialog appears (Figure 3.1).

  3. Change the unit definitions for General, Stroke, and Type to Pixels (Figure 3.1).
  4. Figure 3.1 Setting the General, Stroke, and Type units to pixels

Setting these basic units to pixels will help documents more accurately reflect what your end users’ target devices will show.

Optimizing the Color Space

The second thing to take care of is changing Illustrator’s color profile. Again, by default, this is set up with a profile that works best in a printing environment. You might easily justify leaving this setting alone, since no two screens are alike in how they show color, but you’ll change it in case there is ever a chance that you’ll want to edit your design in Photoshop or incorporate raster objects from Photoshop.

  1. Choose Edit > Color Settings (Cmd-Shift-K / Ctrl-Shift-K) to access the Color Settings dialog (Figure 3.2).
  2. Figure 3.2 The Color Settings dialog

  3. In the Settings pop-up menu, choose Monitor Color.

Application Frame

The Illustrator workspace may look a little different depending on which platform you are running. If you’re using a Windows PC, you will see the tools and default panel configuration running in a window. On a Mac, however, the interface floats freely just like the majority of Mac applications. Some Mac users prefer this behavior. I actually like the Application frame (shown in Figures 3.3 and 3.4) because it reduces distractions from underlying windows. I find myself clicking the wrong window far too often with the Application frame turned off. If you’re in the same camp as me, simply turn it on by choosing Window > Application Frame.

Figure 3.3 If you run a lot of applications in the background on a regular basis, the standard Mac configuration has the potential to get messy.

Figure 3.4 With the Application frame enabled, you can more easily focus on your task.

  • + Share This
  • 🔖 Save To Your Account