Temat 15: Grafika rastrowa vs wektorowa – różnice i zastosowania
📘 Teoria
🖼️ Czym jest grafika komputerowa?
Grafika komputerowa to sposób tworzenia, edytowania oraz prezentowania obrazów przy użyciu komputera.
Wyróżniamy dwa podstawowe rodzaje grafiki:
- 🎨 grafika rastrowa (bitmapowa)
- 📐 grafika wektorowa
Oba typy grafiki mają inne zastosowania i właściwości.
🎨 Grafika rastrowa
Grafika rastrowa składa się z małych punktów zwanych pikselami. Każdy piksel posiada określony kolor.
📌 Cechy grafiki rastrowej
| Cecha | Opis |
|---|---|
| 🟦 Piksele | obraz zbudowany z punktów |
| 🔍 Powiększanie | utrata jakości przy skalowaniu |
| 📷 Zastosowanie | zdjęcia i fotografie |
| 💾 Rozmiar pliku | często duży |
| 🎨 Kolory | bardzo dokładne odwzorowanie |
📋 Popularne formaty rastrowe
| Format | Zastosowanie |
|---|---|
| 🖼️ JPG / JPEG | zdjęcia i fotografie |
| 🎨 PNG | grafiki z przezroczystością |
| 📄 BMP | obrazy bitmapowe Windows |
| 🌐 GIF | proste animacje |
| 📷 TIFF | druk i profesjonalna grafika |
📌 Przykłady zastosowań
- fotografie cyfrowe
- tapety komputerowe
- grafiki internetowe
- edycja zdjęć
📐 Grafika wektorowa
Grafika wektorowa składa się z figur geometrycznych opisanych matematycznie.
📌 Cechy grafiki wektorowej
| Cecha | Opis |
|---|---|
| 📏 Skalowanie | brak utraty jakości |
| 📐 Elementy | linie, figury i krzywe |
| 💾 Rozmiar pliku | zazwyczaj mały |
| 🎨 Zastosowanie | logo i projekty techniczne |
| 🖋️ Edycja | łatwa zmiana obiektów |
📋 Popularne formaty wektorowe
| Format | Zastosowanie |
|---|---|
| 📐 SVG | grafika internetowa |
| 🖋️ CDR | CorelDRAW |
| 🎨 AI | Adobe Illustrator |
| 📄 EPS | druk profesjonalny |
📌 Przykłady zastosowań
- logo firm
- ikony
- projekty techniczne
- mapy
- rysunki techniczne
⚖️ Porównanie grafiki rastrowej i wektorowej
| Cecha | Rastrowa | Wektorowa |
|---|---|---|
| Budowa | piksele | figury matematyczne |
| Skalowanie | utrata jakości | bez utraty jakości |
| Zastosowanie | zdjęcia | logo i schematy |
| Rozmiar pliku | większy | mniejszy |
| Edycja | trudniejsza | łatwiejsza |
💻 Programy graficzne
| Program | Typ grafiki |
|---|---|
| 🖼️ GIMP | rastrowa |
| 📷 Photoshop | rastrowa |
| 📐 Inkscape | wektorowa |
| 🖋️ CorelDRAW | wektorowa |
| 🎨 Adobe Illustrator | wektorowa |
🔍 Rozdzielczość obrazu
Rozdzielczość określa liczbę pikseli obrazu. Im większa rozdzielczość, tym lepsza jakość grafiki rastrowej.
📌 Jednostki rozdzielczości
| Jednostka | Znaczenie |
|---|---|
| 🖥️ px | piksele |
| 🖨️ DPI | punkty na cal |
| 📄 PPI | piksele na cal |
Przykład:
1920 × 1080 px → rozdzielczość Full HD
✅ Zalety obu typów grafiki
| Grafika rastrowa | Grafika wektorowa |
|---|---|
| realistyczne zdjęcia | idealne skalowanie |
| dokładne kolory | małe pliki |
| fotografia cyfrowa | łatwa edycja obiektów |
| obsługa efektów | profesjonalne logo |
⚠️ Najczęstsze błędy
- powiększanie grafiki rastrowej
- używanie JPG do logo
- zbyt mała rozdzielczość zdjęć
- zły dobór formatu pliku
- utrata jakości przy kompresji
Błąd:
Logo zapisane jako JPG i powiększone.
Poprawnie:
Logo zapisane jako SVG lub AI.
🧠 Ćwiczenia
- Podaj różnice między grafiką rastrową i wektorową.
- Wymień trzy formaty grafiki rastrowej.
- Wymień dwa formaty grafiki wektorowej.
- Podaj zastosowania grafiki rastrowej.
- Podaj zastosowania grafiki wektorowej.
- Wyjaśnij pojęcie piksela.
- Podaj przykłady programów graficznych.
- Wyjaśnij znaczenie rozdzielczości obrazu.
- Wskaż najlepszy format dla logo.
- Porównaj JPG i PNG.
- rastrowa = piksele, wektorowa = figury
- JPG, PNG, BMP
- SVG, AI
- zdjęcia i fotografie
- logo i projekty techniczne
- najmniejszy punkt obrazu
- GIMP, Photoshop, Inkscape
- wpływa na jakość obrazu
- SVG
- PNG obsługuje przezroczystość
📊 Zadania egzaminacyjne
Zadanie 1
Porównaj grafikę rastrową i wektorową oraz podaj ich zastosowania.
Zadanie 2
Dobierz odpowiedni format pliku dla: logo firmy, zdjęcia cyfrowego oraz grafiki internetowej.
Zadanie 3
Wyjaśnij wpływ rozdzielczości na jakość grafiki rastrowej.
Zadanie 4
Wymień programy służące do obróbki grafiki rastrowej i wektorowej.
Zadanie 5
Wyjaśnij, dlaczego grafika wektorowa jest stosowana przy projektowaniu logo.
📝 Test – 10 pytań
1. Grafika rastrowa składa się z:
2. Grafika wektorowa:
3. JPG jest formatem:
4. SVG jest formatem:
5. Grafika wektorowa jest najlepsza dla:
6. Piksel to:
7. PNG obsługuje:
8. Inkscape służy do grafiki:
9. Rozdzielczość obrazu wpływa na:
10. BMP to format:
📎 Materiały dodatkowe
👨🏫 Dla nauczyciela
Warto przygotować ćwiczenie praktyczne polegające na porównaniu jakości obrazów po powiększeniu. Uczniowie mogą analizować różnice między grafiką rastrową i wektorową oraz dobierać odpowiednie formaty plików do konkretnych zastosowań.