Electronic Illustration What and Why? Different Systems Pixel Painting Drafting and CAD Systems Geometric Illustration Systems Digital Prepress The Future Integrated Editors New Techniques What is it? Computer Generated Pictures Included in a Document Emphasis on Illustration Example? Why use It? Inevitable for Electronic Documents Text is On-Line Pictures must be On-Line Should be more Flexible Electronic Clip Art Tailor Image to Application Focus Print Media Quality Standards Previously Established Text, Lines Grayscale, Color examples of real images Examples of CG images Examples of Illustrator images Push Graphic Arts Technology Improve Quality of Documents Easier to Use New Techniques Illustration Producing Systems Bitmap and Pixel Painting Drafting and CAD Systems Geometric Illustration Systems Digital Prepress Examples Of Each Points of Discussion User Model User Interface Basic Representation Graphic Arts Quality Issues Strengths and Weaknesses Bitmap and Pixel Painting User Model Brush and Paint Output is Array of Pixels Bitmap and Pixel Painting (Jaggy) Graphic Arts Quality Issues Images are "Jaggy" (jaggy vs smooth) Images not Manipulable (foreground/background) Monitor Oriented Colors Fonts Textures Bitmap and Pixel Painting Strengths and Weaknesses Strengths Easy to Learn and Use Ubiquitous Flexible (air-brushed, etc) Weaknesses Unstructured Generally Low Resolution "Jaggy" when Printed Drafting and CAD Systems (CAD screen) User Model Construct Geometric Models 2D Mechanical Drafting Paradigm 3D Surface or Solid Geometric Models Precision is Key Drafting and CAD Systems (42) Graphic Arts Quality Issues Plotter Style Limited Line Weights Limited Area Fill Limited Font Styles 3D Rendering Convert to 2D Treat as Image Drafting and CAD Systems Strengths and Weaknesses Strengths Resolution Independent Geometric Operations Manipulate Objects Weaknesses Complex User Interface Missing Style Elements Geometric Illustrators (Griffin UI sequence) User Model Construct Shapes Graphic Arts Imaging Model 2D with Overlap Fill or Stroke Outlines Multiple Fonts Support High Resolution Output Geometric Illustration Systems (Illustrator Examples) Graphic Arts Quality Issues Graphic Arts Imaging Model User Interface Defines Flexibility Style Choices Text Formatting First Choice for Desk-top Publishing Geometric Illustration Systems Strengths and Weaknesses Strengths Resolution Independent Geometric Operations Style Elements Included Weaknesses Difficult To Use Inflexible Digital Prepress (Digital Darkroom) User Model Digital Darkroom Scanned, Full Color Images Paste-Up with Typeset Text Output to Commercial Printer Digital Prepress (Commercial Page) Graphic Arts Quality Issues Commercial Quality Full Color Images Color Control Color Separation Unstructured Digital Prepress Strengths and Weaknesses Strengths Page Layout Page Production Commercial Quality Weaknesses Expensive Difficult to Use Old Technology Distinctions are Blurring "Combined" Illustrators Paint with Prepress Illustrators with CAD Raster with Geometric Formatted Text with Graphics More Powerful Hardware More Sophisticated Users Paint with Prepress Improve User Interface Image Processing Automasking Edge Enhancement Color Correction Digital Originals Interface to Printing CAD with Illustration Precise Measurement (doug's house plan) Alignment Lines Grids, Constraints Illustrator "style" (Gargoyle) Illustrator User Interface 3D Graphics Raster with Geometric Trace over Raster Image (Adobe Illustrator) Simple Geometry with Scanned (Prepress) Include Painted or Scanned Images (Gargoyle) Edit Raster or Geometric Universal Illustrator? Massive System Problem Common Imaging Model Common Data Structures Complex User Interface Problem Cooperating Editors Multiple Editors Active on One Page Object-Oriented Capabilities Display File Accept Input Shared Resources Input, Output Issue of Overlapping Computation with Illustration Push Graphic Arts Technology? Conventional Procedures Faster and with Higher Quality Enable new ways of thinking about Illustration and Design Faster and Better Make Original Artwork Faster Drawing/taping Cut and Paste Photography Make Production Faster Layout Typesetting Color Separation User Interface Issues Reuse Artwork Integrate Pictures from Different Systems Edit Existing Figures Automatically Adjust Existing Figures Advanced PageLayout Scale to Fit Graphical Style Future Directions Complexity (2 Griffins, Dragon, one more...) New ways of Handling old forms Art Text (Illuminated capitals, Text along curve, Picture from Russ and Mary's wall) Better Color Control (transfer station blue, Dragon poster) Texture Computed Designs Repetitive Structures Progressions (TransferStation Blue, Wong) Non-linear Transformations (spiral, CandyCane, Leaves) More Flexible Object Structure (Shape slide, some examples from Wong) 3D techniques (perspective, 3D modeling) Conclusions Illustration Systems Different User Models Different Representations Different Strengths and Weeknesses Future Directions Integrated Systems Expanded Library of Techniques Κ˜head˜J˜ code˜L˜Ileft˜M˜M˜—˜ L˜J˜——˜ L˜L˜L˜L˜LšΟi ˜ —˜ ˜#J˜J˜J˜—˜J˜J˜——˜šœ˜L˜L˜ L˜Lš˜Lš˜Lš˜—L˜˜J˜J˜ J˜——šΟb˜M˜M˜M˜M˜Iright˜NšΠbi˜—˜šœ ˜ M˜M˜—Mšœ˜Mšœ˜—šœ%˜%Mšœ˜Mšœ˜—šœ=˜=M˜$M˜.˜M˜M˜M˜——šœ2˜2šœ ˜ M˜M˜ J˜—˜ M˜ M˜M˜——šœ0˜0M˜M˜M˜$M˜—šœ9˜9˜ Mšœ˜Mšœ˜M˜—šœ ˜ Mšœ ˜ Mšœ˜——šœ1˜1˜ M˜M˜M˜—˜ M˜M˜——šœ7˜7M˜˜Mšœ˜M˜M˜—Mšœ˜—˜QM˜šœ"˜"Mšœ ˜ Mšœ˜—M˜$—˜7˜ M˜M˜M˜—˜ M˜M˜ ——šœ.˜.M˜M˜M˜Mšœ˜—šœ?˜?Mšœ˜˜Mšœ ˜ Mšœ˜—Mšœ ˜ —šœ)˜)˜ M˜ M˜Mšœ˜—˜ M˜ M˜J˜——˜˜L˜L˜L˜L˜L˜—L˜L˜—˜L˜˜L˜ L˜L˜—L˜L˜—˜˜'L˜L˜—L˜L˜L˜ —˜L˜+L˜'L˜,L˜—˜˜J˜J˜—J˜—˜L˜#˜L˜L˜L˜ —˜J˜ J˜—J˜—˜L˜6L˜9—˜˜J˜J˜ J˜ —˜J˜J˜ J˜—J˜—˜ J˜)J˜˜%J˜J˜ J˜——˜J˜,˜J˜TJ˜;J˜—˜J˜J˜)J˜6—J˜EJ˜(—˜ ˜J˜J˜J˜"—J˜˜J˜J˜—J˜J˜——…—₯