| Закреплена за кафедрой | Кафедра культурологии и дизайна |
|---|---|
| Направление подготовки | 09.04.03. Прикладная информатика |
| Профиль | Цифровой дизайн |
| Форма обучения | Очная |
| Общая трудоемкость | 5 ЗЕТ |
| Учебный план | 09_04_03_Прикладная информатика_ЦД-2022 |
|
|
||||||||||||||
Распределение часов по семестрам
| Курс (семестр) | 2 (3) | Итого | ||
|---|---|---|---|---|
| Недель | 15,5 | |||
| Вид занятий | УП | РПД | УП | РПД |
| Лекции | 20 | 20 | 20 | 20 |
| Практические | 30 | 30 | 30 | 30 |
| Сам. работа | 103 | 103 | 103 | 103 |
| Часы на контроль | 27 | 27 | 27 | 27 |
| Итого | 180 | 180 | 180 | 180 |
Визирование РПД для исполнения в очередном учебном году
Рабочая программа пересмотрена, обсуждена и одобрена для
исполнения в 2023-2024 учебном году на заседании
кафедры
Кафедра культурологии и дизайна
Протокол от 23.05.2023 г. № 7
Заведующий кафедрой к. искусствоведения, доц. Ю.В. Кирюшина
| 1.1. | Формирование готовности студентов к проектированию в области UI-дизайна (дизайна пользовательского интерфейса), изучение основных тенденций развития UX-дизайна,освоение навыков проектирования графических элементов интерфейса и навыков проектирования пользовательского опыта. |
|---|
| Цикл (раздел) ООП: Б1.О.03 |
| ПК-4 | Способен разрабатывать концептуальный дизайн интерфейса, эскизировать и прототипировать сложные интерфейсы с учетом тенденций в проектировании пользовательских интерфейсов и развития визуальной культуры |
| ПК-4.1 | Знает методы разработки концептуального дизайна структуры типовых и уникальных экранов интерфейса |
| ПК-4.2 | Умеет проектировать информационную архитектуру ресурса |
| ПК-4.3 | Владеет навыками прототипирования и эскизирования пользовательского интерфейса |
| В результате освоения дисциплины обучающийся должен | |
| 3.1. | Знать: |
|---|---|
| 3.1.1. | Знает методы разработки концептуального дизайна структуры типовых и уникальных экранов интерфейса |
| 3.2. | Уметь: |
| 3.2.1. | Умеет проектировать информационную архитектуру ресурса |
| 3.3. | Иметь навыки и (или) опыт деятельности (владеть): |
| 3.3.1. | Владеет навыками прототипирования и эскизирования пользовательского интерфейса |
| Код занятия | Наименование разделов и тем | Вид занятия | Семестр | Часов | Компетенции | Литература |
|---|---|---|---|---|---|---|
| Раздел 1. UI-дизайн и UX-дизайн как сферы цифрового дизайна | ||||||
| 1.1. | Сущность понятий UI-дизайна и UX-дизайна | Лекции | 3 | 6 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.2, Л2.1 |
| 1.2. | Основные тенденции развития современного дизайна | Лекции | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 1.3. | Тренды современного дизайна пользовательских интерфейсов | Практические | 3 | 4 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 1.4. | Работа с терминологией курса | Сам. работа | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л2.1 |
| Раздел 2. Основные этапы разработки web-проекта | ||||||
| 2.1. | Методы разработки идеи проекта цифрового продукта. Основы исследования пользовательского опыта | Лекции | 3 | 4 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 2.2. | Методы взаимодействия пользователей с интерфейсом | Лекции | 3 | 4 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 2.3. | Выбор визуального стиля web-проекта. Референсы и мудборды | Практические | 3 | 4 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 2.4. | Основные инструменты и методы прототипирования. Модульные сетки | Практические | 3 | 4 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 2.5. | Работа с модульными сетками | Сам. работа | 3 | 10 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л2.1 |
| Раздел 3. Визуальные компоненты web-дизайна | ||||||
| 3.1. | Визуальная иерархия в web-дизайне | Лекции | 3 | 4 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 3.2. | Подбор референсов и составление мудборда | Сам. работа | 3 | 8 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 3.3. | Роль негативного пространства в дизайне | Практические | 3 | 4 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 3.4. | Цвет в web-дизайне | Практические | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 3.5. | Кнопки и формы в web-дизайне | Практические | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 3.6. | Универсальные элементы сайтов | Практические | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| Раздел 4. Дизайн как проектная деятельность | ||||||
| 4.1. | Системы ведения проектов в web-дизайне | Практические | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 4.2. | Сравнительный анализ колористического решения и типографического оформления сайтов | Сам. работа | 3 | 8 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 4.3. | Составление технического задания и проекта | Сам. работа | 3 | 15 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 4.4. | Landing page как web-проект | Практические | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 4.5. | Разработка портфолио web-дизайнера | Практические | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 4.6. | Разработка сайта-портфолио | Сам. работа | 3 | 36 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л3.1, Л1.2, Л2.1 |
| 4.7. | Формальные методики оценки интерфейса | Практические | 3 | 2 | ПК-4.1, ПК-4.2, ПК-4.3 | Л1.1, Л2.1 |
| 4.8. | Подготовка презентации сайта | Сам. работа | 3 | 24 | ПК-4.1, ПК-4.2, ПК-4.3 | Л2.3, Л1.1, Л1.2, Л2.1 |
| 5.1. Контрольные вопросы и задания для проведения текущего контроля и промежуточной аттестации по итогам освоения дисциплины |
| ОЦЕНКА СФОРМИРОВАННОСТИ КОМПЕТЕНЦИИ ПК-4: Способен разрабатывать концептуальный дизайн интерфейса, эскизировать и прототипировать сложные интерфейсы с учетом тенденций в проектировании пользовательских интерфейсов и развития визуальной культуры ПРИМЕРЫ ЗАДАНИЙ ЗАКРЫТОГО ТИПА 1. Что означает аббревиатура "UX" в контексте дизайна? A. Удивительный опыт B. Эффективность пользователя C. Опыт пользователя D. Уникальный экран Ответ: C 2. Что из перечисленного описывает UI дизайн? A. Определение структуры информации B. Опыт взаимодействия пользователя с продуктом C. Выбор цветовой палитры D. Создание бизнес-стратегии Ответ: B 3. Какой из нижеперечисленных факторов является частью UX дизайна? A. Типография B. Цветовая палитра C. Исследование пользовательских потребностей D. Размер шрифта Ответ: C 4. Что такое "пользовательская история" (user story) в UX/UI дизайне? A. Рассказ о жизни пользователя B. Сценарий, описывающий взаимодействие пользователя с продуктом C. Интервью с дизайнером D. Описание технических характеристик приложения Ответ: B 5. Какой инструмент чаще всего используется для создания прототипов интерфейса? A. Фотошоп (Photoshop) B. Фреймворки C. Фигма (Figma) D. Прозрачная бумага и карандаш Ответ: C 6. Что означает термин "кард-сортировка" (card sorting) в UX/UI дизайне? A. Разделение карточек в колоде B. Метод определения структуры информации на веб-сайте или приложении с помощью сортировки пользовательских карточек C. Анализ статистики посещаемости сайта D. Распределение рекламных баннеров на странице Ответ: B 7. Какой принцип дизайна подразумевает, что элементы интерфейса должны быть ясными и понятными для пользователя? A. Принцип симметрии B. Принцип баланса C. Принцип доступности D. Принцип понятности Ответ: D 8. Что означает термин "проектирование информационной архитектуры" (information architecture design) в UX/UI дизайне? A. Создание анимации элементов интерфейса B. Определение структуры и организации информации на веб-сайте или в приложении C. Работа с цветами и шрифтами D. Разработка логотипа Ответ: B 9. Какой цвет чаще всего используется для выделения важных элементов в интерфейсе? A. Зеленый B. Синий C. Красный D. Оранжевый Ответ: C 10. Что означает аббревиатура "CTA" в контексте UX/UI дизайна? A. Связанные темы и ассоциации B. Вызов действия пользователя (Call to Action) C. Касание и активация D. Состояние временного архива Ответ: B 11. Какой из перечисленных элементов интерфейса обычно используется для возвращения на предыдущую страницу? A. Иконка домика B. Кнопка "ОК" C. Иконка корзины D. Слайдер Ответ: A 12. Что такое "первичное впечатление" (first impression) в контексте UX/UI дизайна? A. Первая страница сайта B. Первое взаимодействие пользователя с продуктом C. Первый бизнес-план D. Первый комментарий пользователя Ответ: B. 13. Какой процесс UX-дизайна напрямую связан с взаимодействием с пользователями и сбором их потребностей? A. Прототипирование. B. Тестирование и исследование пользовательского опыта. C. Анализ бизнес-требований. D. Создание концепции дизайна. Ответ: B. 14. Какие преимущества для UX-дизайна предоставляет взаимодействие с пользователями? A. Быстрая разработка программного обеспечения. B. Увеличение сложности дизайна интерфейса. C. Улучшение пользовательского опыта и удовлетворенности пользователями. D. Снижение затрат на маркетинг. Ответ: C. Улучшение пользовательского опыта и удовлетворенности пользователями. 15. Какие навыки и компетенции могут быть важными для успешного взаимодействия с пользователями в области UX-дизайна? A. Владение программами для анализа данных. B. Навыки прогнозирования рыночных тенденций. C. Эмпатия, коммуникабельность и умение слушать. D. Знание истории искусства. Ответ: C. Эмпатия, коммуникабельность и умение слушать. ПРИМЕРЫ ЗАДАНИЙ ОТКРЫТОГО ТИПА 1. Что означает UX в дизайне? Ответ: UX (User Experience) означает опыт, который пользователь получает при взаимодействии с продуктом или интерфейсом. 2. Какие ключевые задачи UX-дизайнера? Ответ: Создание удовлетворительного пользовательского опыта, учёт потребностей пользователей, оптимизация интерфейсов. 3. Что такое исследование пользовательского опыта? Ответ: Это процесс изучения и анализа взаимодействия пользователей с продуктом для улучшения его качества. 4. Чем отличается UI от UX? Ответ: UI (User Interface) - это дизайн интерфейса, в то время как UX - это общий опыт использования продукта. 5. Для чего используются персонажи (персоны) при проектировании UX? -Ответ: персонажи (персоны) помогают создать более реалистичные истории использования продукта. 6. Что такое A/B-тестирование в UX-дизайне? -Ответ: Это метод сравнения двух версий продукта, чтобы определить, какая из них обеспечивает лучший пользовательский опыт. 7. Какие методы сбора обратной связи можно использовать при работе над UX? -Ответ: Опросы, интервью, анализ пользовательских обзоров, тестирование сценариев. 8. Что такое информационная архитектура в UX? -Ответ: Это организация информации и контента на сайте или в приложении для удобной навигации. 9. Какие основные шаги включает в себя процесс UX-проектирования? -Ответ: Исследование, проектирование, прототипирование, тестирование, внедрение и оценка. 10. Почему важно учитывать доступность при дизайне UX? -Ответ: Доступность обеспечивает удовлетворительный опыт для пользователей с ограниченными возможностями. 11. Что такое "карта клиента" (Customer Journey Map) в UX-дизайне? Ответ: Это визуальное представление опыта пользователя от начала до конца взаимодействия с продуктом. 12. Какие принципы цветовой гармонии важны при дизайне интерфейсов? Ответ: Принципы, такие как контраст, сочетаемость цветов и читаемость текста на фоне. 13. Какие методы помогают UX-дизайнеру понять потребности пользователей? Ответ: Наблюдение за поведением пользователей, проведение интервью, анализ обратной связи. 14. Что такое "карта сайта" (Site Map) в UX-дизайне? Ответ: Это диаграмма, отображающая структуру и навигацию на веб-сайте. 15. Какие инструменты используются для создания прототипов интерфейсов? Ответ: Программы и онлайн-сервисы для прототипирования, такие как Figmа КРИТЕРИИ ОЦЕНИВАНИЯ ЗАКРЫТЫХ ВОПРОСОВ: Каждое задание оценивается 1 баллом. Оценивание КИМ теоретического характера в целом: • «зачтено» – верно выполнено более 50% заданий; «не зачтено» – верно выполнено 50% и менее 50% заданий; • «отлично» – верно выполнено 85-100% заданий; «хорошо» – верно выполнено 70-84% заданий; «удовлетворительно» – верно выполнено 51-69% заданий; «неудовлетворительно» – верно выполнено 50% или менее 50% заданий. КРИТЕРИИ ОЦЕНИВАНИЯ ОТКРЫТЫХ ВОПРОСОВ. • «Отлично» (зачтено): Ответ полный, развернутый. Вопрос точно и исчерпывающе передан, терминология сохранена, студент превосходно владеет основной и дополнительной литературой, ошибок нет. • «Хорошо» (зачтено): Ответ полный, хотя краток, терминологически правильный, нет существенных недочетов. Студент хорошо владеет пройденным программным материалом; владеет основной литературой, суждения правильны. • «Удовлетворительно» (зачтено): Ответ неполный. В терминологии имеются недостатки. Студент владеет программным материалом, но имеются недочеты. Суждения фрагментарны. • «Неудовлетворительно» (не зачтено): Не использована специальная терминология. Ответ в сущности неверен. Переданы лишь отдельные фрагменты соответствующего материала вопроса. Ответ не соответствует вопросу или вовсе не дан. |
| 5.2. Темы письменных работ для проведения текущего контроля (эссе, рефераты, курсовые работы и др.) |
| не предусмотрено |
| 5.3. Фонд оценочных средств для проведения промежуточной аттестации |
| Промежуточная аттестация заключается в проведении в конце семестра экзамена. Для обучающихся, организуется экзамен в форме письменного опроса по всему изученному курсу. Контрольно-измерительный материал для письменного опроса формируется из заданий открытого типа текущего контроля, размещенных в Контрольных вопросах и заданиях для проведения текущей аттестации по дисциплины, а также заданий текущего контроля в онлайн-курсе на образовательном портале «Цифровой университет АлтГУ». Количество заданий в письменном опросе для промежуточной аттестации - 20. КРИТЕРИИ ОЦЕНИВАНИЯ: Каждое задание оценивается 1 баллом. Оценивание КИМ в целом: «отлично» – верно выполнено более 85% заданий; «хорошо» – верно выполнено более 70% заданий, «удовлетворительно» верно выполнено более 50% заданий. |
| 6.1. Рекомендуемая литература | ||||
| 6.1.1. Основная литература | ||||
| Авторы | Заглавие | Издательство, год | Эл. адрес | |
| Л1.1 | Тузовский, А. Ф. | Проектирование и разработка web-приложений: учебное пособие | Юрайт, 2022 | urait.ru |
| Л1.2 | Молочков, В.П. | Adobe Photoshop CS6: | Национальный Открытый Университет «ИНТУИТ» // ЭБС "Университетская библиотека online", 2016 | biblioclub.ru |
| 6.1.2. Дополнительная литература | ||||
| Авторы | Заглавие | Издательство, год | Эл. адрес | |
| Л2.1 | А. Н. Лаврентьев [и др.] | Цифровые технологии в дизайне. История, теория, практика: учебник и практикум для вузов | М. : Издательство Юрайт, 2018 | biblio-online.ru |
| Л2.2 | Богданов М. Р. | Перспективные языки веб-разработки: Учебная литература для ВУЗов | Национальный Открытый Университет «ИНТУИТ», 2016 | biblioclub.ru |
| Л2.3 | Диков А.В. | Веб-технологии HTML и CSS: Учебное пособие | М.: Директ-Медиа // ЭБС "ONLINE", 2012 | biblioclub.ru |
| 6.1.3. Дополнительные источники | ||||
| Авторы | Заглавие | Издательство, год | Эл. адрес | |
| Л3.1 | Ахтямова, С.С. | Программа CorelDRAW. Основные понятия и принципы работы: учебное пособие | Издательство КНИТУ // ЭБС "Университетская библиотека online", 2014 | biblioclub.ru |
| 6.2. Перечень ресурсов информационно-телекоммуникационной сети "Интернет" | ||||
| Название | Эл. адрес | |||
| Э1 | Responsive Web Design // Coursera | www.coursera.org | ||
| Э2 | Электронный курс на Едином образовательном портале АлтГУ // https://portal.edu.asu.ru/course/view.php?id=7959 | portal.edu.asu.ru | ||
| 6.3. Перечень программного обеспечения | ||||
| 1. Microsoft Office 2010 (Office 2010 Professional, № 4065231 от 08.12.2010), (бессрочно); 2. Microsoft Windows 7 (Windows 7 Professional, № 61834699 от 22.04.2013), (бессрочно); 3. Chrome (http://www.chromium.org/chromium-os/licenses ), (бессрочно); 4. 7-Zip (http://www.7-zip.org/license.txt ), (бессрочно); 5. AcrobatReader (http://wwwimages.adobe.com/content/dam/Adobe/en/legal/servicetou/Acrobat_com_Additional_TOU-en_US-20140618_1200.pdf), (бессрочно); 6. ASTRA LINUX SPECIAL EDITION (https://astralinux.ru/products/astra-linux-special-edition/), (бессрочно); 7. LibreOffice (https://ru.libreoffice.org/), (бессрочно); 8. Веб-браузер Chromium (https://www.chromium.org/Home/), (бессрочно); 9. Антивирус Касперский (https://www.kaspersky.ru/), (до 23 июня 2024); 10. Архиватор Ark (https://apps.kde.org/ark/), (бессрочно); 11. Okular (https://okular.kde.org/ru/download/), (бессрочно); 12. Редактор изображений Gimp (https://www.gimp.org/), (бессрочно) | ||||
| 6.4. Перечень информационных справочных систем | ||||
| Информационная справочная система: СПС КонсультантПлюс (инсталлированный ресурс АлтГУ или http://www.consultant.ru/). Профессиональные базы данных: 1. Электронная библиотечная система Алтайского государственного университета (http://elibrary.asu.ru/); 2. Научная электронная библиотека elibrary (http://elibrary.ru). | ||||
| Аудитория | Назначение | Оборудование |
|---|---|---|
| Помещение для самостоятельной работы | помещение для самостоятельной работы обучающихся | Компьютеры, ноутбуки с подключением к информационно-телекоммуникационной сети «Интернет», доступом в электронную информационно-образовательную среду АлтГУ |
| 106Л | помещение для хранения и профилактического обслуживания учебного оборудования | Стеллажи – 3 шт. осциллограф, паяльная станция, источник тока, переносные ноутбуки |
| 204Л | лаборатория информационных технологий - компьютерный класс - учебная аудитория для проведения занятий семинарского типа (лабораторных и(или) практических); проведения групповых и индивидуальных консультаций, текущего контроля и промежуточной аттестации | Учебная мебель на 14 посадочных мест; компьютеры: марка DEPO модель Neos 260 - 14 единиц; Интерактивная доска Smart board 680 IV со встроенным проектором v25 |
| 206Л | лаборатория информационных технологий - компьютерный класс - учебная аудитория для проведения занятий семинарского типа (лабораторных и(или) практических); проведения групповых и индивидуальных консультаций, текущего контроля и промежуточной аттестации | Учебная мебель на 14 посадочных мест; компьютеры: марка DEPO модель Neos 260, мониторы: марка Philips модель 227E3LHSU - 14 единиц |
| При изучении дисциплины целесообразно выполнять следующие рекомендации: а) изучение должно быть систематическим, в течение всего семестра; для формирования устойчивых навыков и знаний эффективнее следовать логике построения курса и осваивать учебный материал небольшими порциями; б)после изучения темы на практическом занятии следует выполнить самостоятельную работу по данной теме, если она предполагается, а также изучить дополнительные ресурсы, рекомендованные преподавателем, а также найденные самостоятельно в сети Интернет, в фондах научной библиотеки университета. Дополнительные учебные результаты могут быть достигнуты в форме научно-исследовательской работы студентов по проблематике данной учебной дисциплины: написание научных статей, выступление на конференциях, круглых столах, участие в научно-исследовательских проектах. Выполнение практических заданий предусмотрено как на практических занятиях, так и в форме самостоятельной работы. При выполнении самостоятельной работы учащийся может задавать уточняющие вопросы преподавателю, используя электронные средства коммуникации на Едином образовательном портале АлтГУ, а также при непосредственном общении с преподавателем в часы консультаций. |