ГОСУДАРСТВЕННОЕ БЮДЖЕТНОЕ ПРОФЕССИОНАЛЬНОЕ ОБРАЗОВАТЕЛЬНОЕ УЧРЕЖДЕНИЕ ГОРОДА МОСКВЫ иЮнь

СОДЕРЖАНИЕ
ВВЕДЕНИЕ .............................................................................................................. 4
1. ОБЗОР И ОПИСАНИЕ ТЕХНОЛОГИИ СОЗДАНИЯ ПРОСТЫХ
ИЗОБРАЖЕНИЙ В ОНЛАЙН РЕДАКТОРАХ ВЕКТОРНОЙ ГРАФИКИ…...6
1.1. Векторная графика и её применение .............................................................. 6
1.2. Онлайн редакторы векторной графики .......................................................... 7
1.3. Технология создания изображений в векторных
редакторах..................................................................................................9
1.4. Примеры использования онлайн векторных редакторов ........................... 11
2. АНАЛИЗ ВОЗМОЖНОСТИ ВЕКТОРНЫХ РЕДАКТОРОВ ОНЛАЙН ..... 14
2.1. Выбор редакторов .......................................................................................... 14
2.2. Анализ возможностей онлайн редактора Vectr........................................... 15
2.3. Анализ возможностей онлайн редактора Figma…………………………..18
ЗАКЛЮЧЕНИЕ ..................................................................................................... 22
СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ ........................................... 23
ВВЕДЕНИЕ
В наше время использование онлайн редакторов векторной графики
становится все более популярным. Это связано с тем, что эти инструменты
позволяют быстро и легко создавать и редактировать изображения, не требуя
установки дополнительного программного обеспечения на компьютер.
Онлайн редакторы векторной графики предоставляют множество
инструментов, которые позволяют создавать и редактировать различные
элементы, такие как линии, кривые, фигуры и т.д. Благодаря этим
инструментам
пользователи
профессиональные
могут
изображения,
создавать
даже
если
качественные
они
не
и
являются
профессиональными дизайнерами.
Актуальность темы онлайн редакторов векторной графики связана с
растущим спросом на создание качественных векторных изображений и
дизайна.
В
настоящее
время
все
больше
людей
сталкиваются
с
необходимостью создания векторных изображений для различных проектов,
будь то создание логотипов, иллюстраций, баннеров и т.д. Онлайн редакторы
векторной
графики
стали
популярным
инструментом
для
создания
качественных векторных изображений, так как они не требуют установки
дополнительного программного обеспечения на компьютер и могут
использоваться на любом устройстве с доступом в интернет.
Таким образом, знание об онлайн редакторах векторной графики и их
возможностях является актуальным для широкого круга пользователей,
включая профессиональных дизайнеров и новичков в этой области. В данной
работе мы рассмотрим обзор и описание технологии создания простых
изображений в онлайн редакторах векторной графики, что поможет
читателям ознакомиться с этими инструментами и использовать их для
создания качественных векторных изображений.
Целью письменной экзаменационной работы является анализ
возможности векторных редакторов онлайн.
2
Для достижения поставленной цели необходимо выполнить следующие
задачи:
- проанализировать что такое векторная графика, в чём её отличие от
растровой;
- рассмотреть наиболее известные онлайн редакторы векторной графики;
- проанализировать способы создания простых векторных изображений
в онлайн редакторах векторной графики;
- проанализировать возможности онлайн векторных редакторов.
3
1. ОБЗОР И ОПИСАНИЕ ТЕХНОЛОГИИ СОЗДАНИЯ ПРОСТЫХ
ИЗОБРАЖЕНИЙ В ОНЛАЙН РЕДАКТОРАХ ВЕКТОРНОЙ ГРАФИКИ
1.1.
Векторная графика и её применение
Векторная
графика
-
это
вид
графики,
который
использует
математические формулы для создания изображений. В отличие от растровой
графики, которая использует пиксели для создания изображения, векторная
графика создает изображение из линий и кривых. Это позволяет создавать
изображения, которые могут быть масштабированы без потери качества (рис.
1.1).
Рис. 1.1. Отличие векторных изображений от растровых
Векторная графика широко применяется в различных областях, таких
как дизайн, реклама, искусство и т.д. Она используется для создания
логотипов, иллюстраций, визуализации данных, дизайна веб-страниц и
других проектов.
Кроме того, векторная графика позволяет создавать изображения с
меньшим размером файла, что делает их легче для загрузки и обработки. Это
особенно важно в случаях, когда изображения используются в веб-дизайне и
других проектах, где скорость загрузки страницы играет важную роль.
Векторная графика также позволяет создавать изображения с более
яркими и насыщенными цветами, чем растровая графика. Это происходит
благодаря тому, что векторные изображения не основаны на пикселях, а на
4
математических формулах, что позволяет использовать большое количество
цветов и оттенков.
1.2. Онлайн редакторы векторной графики
В данной главе будет рассмотрен обзор онлайн редакторов векторной
графики, которые позволяют создавать и редактировать изображения без
необходимости установки специального программного обеспечения на
компьютер.
Существует множество онлайн редакторов векторной
графики,
некоторые из них бесплатны, а другие требуют платной подписки.
Рассмотрим некоторые из них:
Canva - это один из наиболее популярных онлайн редакторов
векторной графики. Он имеет простой и интуитивно понятный интерфейс,
который позволяет создавать изображения, логотипы, иллюстрации и другие
проекты. Canva предоставляет доступ к большой библиотеке шаблонов,
изображений, иконок и шрифтов (рис. 1.2).
Рис. 1.2. Inkscape
Figma - это онлайн редактор векторной графики, который используется
для создания интерфейсов и макетов веб-страниц. Он имеет мощные
функции, такие как возможность работы в режиме реального времени и
совместной работы над проектами. Figma также имеет большую библиотеку
шрифтов и иконок (рис. 1.3).
5
Рис. 1.3. Figma
Gravit Designer - это бесплатный онлайн редактор векторной графики,
который имеет множество функций, таких как создание логотипов,
иллюстраций и других проектов. Gravit Designer имеет простой и понятный
интерфейс, который позволяет быстро создавать изображения (рис. 1.4).
Рис. 1.4. Gravit Designer
Inkscape - это бесплатный редактор векторной графики, который можно
установить на компьютер, но также есть онлайн версия. Он имеет множество
функций, таких как создание и редактирование векторных изображений,
рисование и создание иллюстраций (рис. 1.5).
Рис. 1.5. Inkscape
Vectr - это удобный и простой в использовании векторный редактор,
который
может
быть
использован
для
создания
профессиональных
изображений в различных областях. Это бесплатный инструмент, который
6
может быть использован как начинающими, так и профессионалами (рис.
1.6).
Рис. 1.6. Vectr
Каждый из рассмотренных онлайн редакторов векторной графики
имеет свои преимущества и недостатки. Однако, все они предоставляют
возможность
создавать
качественные
векторные
изображения
без
необходимости установки специального программного обеспечения на
компьютер.
1.3.
Технология создания изображений в векторных редакторах
При создании векторного изображения необходимо выбрать размер и
ориентацию изображения, а также цветовую схему. В зависимости от
проекта, можно выбрать как портретную, так и альбомную ориентацию
изображения.
Использование инструментов - в онлайн редакторе векторной графики
доступны различные инструменты для создания линий, кривых, фигур и
других элементов. Некоторые из них включают в себя кисти, формы, пипетки
и другие. Кисти позволяют создавать линии и кривые любой формы и
толщины. Формы позволяют создавать готовые элементы, такие как круги,
квадраты, треугольники и другие. Пипетки позволяют выбрать цвет
изображения для использования в других элементах.
Редактирование элементов - после создания элементов можно
использовать инструменты для редактирования и изменения их формы,
размера и цвета. Например, можно изменить толщину линии или добавить
7
новый цвет заливки. Также можно изменить форму элемента, перемещать его
или изменять его размер.
Добавление текста - в онлайн редакторе векторной графики также
доступны инструменты для добавления текста. Можно выбрать шрифт,
размер и цвет текста, а также его расположение на изображении. Текст
можно добавлять как отдельный элемент, так и внутри других элементов.
Экспорт изображения - после завершения работы над изображением,
его можно экспортировать в различных форматах, таких как PNG, SVG, PDF
и другие. Экспортирование изображения позволяет сохранить его на
компьютере или поделиться им в Интернете.
Примеры создания различных изображений:
Логотип - для создания логотипа в онлайн редакторе векторной
графики необходимо выбрать форму и цвет, а также добавить текст. Можно
использовать инструменты для изменения формы и размера элементов, а
также для добавления теней и других эффектов. Важно учесть, что логотип
должен быть узнаваемым и отражать основные идеи и ценности бренда
(рис.1.7).
Рис. 1.7. Логотипы
Иллюстрация - для создания иллюстрации можно использовать кисти и
формы для создания различных элементов, а также инструменты для
редактирования и изменения их формы и размера. Иллюстрация может быть
8
создана как для развлекательных целей, так и для образовательных или
информационных (рис. 1.8).
Рис. 1.8. Иллюстрация
Дизайн веб-страницы - для создания дизайна веб-страницы можно
использовать различные инструменты для создания элементов, таких как
кнопки, формы, меню и другие. Можно также добавлять текст и
изображения, а также использовать инструменты для изменения цвета и
размера элементов. Дизайн веб-страницы должен быть удобным для
пользователя и отражать основные идеи и ценности сайта.
Рис. 1.9. Дизайн веб-страницы
1.4. Примеры использования онлайн векторных редакторов
Дизайн логотипов - онлайн редакторы векторной графики позволяют
создавать качественные логотипы для компаний и брендов. Многие из них
9
предоставляют доступ к большой библиотеке шрифтов, иконок и других
элементов, что позволяет создавать уникальные и профессиональные
логотипы.
Иллюстрации
-
онлайн
редакторы
векторной
графики
также
используются для создания иллюстраций для книг, журналов и других
печатных материалов. Они позволяют создавать качественные изображения,
которые могут быть масштабированы без потери качества.
Дизайн
веб-страниц
-
онлайн
редакторы
векторной
графики
используются для создания дизайна веб-страниц и интерфейсов. Они
позволяют создавать элементы, такие как кнопки, формы, меню и другие, а
также добавлять текст и изображения.
Визуализация данных - онлайн редакторы векторной графики
используются для визуализации данных в виде диаграмм, графиков и других
элементов. Они позволяют создавать качественные и профессиональные
изображения, которые могут быть использованы в презентациях и отчетах.
Рекламные материалы - онлайн редакторы векторной графики
используются для создания рекламных материалов, таких как баннеры,
брошюры
и
другие.
профессиональные
Они
позволяют
изображения,
создавать
которые
качественные
привлекают
и
внимание
потенциальных клиентов (рис. 2.0).
Рис. 2.0. Рекламные материалы
Искусство - онлайн редакторы векторной графики используются в
10
искусстве для создания иллюстраций, картин и других произведений. Они
позволяют художникам создавать произведения с большой детализацией и
масштабировать их без потери качества (рис. 2.1).
Рис. 2.1. Inkscape
11
2. АНАЛИЗ ВОЗМОЖНОСТИ ВЕКТОРНЫХ РЕДАКТОРОВ ОНЛАЙН
2.1. Выбор редакторов
Для анализа я выбрал два векторных редактора – Inkscape и Vectr.
Inkscape и Vectr - это два популярных векторных редактора, которые
используются для создания и редактирования векторной графики.
Inkscape - это свободно распространяемый векторный редактор с
открытым исходным кодом, который доступен для Windows, Mac OS и Linux.
Inkscape предоставляет широкий набор инструментов для создания и
редактирования
векторной
графики,
включая
рисование
кривых,
многоугольников, текста, градиентов, фигур и многого другого. Он также
поддерживает импорт и экспорт множества форматов файлов, включая SVG,
PDF, EPS и AI. Inkscape предоставляет пользователю возможность работать с
векторной графикой в любом масштабе без потери качества.
Vectr - это онлайн-векторный редактор, который также может быть
загружен как приложение для Windows, Mac OS и Linux. Он предоставляет
простой и интуитивно понятный интерфейс для создания и редактирования
векторной
графики.
Vectr
позволяет
рисовать
кривые,
линии,
прямоугольники, круги, полигоны, текст и многое другое. Он также
поддерживает совместную работу и имеет набор инструментов для общего
доступа к проектам. Vectr поддерживает экспорт в несколько форматов
файлов, включая SVG, PNG и JPEG.
Здесь я так же сравню эти два редактора с Adobe Illustrator и расскажу о
их отличиях. (рис. 2.2).
Рис. 2.2. Adobe Illustrator
12
2.2.
Анализ возможностей онлайн редактора Vectr
Онлайн редактор Vectr - это бесплатный графический редактор,
который позволяет создавать векторные изображения и дизайн. Вот его
возможности:
Создание векторных изображений - Vectr позволяет создавать
векторные изображения с помощью инструментов рисования, таких как
кривые Безье, линии, формы и т.д.
Редактирование векторных изображений - Вы можете изменять и
редактировать уже созданные векторные изображения, добавлять новые
элементы и удалять ненужные (рис. 2.3).
Рис. 2.3. Создание и редактирование векторных изображений
Интеграция с другими инструментами - Vectr поддерживает экспорт
изображений в различные форматы, такие как SVG, PNG, JPG и VECTR, что
позволяет использовать его в сочетании с другими инструментами (рис. 2.4).
Рис. 2.4. Экспорт изображений
13
Работа в реальном времени - Vectr позволяет работать в режиме
реального времени с другими пользователями, что удобно для коллективной
работы.
Быстрый старт - Vectr имеет простой и понятный интерфейс (рис. 2.5),
что позволяет начать работу с ним быстро и без особых затруднений.
Рис. 2.5. Интерфейс Vectr
Бесплатность - Vectr является бесплатным онлайн редактором, что
делает его доступным для широкой аудитории и не требует дополнительных
затрат на приобретение лицензии.
Мультиплатформенность - Vectr поддерживает работу на различных
платформах, включая Windows, Mac, Linux, а также веб-браузеры, что
позволяет использовать его на любом устройстве.
Несмотря на то, что Vectr является удобным и простым в
использовании
векторным
редактором,
он
также
имеет
некоторые
ограничения и недостатки:
Ограниченный функционал: Vectr не имеет такого широкого набора
функций, как некоторые другие векторные редакторы, такие как Adobe
Illustrator или CorelDRAW. Некоторые функции и инструменты могут быть
недоступны в Vectr.
Ограниченный выбор шрифтов: Vectr имеет ограниченный выбор
шрифтов, что может ограничить возможности при работе с текстом.
14
Ограниченный выбор цветов: Vectr имеет ограниченный выбор цветов,
что может ограничить возможности при работе с цветами и градиентами.
Ограниченный выбор форматов экспорта: Vectr поддерживает экспорт
в несколько форматов, но эти форматы могут быть ограничены и не
поддерживать все необходимые форматы.
Зависимость от интернет-соединения: Vectr работает в онлайн-режиме,
поэтому его использование зависит от быстроты и стабильности интернетсоединения. Нет возможности работы в офлайн-режиме: Vectr не имеет
возможности работы в офлайн-режиме, что может быть неудобным для
пользователей, которые не имеют доступа к интернету.
Одно из главных преимуществ Vectr - это то, что он бесплатный и
доступен как для Windows, так и для Mac. Он также имеет удобный
интерфейс и прост в использовании, что делает его идеальным для
начинающих пользователей. Vectr имеет некоторые базовые функции, такие
как создание фигур, добавление текста и редактирование элементов. Однако,
у него есть некоторые ограничения в использовании продвинутых функций,
таких как редактирование шрифтов и создание сложных эффектов.
Adobe Illustrator, с другой стороны, является более продвинутым и
мощным векторным графическим редактором, который имеет широкий
спектр функций и возможностей. Он используется профессиональными
дизайнерами и художниками для создания сложных векторных изображений,
таких как логотипы, иллюстрации, дизайн веб-страниц и многое другое.
Adobe Illustrator имеет продвинутые функции, такие как создание сложных
эффектов и фильтров, редактирование шрифтов, создание 3D-изображений и
многое другое.
В целом, Vectr - это удобный и простой в использовании инструмент
для создания векторных изображений и дизайна, который подходит как для
начинающих, так и для профессионалов.
15
2.3.
Анализ возможностей онлайн редактора Figma
Figma
предоставляет
-
это
онлайн
широкий
редактор
спектр
векторной
возможностей
графики,
для
который
дизайнеров
и
разработчиков. Рассмотрим подробнее основные возможности Figma:
Работа в команде: Figma позволяет работать над проектом в команде.
Вы можете пригласить других пользователей, чтобы они могли с вами
сотрудничать, редактировать и создавать новые элементы дизайна.
Работа в режиме реального времени: Figma позволяет работать в
режиме реального времени, что означает, что вы можете видеть изменения,
которые вносят другие пользователи, и работать с ними одновременно. Это
упрощает процесс работы в команде и ускоряет процесс создания проекта.
Интерфейс: Figma имеет простой и удобный интерфейс, который
позволяет быстро освоиться в работе с программой. Он также имеет
множество инструментов для работы с текстом, формами, изображениями и
другими элементами.
Библиотека элементов: Figma имеет библиотеку элементов, которые
можно использовать в своих работах. Это упрощает процесс создания
дизайна и позволяет сохранять время (рис 2.6).
Рис. 2.6. Библиотека элементов
Прототипирование: Figma позволяет создавать прототипы для ваших
проектов. Это удобно для тестирования дизайна и проверки его на практике.
16
Экспорт: Figma позволяет экспортировать готовые изображения в
различных форматах, включая PNG, JPG, SVG и другие. Это удобно для
использования изображений в различных целях (рис. 2.7).
Рис. 2.7. Экспорт изображений
Интеграция с другими инструментами: Figma имеет интеграцию с
другими инструментами, такими как Sketch, Zeplin, InVision и другими. Это
упрощает процесс работы с другими инструментами и позволяет быстрее
создавать проекты.
Хотя Figma предоставляет много преимуществ, у него также есть
несколько минусов, которые могут повлиять на определенные аспекты его
использования. Рассмотрим некоторые из них:
Стоимость: В отличие от некоторых других онлайн редакторов
векторной графики, Figma не предоставляет бесплатную версию. Цены на
подписки могут быть высокими для некоторых пользователей, особенно для
тех, кто только начинает свой путь в дизайне.
Сложность работы с макетами: Figma может быть сложным для работы
с макетами, особенно для новичков. Интерфейс может быть перегружен
большим количеством инструментов и функций, что может затруднить
работу с программой.
Нет возможности работы офлайн: Figma - это онлайн редактор, и для
работы с ним необходимо постоянное подключение к интернету. Это может
17
быть неудобно для пользователей, которые работают в местах с плохим
интернет-соединением.
Ограниченные возможности для работы с растровыми изображениями:
Figma специализируется на работе с векторной графикой, и у него есть
ограниченные возможности для работы с растровыми изображениями. Это
может быть неудобно для пользователей, которые работают с фотографиями
и другими растровыми изображениями.
Ограниченный выбор шрифтов: Figma имеет ограниченный выбор
шрифтов, доступных для использования. Это может быть неудобно для
пользователей, которые хотят использовать специфические шрифты в своих
проектах.
Figma и Adobe Illustrator - это два различных инструмента для работы с
векторной графикой. Оба инструмента имеют свои преимущества и
недостатки, и выбор между ними зависит от конкретных потребностей
пользователя. Рассмотрим основные отличия между Figma и Adobe Illustrator:
Цена: Figma предоставляет платные подписки для использования, в то
время как Adobe Illustrator можно приобрести за один раз. Adobe Illustrator
может быть дороже в краткосрочной перспективе, но может оказаться
дешевле в долгосрочной перспективе.
Работа в команде: Figma предоставляет возможность совместной
работы над проектами в режиме реального времени, что упрощает процесс
работы в команде. Adobe Illustrator не имеет такой функции.
Интерфейс: Figma имеет современный и удобный интерфейс, который
позволяет быстро освоиться в работе с программой. Adobe Illustrator имеет
более сложный интерфейс, который может быть трудным для новичков.
Работа с веб-дизайном: Figma специализируется на работе с вебдизайном и имеет множество инструментов для создания интерфейсов и
прототипов. Adobe Illustrator также имеет некоторые инструменты для
работы с веб-дизайном, но не настолько удобны, как у Figma.
18
Работа с печатной продукцией: Adobe Illustrator имеет более широкий
набор инструментов для работы с печатной продукцией, таких как создание
векторных логотипов, эмблем и т.д. Figma не имеет таких инструментов.
Экспорт:
Оба
инструмента
позволяют
экспортировать
готовые
изображения в различных форматах, но Adobe Illustrator имеет больше
вариантов экспорта.
Таким образом, Figma - это мощный инструмент для создания дизайна
и векторной графики, который предоставляет широкий спектр возможностей
для пользователей. Он прост в использовании и имеет множество
инструментов для работы с текстом, формами, изображениями и другими
элементами. Figma также позволяет работать с другими пользователями в
режиме реального времени, что упрощает процесс работы в команде.
19
ЗАКЛЮЧЕНИЕ
В заключении данной работы можно отметить, что онлайн редакторы
векторной графики представляют собой удобный и доступный инструмент
для создания качественных изображений. Они имеют ряд преимуществ,
таких как возможность работы с любого устройства с доступом к интернету,
отсутствие
необходимости
установки
специального
программного
обеспечения на компьютер, простота и удобство использования.
В ходе работы были рассмотрены основные онлайн редакторы
векторной графики, такие как Canva, Figma, Gravit Designer, Inkscape и
другие. Были описаны их основные функции и возможности, а также
преимущества и недостатки каждого из них.
Также была рассмотрена технология создания простых изображений в
онлайн редакторах векторной графики. Были обсуждены основные шаги и
инструменты, необходимые для создания качественных изображений, а
также приведены примеры создания различных изображений.
Примеры использования онлайн редакторов векторной графики в
различных областях показали, что они могут быть использованы для
создания логотипов, иллюстраций, дизайна веб-страниц и других проектов.
Онлайн редакторы векторной графики могут быть полезными как для
профессионалов в области дизайна и рекламы, так и для людей, которые
только начинают свой путь в этой области.
Перспективы
развития
онлайн
редакторов
векторной
графики
представляют собой увеличение числа доступных инструментов и функций,
улучшение производительности
увеличение
возможностей
для
и удобства использования,
работы
в
команде
и
а
также
совместного
редактирования изображений.
Таким образом, можно сделать вывод, что онлайн редакторы векторной
графики представляют собой удобный и доступный инструмент для создания
качественных графических изображений.
20
СПИСОК ИСПОЛЬЗОВАННЫХ ИСТОЧНИКОВ
1. Гличка Вон. Векторная графика для дизайнеров. / Гличка Вон. –
ДМК-Пресс, 2020. – 272 c.;
2. Зиновьева Е. А. Компьютерный дизайн. Векторная графика /
Зиновьева Е. А. – Флинта, 2020. – 116 c.;
3. Поляков Е. Ю. Векторная графика для начинающих / Поляков Е. Ю.
– Бомбора, 2023. – 488 c.;
4. Успенский К. Е., Шитов В. Н. Графический дизайн и мультимедиа /
Успенский К. Е., Шитов В. Н. – КноРус, 2023. – 331 стр.
5. Тукевич Е. Adobe Illustrator CC 2022. Мастер-класс Евгении Тукевич
/ Тукевич Е. – БХВ-Петербург, 2022. – 321 стр.;
6. Векторные и растровые изображения: достоинства и недостатки,
сравнение
[Электронный
ресурс]
–
Режим
доступа:
https://raster-
spb.ru/articles/10.html;
7. Базовые принципы работы векторных графических редакторов
компьютерных
программ
[Электронный
ресурс]
–
Режим
доступа:
https://cyberleninka.ru/article/n/bazovye-printsipy-raboty-vektornyh-graficheskihredaktorov-kompyuternyh-programm;
8. 15 лучших графических редакторов, которые не стоят ни копейки
[Электронный ресурс] – Режим доступа: https://lifehacker.ru/besplatnyegraficheskie-redaktory/;
9. Vectr — бесплатный редактор, для со создания логотипов, баннеров
и
презентаций
ресурс]
[Электронный
–
Режим
доступа:
https://lifehacker.ru/vectr/;
10.
Что такое Figma: полная инструкция по использованию редактора
[Электронный ресурс] – Режим доступа: https://kokoc.com/blog/figma-chto-etotakoe/.
21