Summary of Introduction to Digital Graphics

Introduction to Digital Graphics: A Student's Guide

Summary Knowledge test Flashcards Podcast Mindmap

Introduction

Graphics and digital graphics combine art, technology and communication to create images, illustrations and visual messages. They are used in advertising, film, games, product design, education, apps, websites and social media. This material breaks down core concepts, shows practical examples and compares key formats and tools.

What are graphics?

Graphics are visual images used to communicate ideas, information, or emotions.

Graphics can be divided into two main types:

Artistic graphics

Connected with traditional art and visual expression.
Examples: drawing, illustration, printmaking, posters.
Primary goal: express emotion or an artistic idea.

Applied graphics

Practical and commercial in purpose.
Examples: marketing visuals, packaging, logos, magazines, advertising.
Primary goal: communicate a clear message and attract an audience.

Digital graphics

With computers and digital devices, most graphics are now created and edited digitally. Digital graphics are typically faster to produce, easier to edit, and cheaper to distribute.

Digital graphics are images created or edited on computers, tablets, or mobile devices for use in media, design, and communication.

Common uses:

Websites and mobile apps
Films and animation
Video games and 3D environments
Product visualization and architecture
Medical imaging and scientific visualization

💡 Did you know?Did you know that most modern movie effects combine 2D compositing and 3D rendering to create realistic scenes?

Raster vs Vector graphics

Two fundamental digital image types are raster and vector. Comparing them helps decide which to use.

Feature	Raster graphics	Vector graphics
Basic unit	Pixels	Mathematical shapes (points, lines, curves)
Scalability	Loses quality when scaled up	Scales without quality loss
Best for	Photographs, textures, digital painting	Logos, icons, typography, illustrations
Common formats	JPG, PNG, GIF, TIFF	SVG, AI, EPS, PDF
Typical programs	Adobe Photoshop, GIMP, Procreate, Krita	Adobe Illustrator, CorelDRAW, Inkscape

Raster graphics (details)

Built from a grid of pixels; each pixel stores a color value.
Zooming in reveals pixels and can make the image appear blurry.
Ideal for continuous-tone images such as photos and paintings.

Practical example: A photograph taken on a phone is a raster image; enlarging it too much shows pixelation.

Vector graphics (details)

Defined by mathematical equations for lines and curves (paths).
Can be scaled to any size without losing sharpness—useful for print and signage.
Ideal for logos, icons, and any design that requires crisp edges at different sizes.

Practical example: A company logo designed in vector format can be printed on a business card and a billboard with equal clarity.

2D vs 3D graphics

Digital graphics can also be categorized by dimensionality.

2D graphics

Flat images with width and height only.
Used in posters, magazines, comics, websites, mobile apps and 2D animations.
Tools: Adobe Photoshop, Illustrator, Procreate, Inkscape.

3D graphics

Create objects with depth, lighting and textures.
Used in video games, films, architecture, product design and virtual reality.
Tools/engines: Blender, Maya, Cinema 4D, 3ds Max, ZBrush, Unity, Unreal Engine.

Practical example: A 3D model of a chair can be rotated, lit and rendered for product catalogs, while a 2D illustration of the same chair is a single viewpoint drawing.

Common file formats and when to use them

JPG: Compressed raster for photos (use when file size matters and slight quality loss is acceptable).
PNG: Raster with transparency (use for web graphics needing clear backgrounds).
GIF: Simple animations or small web graphics with limited colors.
TIFF: High-quality raster for print and archiving.
SVG: Scalable vector for web and interfaces.
AI/EPS/PDF: Vector formats used in professional design a

FlashcardsKnowledge testSummaryPodcastMindmap

Start for free

Already have an account? Sign in

Graphics and Digital Graphics

Klíčová slova: Graphics and Digital Graphics

Klíčové pojmy: Graphics communicate visually, Artistic vs applied graphics, Digital graphics created on computers/devices, Raster = pixels; use for photos, Vector = mathematical shapes; scalable for logos, 2D graphics are flat; 3D adds depth, Choose file format by purpose (JPG, PNG, SVG, AI), Keep editable master files with layers/paths, Use raster editors for painting; vector editors for logos, 3D workflows: modeling, texturing, lighting, rendering

## Introduction Graphics and digital graphics combine art, technology and communication to create images, illustrations and visual messages. They are used in advertising, film, games, product design, education, apps, websites and social media. This material breaks down core concepts, shows practical examples and compares key formats and tools. ## What are graphics? > Graphics are visual images used to communicate ideas, information, or emotions. Graphics can be divided into two main types: ### Artistic graphics - Connected with traditional art and visual expression. - Examples: drawing, illustration, printmaking, posters. - Primary goal: express emotion or an artistic idea. ### Applied graphics - Practical and commercial in purpose. - Examples: marketing visuals, packaging, logos, magazines, advertising. - Primary goal: communicate a clear message and attract an audience. ## Digital graphics With computers and digital devices, most graphics are now created and edited digitally. Digital graphics are typically faster to produce, easier to edit, and cheaper to distribute. > Digital graphics are images created or edited on computers, tablets, or mobile devices for use in media, design, and communication. Common uses: - Websites and mobile apps - Films and animation - Video games and 3D environments - Product visualization and architecture - Medical imaging and scientific visualization Did you know that most modern movie effects combine 2D compositing and 3D rendering to create realistic scenes? ## Raster vs Vector graphics Two fundamental digital image types are raster and vector. Comparing them helps decide which to use. | Feature | Raster graphics | Vector graphics | |---|---:|---:| | Basic unit | Pixels | Mathematical shapes (points, lines, curves) | | Scalability | Loses quality when scaled up | Scales without quality loss | | Best for | Photographs, textures, digital painting | Logos, icons, typography, illustrations | | Common formats | JPG, PNG, GIF, TIFF | SVG, AI, EPS, PDF | | Typical programs | Adobe Photoshop, GIMP, Procreate, Krita | Adobe Illustrator, CorelDRAW, Inkscape | ### Raster graphics (details) - Built from a grid of pixels; each pixel stores a color value. - Zooming in reveals pixels and can make the image appear blurry. - Ideal for continuous-tone images such as photos and paintings. Practical example: A photograph taken on a phone is a raster image; enlarging it too much shows pixelation. ### Vector graphics (details) - Defined by mathematical equations for lines and curves (paths). - Can be scaled to any size without losing sharpness—useful for print and signage. - Ideal for logos, icons, and any design that requires crisp edges at different sizes. Practical example: A company logo designed in vector format can be printed on a business card and a billboard with equal clarity. ## 2D vs 3D graphics Digital graphics can also be categorized by dimensionality. ### 2D graphics - Flat images with width and height only. - Used in posters, magazines, comics, websites, mobile apps and 2D animations. - Tools: Adobe Photoshop, Illustrator, Procreate, Inkscape. ### 3D graphics - Create objects with depth, lighting and textures. - Used in video games, films, architecture, product design and virtual reality. - Tools/engines: Blender, Maya, Cinema 4D, 3ds Max, ZBrush, Unity, Unreal Engine. Practical example: A 3D model of a chair can be rotated, lit and rendered for product catalogs, while a 2D illustration of the same chair is a single viewpoint drawing. ## Common file formats and when to use them - JPG: Compressed raster for photos (use when file size matters and slight quality loss is acceptable). - PNG: Raster with transparency (use for web graphics needing clear backgrounds). - GIF: Simple animations or small web graphics with limited colors. - TIFF: High-quality raster for print and archiving. - SVG: Scalable vector for web and interfaces. - AI/EPS/PDF: Vector formats used in professional design a