Formats for Visual Technical Communication

Rahul KULKARNI
Technical Illustration
7 min readFeb 10, 2017

Technical illustration walks the thin line between engineering and art. There goes a great deal of technical data behind the exploded views or cut sections. It requires accurate geometry (scale ratio), position (isometric orientation is the preferred method), materials (not required unless it is to be used for marketing purposes), and order (according to Illustrated Parts List) so that the desired purpose can be accomplished. If the purpose of the illustration is to facilitate the assembly or to carry out maintenance on a product, but is ineffective because of incorrect assembly sequence then the user will find it difficult and confusing to assemble or maintain, the correct order or orientation.

Sometimes the results of a shoddy illustration are not very significant. But illustrations are often used in aircraft maintenance manuals, nuclear reactor operations, bomb disposal training, surgical operations, and any occupation which requires the person to be trained in skills that require a great degree of accuracy. A mistake in such places can have tragic consequences. It is for this reason that technical illustration cannot, at its core, be art.

First, as an illustrator we normally don’t have control over the form of input data for technical illustration. Reference data may be sketches, photographs, engineering drawings, scale models, computer models, or simply a verbal description. If we require engineering drawings in order to complete accurate illustrations, and no engineering drawings are available, we are in serious trouble. Likewise, if we rely only on visual correctness, and a client wants exact dimensional representations, we are equally limited. The most common mantra to be followed in creating illustrations is that of US Marine’s– Improvise, Adapt, and Overcome.

Technical Illustration Data Types

Technical illustration data can be divided into input data and output data. Input data is what we use to create a technical illustration. This includes engineering drawings, sketches, photographs, models, files in various computer-aided design (CAD) formats, art files in any of several raster and vector formats, and verbal descriptions.

Output data describes the form in which a technical illustration may be produced: raster bitmap (TIFF), PostScript (EPS), Enhanced Metafile (EMF), or one of several proprietary vector formats. Technical illustrators maybe even called to submit data in form of animation sequence using tools like SAP VEA, 3D Via Composer or Cortona 3D. Animating 2D illustrations makes for an enriching interactive experience.

2D graphics consists of the raster and vector data. Raster data consists of a pattern of dots at fixed resolution. In order to achieve high quality, raster images must have tens of millions of pieces (bits) of data; raster files can be quite large [1–50 Mb], which can incur a significant cost in high-end system configuration. The most important raster file format for technical illustration is the Tag Image File Format (TIFF) because it communicates its raster information to high-quality printers to produce optimized output. As we zoom into raster image we can see that the image quality roughens and we see what is commonly called in Graphics jargon as ‘Stair-case’ effect.

You can see the ‘stair-case’ effect on left side, vector on the right is smooth as they are defined by mathematical curves.

Vector data uses mathematical descriptions for lines, text, shapes, and fills. Vector data is resolution independent, which can be simply explained as a line of thickness 0.18 mm will remain the same thickness whether we zoom it to 6400% or 100%. Technically, that means same vector data can be sent to an 800-PPI printer for inexpensive distribution and to a 2000-PPI printer for poster-quality reproduction. Vector files require considerably less processing and storage resources because vector graphics are not stored as individual bits. The most important vector file format for technical illustration is the PostScript (PS) format or its cousin Encapsulated PostScript (EPS).

With the advent of HTML5, Scaleable Vector Graphics (SVG) format is gaining popularity these days.

Let’s jump into more detail about the graphic formats currently used for visual technical communication:

