## Nautilus Screenshot Guidelines

2001
Eazel Inc.

Permission is granted to copy, distribute and/or modify this document under the terms of the GNU Free Documentation License, Version 1.1 or any later version published by the Free Software Foundation with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts. A copy of the license can be found here or in the file COPYING-DOCS which shipped as part of this package.

Many of the names used by companies to distinguish their products and services are claimed as trademarks. Where those names appear in any GNOME documentation, and those trademarks are made aware to the members of the GNOME Documentation Project, the names have been printed in caps or initial caps.

## Introduction

This document provides guidelines for creating screenshots of Nautilus for use in Nautilus documentation. It is also meant to help localizers produce localized screenshots of Nautilus as part of the translated Nautilus documentation.

## General Guidelines

The following guidelines should be used for all screenshots used in Nautilus documentation which is shipped with Nautilus.

### Appearance

Nautilus should be set to the "Default" theme. Because the Nautilus, Gtk+, and Sawfish themes are not yet integrated, you will have to manually set the Gtk+ and Sawfish themes to "Crux" in the GNOME Control Center. You will also need to set the color to match that of the default Nautilus theme by selecting 'Crux' GTK+ Theme in the Control Center and set the color to 0.37, 0.44, and 0.60 for red, green and blue respectively.

### Screenshot Size

Screenshots should be small enough to fit in the default-sized Nautilus main panel which is 646 by 418 pixels. Note that this size includes any callouts which may be present. You should generally allow 7 pixels on the top and left and 11 pixels on the bottom and right for the drop shadow, so your original screenshot should be no more than 628 by 400. If you will have callouts, you should allow 34 pixels for each side with a callout instead of the 7 or 11 pixels for the drop shadow. (eg. A screenshot for a figure with a callout on the left should be at most 646-11-34=601 pixels across. For one with a callout on the bottom, is should be at most 418-7-34=377 high.)

When specifying the geometry of a Nautilus window, remember the geometry does not include the border decorations. Using `nautilus --geometry 520x335` works nicely.

### Window Focus

You should always make sure that the window you are taking a screenshot of has "focus", ie. if you were to type the text you type would be directed to this window. Generally the window decorations appear differently when the window has focus - it often has more color or brighter color. Typically a window is given focus by clicking on the window border, but this will vary depending upon your window manager configuration.

### Trademarks

Screenshots should not include any trademarked logos, such as Eazel's logo, Red Hat's logo, or any others. It may contain the GNOME logo. If your screenshot has a logo, please erase the logo in the GIMP.

### Colors

In order to avoid distracting or visually confusing screenshots, you should use colors with low saturation values for callouts or any other drawings you make on your image.

### Techniques

There are several techniques which we commonly use in the screenshots:

Drop Shadow

  A drop shadow gives the image a perspective and a generally more polished and professional look.

Callouts

  Callouts are labels which are used to describe certain portions of the screenshot.

Circled Object Callouts

  For small items in a screenshot, such as buttons or icons, a modified callout is used which circles the item.

Drawings

  Sometimes it is necessary to draw on a screenshot, such as to represent the action of a drag-and-drop action.

## Tools

### Tools for Taking Screenshots

There are many tools for taking screenshots on Linux. The Screenshooter Applet is a very convenient tool for taking screenshots. The GIMP and xv are two other popular tools. In some situations, the command line tool, xwd is useful, especially in combination with the `sleep` command.

For dialogs which are tricky to grab such as the dialog you see when you quit GNOME, the Xnest application is useful. It allows you to run an entire X and GNOME session in a window. It is also helpful if you would like to take a screenshot of your whole desktop and make that desktop a customized size, since your Xnest window can be any size you want.

### Image Manipulation Tools

The most common tool for manipulating images on Linux is the GIMP. You will need some of the sophistocated features of this application which are not available in other tools for Linux.

## Creating a Drop Shadow

The drop shadow is used to give the screenshot perspective and to set it aside from the normal appearance of the interface, emphasizing that it is in fact a screenshot instead of a piece of the interface. It also gives it a more professional appearance. To see the desired effect, compare the following two screenshots, with and without the drop shadow.

### Before Drop Shadow

Before Drop Shadow

### With Drop Shadow

With Drop Shadow

Creating a drop shadow in the GIMP is easy:

1. Load image into GIMP

2. Convert to RGB with Alt r

3. Select all Ctrl a and copy Ctrl c.

4. Create a new image Ctrl n, and make it about 100 pixels wider and taller than the image to give you some room to work. Make it a transparent background.

5. Paste the image with Ctrl v and then anchor it with Ctrl h

6. Create the Shadow by right-clicking on the image and selecting Script Fu Shadow Drop Shadow . Use Offset X and Offset Y of 4 and Blur Radius of 9.

7. Merge Layers with Ctrl m. At the dialog, you probably will want to select Clipped to bottom layer unless you have more work to do, in which case you should select Expanded as necessary.

8. If you have other work to do, such as adding callouts, do this now.

9. Autocrop your image by right-clicking on the image and selecting Image Transforms Autocrop .

10. Save the image by right-clicking on the image and selecting File Save As . You will want to save it as a PNG image for use in in the documentation. If you expect to edit this further in the future and have added layers to your image you may want to also save it in XCF format.

## Creating Callouts

Callouts are used to identify a part of a screenshot, typically in order to introduce the terminology associated with that part of the screenshot. In order to keep things simpler, make the screenshot smaller, and increase flexibility, callouts are often numbered instead of being directly labelled.

### Before Callout

Before Callout

### With Callout

With Callout

The typical dimensions of callouts are: disks inside image are 17 pixels in diameter with a 2 pixel-wide white border, lines are 3 pixels in diameter with a 2 pixel-wide white border, and disks outside image are 21 pixels in diameter with no border. When creating a circle to fill with color, make sure it is anti-aliased. The numbers are generally in 14 point, bold Helvetica.

## Circling Items for Callouts

FIXME

### Before Circle Callout

Before Circle Callout

### With Circle Callout

With Circle Callout

FIXME

## Finishing Touches

FIXME

## Resources

The following resources may be helpful:

- GIMP Manual

- GIMP FAQ's

- GIMP Tutorials