Graphic Design History, File Naming Practices, and Universal Image Formats
Key Figures in Graphic Design
Thomas Nast
Active during the middle to late nineteenth century.
Key historical visual communicator.
Paul Rand
Considered the most important American designer of the twentieth century and arguably the most influential designer overall in the mid to late twentieth century.
Spearheaded the concept of corporate branding immediately following World War II for International Business Machines (IBM).
Historical Corporate Landscape: Prior to Rand's work, corporations utilized disjointed trademarks and logos across different divisions. For example, Heinz used distinct logos for ketchup, mustard, and individual condiments. IBM maintained approximately 12 separate departments (office furniture, office equipment, printing supplies, etc.), each operating with entirely separate advertising, logos, and public images.
Rand's Innovation: Proposed unified corporate identity by creating a single, universal symbol, logo, and recognizable icon for an entire brand ecosystem.
Predecessor Context: German designer Peter Baron pioneered domain branding in the early twentieth century; however, his historical recognition was muted due to joining the Nazi party late in life.
Modern Impact: Rand's branding principles led directly to the creation of the three most recognizable non-religious, non-political symbols on Earth: the McDonald's golden arches, the Nike swoosh, and the Coca-Cola script.
Leadership: Served as the head of the Yale School of Design.
Susan Care
Living designer hired by Apple in the early 1980s.
Designed the user interface and original desktop icons for early Apple computers.
Established the foundational visual iconography used across modern desktop computer screens, smartphone interfaces, and tablet displays.
Course Requirements and Assignments
Notebook Collection: Students must compile documentation on a total of 15 key designers throughout the term. These figures will be tested on the midterm exam and applied in upcoming design projects.
Homework Assignment 1: Conduct research on Thomas Nast, Paul Rand, and Susan Care. Write one to two concise paragraphs summarizing key facts for each designer.
Homework Assignment 2 (Vocabulary Definitions): Look up and physically write down paper definitions from a digital or physical dictionary (e.g., Merriam-Webster or the Oxford English Dictionary via the Brown Library website) for the following terms due by Tuesday next:
aggressivetimidbalance(record the first couple of primary definitions for words with multiple meanings)askewharmonycacophony(record the single specific definition)
Best Practices for File Naming and Digital Organization
Default vs. Structured File Naming
Standard media capture defaults (e.g.,
1000694.JPEG,1000695.JPEG) across ~800 raw files produce massive digital clutter.Default naming conventions (e.g.,
untitled 1throughuntitled 98) cause extreme productivity loss across multi-semester design projects. Thumbnail views fail to efficiently distinguish subtle variations among hundreds of similar images (e.g., 200 variations of a single t-shirt product photo).
Core Rules for File Naming
Use Descriptive Identifiers: Incorporate explicit metadata describing the asset contents (e.g.,
red_patriotic_tshirtvs.blue_patriotic_tshirt). Combine descriptive filenames with clean folder hierarchies (e.g., a master folder namedpatriotic_tshirtcontaining color-specific files).Keep Names Simple: Balance specific descriptions with conciseness.
Eliminate Blank Spaces: Never insert spaces into filenames. Substitute spaces with underscores (
_).Avoid Reserved Characters: Do not use special characters or punctuation marks in file names, including forward slashes (
/), backslashes (\), colons (:), semicolons (;), dashes (-), pound signs (#), ampersands (&), or shift-key symbols.
Technical Rationale: Code and Image Setters
Reserved characters and spaces execute programmatic commands in computer science, coding, and file directory paths.
Modern designs are published across diverse physical and digital mediums, including print media (newspapers, magazines, posters, handouts, shirts, buttons, banners) and screen displays (webpages, smartphones, tablets, televisions, electronic billboards such as those on Route 221, Franklin Road, and Route 460).
Output devices (printers, web servers, television hardware, digital billboard controllers) process artwork files through image setters that translate instructional code into visual output.
In computer code, a blank space represents an explicit "STOP" command. A space or reserved character in a filename causes the image setter to halt, resulting in job failure, unrendered web elements, or print stoppage. Modern software applications do not automatically override or resolve these filename syntax errors.
Handling Multi-Artboard Files
Adobe Illustrator allows designers to nest multiple artboards (e.g., 8 design variations) in a single
.AIfile, which is useful for client presentations (comparing font sizes and color schemes).When sending finalized assets to commercial print vendors, separate each artboard into individual files to prevent output processing errors.
Native vs. Universal File Formats
Native File Formats
Definition: Formats proprietary to the software application or suite in which they were created. They generally require the original application to open and edit.
Examples:
.doc/.docx(Microsoft Word).PSD(Adobe Photoshop).AI(Adobe Illustrator).INDD(Adobe InDesign)Application Compatibility: Adobe Creative Cloud subscribers can exchange native
.PSD,.AI, and.INDDfiles seamlessly across Adobe applications. However, external clients (e.g., local business clients like Joe's House of Fish or Pete's Pizza Shop, or event photography clients) typically lack access to these applications and cannot open native files.Historical Case Study: Microsoft's transition from
.docto.docxin the early 2000s broke file compatibility across millions of non-updated office systems nationwide.
Universal File Formats
Definition: Standardized formats engineered to open reliably across virtually any retail computer hardware, operating system (macOS, Windows), or default viewer software.
Universal File Formats for Print
Overview of Key Print Formats
Design workflows rely on three universal print file formats:
.TIFF,.EPS, and.PDF.
Tagged Information File Format (
.TIFF)Primarily utilized for high-resolution, uncompressed photographic images classified as continuous tone raster images.
Reserved for high-end applications, such as fine art gallery prints and museum book publications.
Encapsulated PostScript (
.EPS)Primarily utilized for vector graphics, sharp line artwork, and clean typography.
Portable Document Format (
.PDF)Historical Context: Developed around 2003 to resolve cross-platform incompatibilities between PC and Mac hardware and early web browsers (Internet Explorer, Yahoo, AOL). Originally engineered for universal text rendering.
Function in Graphic Design: Represents the universal standard for print production ("the MP3 of the design world").
Trade-Offs: While
.TIFFand.EPSyield higher ultimate print fidelity on high-grade archival paper,.PDFoffers smaller file sizes and seamless web transmission (e.g., emailing design files from Roanoke to commercial printers in Atlanta, Spokane, or Hong Kong). On standard commercial paper stock, visual differences between.PDFand uncompressed formats are negligible.Media Quality Analogy:
Audio Fidelity Hierarchy: Reel-to-Reel Tape > Vinyl Records > Compact Discs (CDs) > MP3 files.
Transport Convenience: MP3s are universally adopted because carrying 100,000 digital files outperforms transporting 10,000 physical CDs or vinyl albums. Similarly,
.PDFis adopted for print production due to superior distribution convenience.
Universal File Formats for Web and Web/Raster Rules
Overview of Key Web Formats
Web graphics rely on three main universal formats: JPEGs (
.JPG/.JPEG), GIFs (.GIF), and PNGs (.PNG).
Joint Photographic Experts Group (
.JPEG/.JPG)Primary application: Continuous tone photographic raster images on web pages.
Historical Origin: Developed in the 1960s by news agencies to transmit wire photos over sub-oceanic telephone lines during the Vietnam War (enabling image transmission from Thailand and Vietnam to Los Angeles and San Francisco). Historically featured in news wire machines depicted in film thrillers (e.g., the fax composite rendering of Kaiser Solsze in The Usual Suspects).
File Structure Vulnerability: JPEGs are highly fragile compression formats designed originally to minimize file size over low-bandwidth telephone lines.
Destructive Re-interpolation: Opening a raw JPEG, editing it in image processing software (Photoshop, Lightroom), and hitting save triggers automatic re-interpolation.
Degradation Mechanism: Each editing save cycle shifts dark pixels closer to pure black, shifts light pixels closer to pure white, forces mid-tones toward gray, and permanently discards intermediate image data. Repeated saving results in progressive image degradation.
Core Design Rule: Never edit a raw JPEG directly.
Correct Editing Workflow: Open the initial raw photo or JPEG, immediately re-save it as a native Adobe Photoshop document (
.PSD) or.TIFF, execute all editing and retouching within that native format, save master edits, and export a final copy back out to.JPEGfor web deployment.
Graphics Interchange Format (
.GIF) and Portable Network Graphics (.PNG)Primary application: Web vector graphics, solid flat shapes, logos, and frame-by-frame animation (
.GIF).Feature Capability: Both
.GIFand.PNGsupport transparent pixels and alpha channel background transparency, a feature that.JPEGformats cannot render.