Компьютерная графика и веб-дизайн

Программа

Всього 18 занять

Теми

Тема 1. Програма Adobe Photoshop. Робота із файлами. Інструменти виділення областей зображення.

• Інтерфейс програми. Команди меню. Робочий простір і операції із палітрами.
• Налаштування роботи програми. Команда меню Preferences. Налаштування системи керування кольором – Color Settings.
• Навігація в документі. Команди Open, Open Recent, Save і Save As.
• Растрові та векторні зображення. Формати файлів.
• Зміна розмірів зображення та полотна. Команда Image Size. Команда Canvas Size.
• Кадрування зображення. Команда Crop Tools.
• Інструменти виділення (Rectangular Marquee, Elliptical Marquee, Single Column Marquee, Sinle Row Marquee), lasso, Polygonal lasso, Magnetic lasso, Quick selection, Magic Wand тощо.
• Команди меню "Select". Команда Transform Selection – геометричне перетворення області виділення. Група команд SelectModify.
• Інтрумент доопрацювання виділеної області Refine Edge. Створення маски складного виділення із канала зображення.

Тестування для перевірки теоретичних знань.

Практичне завдання 1. Зміна розмірів зображення та полотна. Кадрування зображення. Основи композиції.

Практичне завдання 2. Методи та способи виділення складних областей зображення.

Тема 2. Основи теорії кольору. Інструменти тонової та колірної корекції зображення.

• Поняття кольору. Кольоровий діапазон. Адетивна (RGB) і субтрактивна (CMYK) кольорові моделі. Кольорове коло.

• Особливості і сфери застосування кольорових моделей. Дуплексні та чорно-білі растрові зображення.

• Інструментарій для роботи із кольорами. Eyedropper, палітра Info. Визначення кольору в палітрі Color Picker.

• Інструментрарій для автоматичної корекції зображення. Меню «Image».

• Тонова корекція зображення. Гістограма. Глибина кольору.

• Інструменти тонової корекції . Команда Levels.

• Інструменти тонової корекції . Команда Curves.

• Поняття базового кольору, заміна кольору.

• Інструменти Levels та Curves для кольорової корекції зображення.

Тестування для перевірки теоретичних знань.

Практичне завдання. Методи та способи тонової та колірної корекції зображення. Створення монохромних зображень, сепія тощо. Вибіркове редагування кольорів.

Тема 3. Шари. Базові правила роботи. Шар-маска. Основи неруйнівного редагування зображення (2 заняття).

• Поняття шару. Види шарів. Меню Layer.

• Палітра Layers.

• Трансформація шару.

• Зв’язування, групування і об’єднання шарів.

• Монтаж на основі декількох зображень.

• Стилі шару.

• Поняття маски в Adobe Photoshop.

• Операції над маскою у палітрі Layers.

• Поняття корекційного шару.

• Корекційні шари Levels, Curves, Color Balance, Brightess/Contrast, Photo Filter тощо.

Тестування для перевірки теоретичних знань.

Практичне завдання. Монтаж зображень. Поняття колажу. Неруйнівне редагування зображень.

Тема 4. Інструменти малювання в програмі Adobe Photoshop.

• Інструмент Brush. Палітра Brushes.

• Бібліотека пензлів, підключення, налаштування.

• Інструмент Pencil. Піксель-арт.

• Векторні об’єкти в програмі Photoshop.

• Поняття контуру.

• Інструмент Pen.

• Застосування векторних форм.

Тестування для перевірки теоретичних знань.

Практичне завдання. Використання векторних інструментів Adobe Photoshop для створення іконок та інших векторизованих об’єктів сайту.

Тема 5. Робота із текстом.

• Створення тестового шару.

• Трансформація надписів.

• Заливка тексту рисунком.

• Накладання тексту на зображення.

• Основи типографіки.

Тестування для перевірки теоретичних знань.

Практичне завдання. Вибір шрифтів для сайту або поліграфічної продукції, основи типографіки. Створення графічних ефектів для оформлення шрифту, підбір кольору.

Тема 6. Фільтри та градієнти в Adobe Photoshop.

• Класифікація фільтрів.

• Огляд галереї фільтрів. Застосування декількох фільтрів до зображення.

• Smart Object та його використання.

• Основні принципи побудови градієнтів.

• Створення, налаштування і використання градієнтів.

• Робота із Gradient Editor.

Тестування для перевірки теоретичних знань.

Практичне завдання. Використання Smart Object для створення та налаштування неруйнівного застосування фільтрів до зображень.

Тема 7. Основи роботи в Adobe Illustrator та Corel Draw.

• Векторні формати гафічних файлів. Використання векторних форматів у Web-дизайні.

• Інтерфейс програми. Налаштування робочого простору.

• Монтажна область. Інструменти для роботи та налаштування монтажних областей.

• Виділення геометричних об’єктів.

• Найпростіші геометричні фігури та їх редагування.

• Групування геометричних об’єктів.

Тестування для перевірки теоретичних знань.

Практичне завдання. Створення складних геометричних форм за допомогою найпростіших геометричних фігур.

Тема 8. Базові інструменти для роботи із контурами в програмі Adobe Illustrator та Corel Draw.

