2.7. Растрлық және векторлық суреттерді салыстыру

Информатика, 5 сынып. Оқулық: Қадырқұлов Р. А., Нұрмұханбетова Г. К. (Алматыкітап баспасы, 2023). 2 бөлім: Компьютерлік графика. 55–61-беттер.

Нені үйренесің

• Растрлық суреттің үш негізгі параметрін атауды: өлшемі, түс моделі, айыруы.
• Фотоның өлшемін мегапиксельмен есептеуді.
• Файл форматтарын ажыратуды: қайсысы растрлық, қайсысы векторлық.
• Растрлық және векторлық графиканы кесте бойынша салыстыруды: артықшылықтары мен кемшіліктері.
• Тапсырмаға қандай графика лайық екенін таңдауды: фото, логотип, схема, визитка.

Ой қозғау

• Растрлық және векторлық графикалық редакторлардың жұмысынан қандай айырмашылықтар байқадың? Растрлық редактор (Paint, Paint.NET) пиксельдерді бояйды. Векторлық редактор (Inkscape, CorelDRAW) фигураларды нүктелер мен сызықтар бойынша салады.
• Растрлық және векторлық графиканы біріктіріп, бір графикада істеуге бола ма? Бір түрге біріктіруге болмайды: олар суретті түбегейлі әртүрлі сақтайды — растр нүктелерден тұратын «мозаика» ретінде, вектор фигуралардан тұратын «рецепт» ретінде. Бірақ бір жұмыста оларды үйлестіруге болады: мысалы, векторлық жазуы бар фотосурет.
• Фотоны қатты үлкейтсе не болады? Төртбұрышты пиксельдер пайда болады, жиектерінде «баспалдақ» көрінеді.

Тақырыпты талдаймыз

Растр — пиксельдерден жасалған мозаика

Растрлық сурет — пиксель деп аталатын кішкентай түсті шаршылардан тұратын тор. Телефоннан түскен фото, скриншот, сканерленген сурет — бәрі растр. Растрлық суреттің үш негізгі параметрі бар.

1. Өлшемі (Размер) — онда қанша пиксель бар екені. Енін биіктігіне көбейтеміз. 2000 × 1000 фото — 2 000 000 пиксель, яғни 2 мегапиксель (Мп). Мега — миллион.

🌟 Фотоаппараттар мен телефондардың сипаттамасында камерасында неше мегапиксель бар екені жазылады. Оқулықтағы фотоаппаратта 16.0 деп жазылған — демек, оның суреттері шамамен 16 миллион нүктеден тұрады.

2. Түс моделі (Цветовые модели) — әр пиксельдің түсі қалай жазылатыны. Ең танымалы — RGB (қызыл, жасыл, көк). Оны компьютерлер, телефондар және барлық экрандар пайдаланады.

3. Айыру (Разрешение) — нүктелердің қаншалықты тығыз тұрғаны. Қандай айыру керек екені суреттің не үшін керегіне байланысты. Мысалы, интернетке арналған суретке 72 пиксель/дюйм жеткілікті, ал принтерден қағазға басып шығару үшін 300 пиксель/дюйм қажет. Кішкентай аватарға нүкте аз да болады, үлкен плакатқа өте көп керек.

Форматтар: сурет файлда қалай жатады

• GIF — желідегі жарияланымдарға қолданылады: файлы кішкентай, қарапайым анимация жасауға болады (сол «гифтер»), бірақ түсі аз.
• PNG — интернетке арналған: мөлдір фон жасай алады және суреттің сапасын төмендетпей сығады, түсі толық.
• JPG (JPEG) — фотосуреттерге арналған: файлы кішкентай, бірақ қатты сыққанда сапасы сәл төмендейді.
• TIFF, BMP — бұлар да растрлық форматтар.
• Векторлық форматтар: CDR, WMF, EPS, сонымен бірге интернетте өте танымал SVG.

📕 Оқулықта GIF форматы «коммерциялық мақсатта пайдалануға жарамайды» деп жазылған. Бұл ескірген пікір: ол ертеде болған патенттік шектеулерден қалған, қазір GIF-ті еркін қолданады.