Vector Formats:

  • *.CGM (Computer Graphics Metafile): CGM was developed by W3C in 1999. CGM was originally used for clip art libraries, but newer revisions (based on the ISO/IEC 8632 standard) are now commonly used for CAD drawings. CGM is a ‘metafile’ i.e., a file containing information that describes or specifies another file, the CGM format has numerous elements to provide functions and to represent entities, so that a wide range of graphical information and geometric primitives can be accommodated. It is this ability that makes it as a preferred format for IETP documentation (Interactive Electronic Technical Publications). Hotspots are used in IETP — to link the CSN numbers with the IPL illustrations. CGM is not widely supported for web pages, it is still used to create graphics for tech documentation targeted towards engineering and aviation industries.
  • *.DXF/*.DWG (Drawing eXchange Format/DraWinG file): A DXF file is a data file saved in a format developed by Autodesk and used for CAD vector image files, such as AutoCAD documents. DXF files are similar to .DWG files, but are more compatible with other programs since they are ASCII (text) based. A DWG file is a database of 2D or 3D drawings created with AutoCAD, a professional CAD program. It contains vector image data and metadata that describes the contents of the file. DWG files are related to .DXF files, which are ASCII versions of DWG files.
  • *.EPS (Encapsulated PostScript): EPS is a standard graphics file format created by Adobe in 1992. EPS files include an embedded preview image in bitmap format. Simply, an EPS file is a PostScript program, saved as a single file that includes a low-resolution preview “encapsulated” inside of it, allowing some programs to display a preview on the screen. Here is the link for hardcore geeks!
  • *.SVG (Scaleable Vector Graphics): SVG is a new kid on the block. Scalable Vector Graphics (SVG) is an XML-based vector image format for 2D graphics with support for interactivity and animation. The SVG specification is an open standard developed by the World Wide Web Consortium (W3C) since 1999. SVG images and their behaviors are defined in XML text files. This means that they can be searched, indexed, scripted, and compressed. As XML files, SVG images can be created and edited with any text editor, as well as with drawing software. All major modern web browsers have SVG rendering support.

Raster Formats:

  • *.GIF (Graphics Interchange Format): GIF is a bitmap image format developed by CompuServe in 1987. GIF supports 8 bits per pixel for each image. It supports animations and allows for a palette of 256 colors for each frame. GIF images are compressed using LZW lossless data compression technique to reduce file size without degrading quality. It is well-suited for simpler images such as graphics or logos with solid areas of color.
  • *.PNG (Portable Network Graphics): PNG file format was created as a free, open-source alternative to GIF. Compared to JPEG, PNG excels when the image has large, uniformly colored areas. PNG is still well-suited to storing images during the editing process because of its lossless compression. PNG is designed to work well in online viewing applications like web browsers.
  • *.JPG/*.JPEG (Joint Photographic Experts Group): JPEG is a lossy compression method; JPEG-compressed images are stored in the JFIF (JPEG File Interchange Format) file format. JPEG applies lossy compression to images, which results in a significant reduction of the file size. The degree and the amount of compression applied impacts the visual quality of the result. JPEG files suffer generational degradation when repeatedly edited and saved. So it is a good idea to avoid this format for lineart technical graphics.
  • *.TIFF (Tagged Image File Format): The TIFF format is a flexible format that normally saves eight bits or sixteen bits per color. The tagged structure was designed to be easily extendible. TIFFs can be lossy or lossless, depending on the technique chosen for storing the pixel data. Digital cameras can save images in TIFF format, using the LZW compression algorithm for lossless storage. TIFF image format is not widely supported by web browsers. TIFF remains widely accepted as a photograph file standard in the printing business. TIFF can handle device-specific color spaces, such as the CMYK defined by a particular set of printing press inks. OCR (Optical Character Recognition) software packages commonly generate some form of TIFF image for scanned text pages. TIFF is a good option to create classic black and white lineart technical graphics.
  • *.BMP (Windows Bitmap): Bitmap handles graphic files within the Microsoft Windows OS. Typically, BMP files are uncompressed, and therefore large and lossless; their advantage is their simple structure and wide acceptance in Windows programs.

I hope this post gives you a clear idea of popular formats we come across in technical graphics. This will help you to make the right choice for your graphical presentations.

--

--

Rahul KULKARNI
Technical Illustration

Writer, Educator & Content Creator on 3D, Game Dev, Technical Training & Scale Modeling