• Поняття контуру в програмі Adobe Illustrator та Corel Draw.

• Інструменти роботи із контурами.

• Техніка малювання інструментом «Pen tool».

• Дії над контурами у програмі Adobe Illustrator та Corel Draw.

• Налаштування відображення обрису контуру.

Тестування для перевірки теоретичних знань.

Практичне завдання. Створення ілюстрацій за допомогою інструментів малювання контурів.

Тема 9. Редагування шарів та масок. Колір та градієнти в програмі Adobe Illustrator та Corel Draw. Текст.

• Поняття шару. Інструметарій палітри «Шари» Adobe Illustrator.

• Створення та редагування маски. Маскування всіх об’єктів на вибаному шарі.

• Основи роботи з кольором у Adobe Illustrator та Corel Draw.

• Градієнти.

• Текст.

• Робота з напрямними і сітками. Pixel Grid.

Тестування для перевірки теоретичних знань.

Практичне завдання. Створення ілюстрацій за допомогою інструментів малювання контурів. Розфарбовування геометричних об’єктів. Створення іконок, планів та карт для Web та поліграфії. Піксельна графіка.

Тема 10. Використання спеціалізованих ефектів у програмах Adobe Illustrator та Corel Draw. Патерни.

• Фільтри та спеціалізовані ефекти в Adobe Illustrator.

• Фільтри та спеціалізовані ефекти в Corel Draw.

• Особливості рисування тривимірних сцен у програмах Adobe Illustrator та Corel Draw.

• Патерни. Усзори. Створення власних узорів та паттернів.

Тестування для перевірки теоретичних знань.

Практичне завдання. Створення тривимірних ілюстрацій у Adobe Illustrator та Corel Draw.

Тема 11. Експорт (імпорт) файлів у пакетах Adobe Illustrator, Adobe Photoshop та Corel Draw.

• Функції експорту та імпорту в указаних програмних пакетах.

• Технічні вимоги до файлів.

• Типові параметри для розміщення файлів для друку.

• Використання Smart Object у програмах.

Тестування для перевірки теоретичних знань.

Практичне завдання. Використання Smart Object для неруйнівної трансформації зображень.

Тема 12. Створення дизайну Web-page та mobile application.

• Поняття верстки. Елементи сторінки.

• Адаптивний дизайн сторінки.

• Розрахунок та створення сітки макета.

• Направляючі (Guides).

• Bootstrap сітка.

Тестування для перевірки теоретичних знань.

Практичне завдання. Створити дизайн першої сторінки сайту на вказану тематику.

Тема 13. Розробка фірмового стилю компанії.

• Поняття фірмово стилю компанії. Його елементи.

• Функції фірмового стилю. .

• Айдентіка.

• Логотип.

• Style Guide.

Тестування для перевірки теоретичних знань.

Практичне завдання. Створити фірмовий стиль компанії.

Курс веб-дизайну 

Тема 1. Основні етапи проектування та створення сайтів. (1 заняття)

• Типи сайтів.

• Основні принципи дизайну.

• Ключові елементи сайту.

Тема 2. Основи UX (2 заняття).

• Поняття UX.

• Збір необхідної інформації. Формулювання мети та завдань сайту. Користувацький профіль.

• Поняття user history.

• Інформаційна архітектура сайту. Типи інформаційних архітектур. Mind map у проектування сайтів.

• Особливості проектування сайту для різних пристроїв.

Тема 3. Модульні сітки для проектування сайтів (2 заняття).

• Поняття модульної сітки.

• Принципи побудови модульних сіток.

• Модульні сітки Bootstrap.

• Адаптивний дизайн сайту.

Тема 4. Елементи web - сторінки (2 заняття).

• Елементи web – сторінки.

• Поняття фолду. Розміщення зображень та заголовків. Сприймання зображень.

• Форми. Особливості введення даних. Типи введення даних.

• Паттерни проектування. Огляд типових бібліотек патернів.

Тема 5. Wireframes – ключові поняття композиції та кольору (2 заняття).

• Основні поняття. Принципи розробки wireframes.

• Основи композиції. Поняття геометричного центру, композиційний центр та рівновага об’ємів.

• Застосування різних прийомів створення композицій (контраст, глубина, розмір, повторення та розрив паттерну, вирівнювання).

• Значення кольору в UX проектуванні.

• Комбінації кольорів. Аспекти створення кольорових комбінацій.

Тема 6. Wireframes (організація тексту) (2 заняття).

• Особливості сприймання тексту.

• Копірайтинг в UX проектуванні.

• Поняття типографіки.

• Види шрифтів та їх класифікація.

Тема 7. UI. Тестування прототипів (1 заняття).

• Поняття інтерфейсу.

• Style guide (основні поняття та призначення документу).

• Створення прототипів дизайну сайтів. Аналіз найбільш поширених програмних продуктів (Axure RP, Balsamiq, MarvelApp, InVision)

• Створенная прототипу інтерфейсу сайту за допомогою InVision.

Тема 8. Психологія користувача (1 заняття).

• Значення розуміння відчуттів користувача для проектування сайту.

• Переконання.

• Досвід користувача.

• Поняття A/B – тестування.

Презентація проекту (1 заняття).