Үлкен салыстыру

📕 Оқулықтағы кестеде вектор «басу қиын» деп жазылған. Бұл дұрыс емес: векторлық суреттер кез келген өлшемде анық басылады, көбіне растрдан да жақсы.

Мәтінде оқулық растрды былай қолданады: түс гаммасы мол графикалық объектілерді құруда, сайт схемаларын құруда, фотосуреттерді өңдеуде. Векторды — баспа ісінде, визитка карточкаларын безендіруде, бүктеме және т.б. заттарды басып шығаруда, безендіруде.

Оқулықтағы суретте бір жасыл сызықты лупамен үлкейткен. Растрлық сызық баспалдақ-шаршыларға ыдырады, ал векторлық сызық тегіс жолақ күйінде қалды. Бүкіл айырмашылық бір суретте көрінеді!

📌 Растр — фотолар мен реңкі бай суреттерге арналған. Вектор — үлкейтіп, кез келген өлшемде басып шығару керек нәрсеге арналған: логотиптер, схемалар, визиткалар.

💡 Растр мен вектор қарсылас емес, серіктес. Концерт афишасы: әншінің фотосы — растр, жазулары мен логотипі — вектор.

👨‍👩‍👧 Ата-анаға. Баладан отбасылық бизнестің логотипіне қандай графиканы, ал мереке фотосына қандайын таңдау керектігін сұраңыздар. Таңдауын түсіндіре алса — тақырып түсінікті болғаны.

Түсінгеніңді тексер

Өзіңді тексер

• Растрлық графиканың үш негізгі параметрін ата. Өлшемі, түс моделі, айыруы.
• Фотоның пиксельмен өлшемін қалай білеміз? Енін биіктігіне көбейтеміз.
• Мегапиксель дегеніміз не? Миллион пиксель.
• Растрлық және векторлық графиканың ең кіші бірлігі қандай? Растрдың — пиксель, вектордың — геометриялық фигура (сызық, шеңбер және т.б.).
• Векторлық графиканы қайда қолданады? Баспа ісінде, визиткаларда, бүктемелерде, сызбалар мен схемаларда.

Жаттығуларды шығарамыз

№ 1

(оқулықта нөмірсіз: «Талдау», топпен жұмыс) Растрлық және векторлық графиканы салыстыру кестесіне қараңдар (1-кесте). Олардың ұқсастығы мен айырмашылығын топтастырып, қорытынды тұжырым ұсыныңдар.

Қалай ойлаймыз. Кестенің жолдарымен жүр: екі түрде не бірдей, ал қай жерде олар ажырайды.

Жауап үлгісі.

• Ұқсастықтары: екеуі де — компьютерлік графиканың түрлері; екеуінің де өз редакторлары мен форматтары бар; екеуі де түсті болады; оларды бір жұмыста үйлестіруге болады.
• Айырмашылықтары: неден тұратыны (пиксельдер немесе фигуралар), үлкейткендегі сапасы, файл көлемі, фото, форматтары, қолданылу саласы.
• Қорытынды: фото үшін — растр, масштабтау керек нәрсе үшін — вектор.

Жауабы: олардың ортағы тек «табиғаты» (компьютерлік графика), ал құрылысы әртүрлі; сондықтан әрқайсысын өз тапсырмасына қарай таңдайды.

№ 2

(оқулықта нөмірсіз: «Жинақтау») 3-суретте екі автомобильдің суреті берілген. Осы суреттерді торкөз қағазға салыңдар. Қандай айырмашылық байқадыңдар? Бұл суреттердің қайсысы векторлық, қайсысы растрлық графика? Екі суретті қағазға түсіру кезінде не байқадыңдар? Қай суретті салу оңай болды, қайсысы қиын болды?

Қалай ойлаймыз. 1-сурет тор көздермен салынған — әр боялған көз пиксель сияқты. 2-сурет тегіс сызықтармен және дөңгелек фигуралармен салынған.

Жауап үлгісі.

• Айырмашылық: бірінші машина «баспалдақ» тәрізді, жиектері шаршылардан тұрады; екіншісінің жиектері тегіс, дөңгелектері тап-тұйнақтай шеңбер.
• Қайсысы қайсы: 1-сурет — растрлық, 2-сурет — векторлық.
• Не байқадым: растрлық машинканы тор көзді бір-бірлеп бояп саласың, көздерді санау керек. Векторлық машинканы сызықтармен саласың, тор көздің маңызы жоқ.
• Қайсысы қиын: растрлықты салу ұзағырақ, әр көзді бояу керек. Немесе векторлықты қолмен майысқан сызықтар мен дөңгелектерді тегіс салу қиын. Түсіндіре алсаң, екі пікір де дұрыс.

Жауабы: 1-сурет — растрлық (тор көз-пиксельдерден), 2-сурет — векторлық (тегіс фигуралардан).

№ 3

(оқулықта нөмірсіз: «Бағалау») Растрлық және векторлық графиканың компьютер графикасы үшін маңызын бағала.

Қалай ойлаймыз. Олардың біреуінсіз әлемді елестет: не жоғалады?

Жауап үлгісі.

• Растрсыз цифрлық фотолар, скриншоттар, суреттерді өңдеу, ойындар мен сайттардағы суреттердің көбі болмас еді.
• Векторсыз анық қаріптер, логотиптер, белгішелер, сызбалар, үлкейтуге болатын карталар болмас еді.
• Демек, екеуі де бірдей маңызды және бір-бірін толықтырады.

Жауабы: екеуі де керек: растр — фотолар мен күрделі реңктер үшін, вектор — фигуралар, мәтін және масштабтау үшін.

№ 4

(оқулықта нөмірсіз: «Тапсырма») 4-суретте берілген мектеп ғимаратының кескінін Paint.NET және Photo-Brush бағдарламаларында орында. Суреттің сапалы шығуына назар аудар. Түс моделін қадағалап, ретте. Екі бағдарламада жасалған суретті *.jpg форматында сақта.

Қалай ойлаймыз. Мектептің дерлік бәрі тіктөртбұрыштардан тұрады — фигуралармен салу ыңғайлы.

Жауабы: мектеп суреті бар екі JPG файл. Үлкейткенде растрлық суреттегі фигуралардың жиектері «баспалдақ» болады.

💡 Photo-Brush болмаса, тегін векторлық Inkscape редакторын ал — салыстыру одан да айқын шығады.

№ 5

(Ойлануға берілген сұрақтар, оқулықтағы № 1) Векторлық және растрлық графиканың қандай әлсіз тұстары бар?

Қалай ойлаймыз. Кестеден бір графика екіншісінен ұтылатын жолдарды қара.

Жауап үлгісі.

• Растр: үлкейткенде сапасы нашарлайды; файлдары үлкен; суреттегі жеке заттарды өзгерту қиын — бәрі бір нүктелер торына жабысып қалған.
• Вектор: нағыз фотосуретті жасау мүмкін емес; реңктердің біртіндеп ауысуын беру қиын; арнайы бағдарламалар керек, әр бағдарлама векторлық форматты аша бермейді.

Жауабы: растр үлкейтуден қорқады және «салмағы» ауыр; вектор фотоға және күрделі реңктерге жарамайды.

№ 6

(Ойлануға берілген сұрақтар, оқулықтағы № 2) Векторлық графикадағы сурет үлкейтілгенде растрлық графикамен салыстырғанда неге сапасын жоғалтпайды? Себебін түсіндір.

Қалай ойлаймыз. Әр жағдайда файл нені сақтайды?

Жауап үлгісі.

• Растрлық файлда әр нүктенің қандай түсті екені жазылған. Үлкейткенде нүктелер көбеймейді — әрқайсысы жай ғана үлкен шаршыға созылады. Содан «баспалдақ» шығады.
• Векторлық файлда фигуралар жазылған: «сызық мұнан мұнға дейін», «центрі және радиусы мынандай шеңбер». Үлкейткенде компьютер фигураларды үлкен өлшемде қайтадан салады, сондықтан жиектері тегіс қалады.

Жауабы: вектор фигуралардың «рецептін» сақтап, кез келген өлшемде қайта салады, ал растр дайын нүктелерді созады.

№ 7

(Ойлануға берілген сұрақтар, оқулықтағы № 3) Егер растрлық немесе векторлық графиканың біреуі болмаса, қандай кедергіге тап боламыз?

Қалай ойлаймыз. Компьютерде жасалған суреттерді қай жерде кездестіретініңді еске түсір.

Жауап үлгісі.

• Фотоны өңдеуге болмас еді: «қызыл көзді» алу, жарықтықты түзету.
• Логотип, ашық хат, афиша, баннер жасау мүмкін болмас еді — тек қолмен салу керек.
• Схемалар мен карталарды сызу, ойындар мен мультфильмдер жасау, сайттар мен оқулықтарды безендіру қиындап кетер еді.

Жауабы: суреттерді жасау мен түзетудің ыңғайлы тәсілінен айырылар едік; дизайн, жарнама, ойындар және баспа ісі айтарлықтай қиындайды.

№ 8

(Ойлануға берілген сұрақтар, оқулықтағы № 4) Векторлық және растрлық графиканың қандай ұқсас тұстары бар?

Қалай ойлаймыз. Ұқсастық — екеуіне де сәйкес келетін нәрсе. Айырмашылық — олар қарама-қарсы болатын жері.

Жауап үлгісі.

• Ұқсастықтары: екеуі де компьютерде сурет жасау тәсілдері; редакторлары мен файл форматтары бар; түсті қолдайды.
• Айырмашылықтары: пиксельдер мен фигуралар; фото мен сызбалар; үлкейткендегі сапасы; файл көлемі; форматтары (JPG, PNG — растр; CDR, EPS, SVG — вектор).

Жауабы: ортақ жері — мақсаты (компьютерде сурет жасау); айырмашылықтары — құрылысы, үлкейткендегі сапасы, көлемі, форматтары және қолданылу салалары.

№ 9

(«Үй тапсырмасы») Векторлық және растрлық графикаларды салыстыр (интернетті пайдалан). Салыстыру нәтижесін бір бет көлеміндегі есеп түрінде ұсын. Зерттеу сұрақтары мен бағыттары: векторлық графика негіздері, растрлық графика негіздері, ұқсастығы мен айырмашылығы, қолданылатын салалары, тиімді жақтары.

Қалай ойлаймыз. Бір слайд — бір ой. Мысал-суреттер сөзден көбірек көмектеседі.

Презентация жоспарының үлгісі.

1. Титулдық слайд: тақырып, аты-жөні, сынып.
2. Растрлық графика: пиксельдер, мегапиксельдер, RGB, JPG, PNG, GIF форматтары; мысал — фото.
3. Векторлық графика: фигуралар мен сызықтар, CDR, EPS, SVG форматтары; мысал — логотип немесе белгіше.
4. Ұқсастықтары мен айырмашылықтары: кесте немесе Эйлер шеңберлері; «лупа астындағы сызық» суреті.
5. Қолданылатын салалары: растр — фотолар, сайттар; вектор — визиткалар, бүктемелер, сызбалар.
6. Қорытынды: екеуі де керек және бір-бірін толықтырады.

Презентацияны PowerPoint-те, тегін LibreOffice Impress-те немесе Google Презентацияларында жасауға болады.

Жауабы: жоғарыдағы жоспар бойынша 5–7 слайдтан тұратын презентация.

Жадынама

• Масштабтау — масштабтау — масштабировать — to scale.
• Дөңгелек — дөңгелек — круг — round.
• Пиксель — растрлық суреттің ең кішкентай нүктесі.
• Мегапиксель (Мп) — миллион пиксель.
• Түс моделі — түсті жазу тәсілі; ең танымалы — RGB.
• Айыру — сурет нүктелерінің қаншалықты тығыз тұрғаны.

Шағын тест