УДК 374:004.9(045)

ББК 74.200.587

Ш 686

ШЛЁНКИН МАКСИМ АЛЕКСАНДРОВИЧ

студент факультета художественного и музыкального образования Мордовский государственный педагогический университет имени М. Е. Евсевьева, г. Саранск, Россия, Shlyonkin.maks12@gmail.com

Ключевые слова: формирование умений, разработка, дизайн, макет веб сайта, обучающийся детской художественной школы, пользовательский интерфейс.

Аннотация: В статье рассматривается процесс формирования умений разрабатывать дизайн макета пользовательского интерфейса веб-сайта у учащихся детской художественной школы. Раскрывается значение UI-дизайна как интеграции искусства и технологий, его роль в развитии творческих способностей.

 

FORMATION OF SKILLS IN DESIGNING THE LAYOUT OF THE USER INTERFACE OF A WEBSITE FOR STUDENTS OF A CHILDREN’S ART SCHOOL

 Shlyonkin Maksim Aleksandrovich student Faculty of Art and Music Education Mordovia State Pedagogical University named after M. E. Evseviev, Saransk, Russia

Key words: skill formation, development, design, website layout, children’s art school student, user interface.

Annotation: The article examines the process of developing the skills to design the layout of the user interface of a website for students of a children’s art school. The article reveals the importance of UI design as an integration of art and technology, its role in the development of creative abilities.

 

Современный мир цифровых технологий требует от молодых специалистов не только навыков традиционного искусства, но и способности адаптироваться к новым формам визуального выражения.

Одной из таких форм является разработка пользовательских интерфейсов (UI) для веб-сайтов. Включение данного направления в образовательный процесс детской художественной школы может способствовать развитию у обучающихся новых творческих и технических компетенций.

UI-дизайн — это область, объединяющая искусство и технологию. Она предполагает создание удобных, эстетически привлекательных интерфейсов, которые помогают пользователям эффективно взаимодействовать с цифровыми продуктами. Для обучающихся художественной школы данный навык открывает возможности для применения своих художественных умений в востребованной и перспективной сфере[1].

Изучение UI-дизайна позволяет развивать:

1. Творческое мышление: поиск нестандартных решений и подходов к проектированию.
2. Технические навыки: работа с графическими редакторами (Figma, Adobe XD, Sketch) и основами проектирования.
3. Эргономическое мышление: понимание принципов удобства и интуитивности взаимодействия с интерфейсом.
4. Командную работу: участие в разработке проектов совместно с другими участниками.
5. Визуальное восприятие: анализ цветовых решений, пропорций и композиции.

Формирование умений разработки дизайна макета пользовательского интерфейса включает несколько этапов:

1. Введение в основы UI-дизайна:
   • Ознакомление с базовыми понятиями (интерфейс, пользовательский опыт, макет).
   • Изучение примеров успешных дизайнов.
2. Изучение инструментов для разработки:
   • Работа с современными графическими редакторами.
   • Основы создания интерактивных прототипов.
3. Практика проектирования:
   • Создание первых макетов под руководством педагога.

• Изучение принципов визуальной иерархии, типографики, цветовой гармонии.
• Анализ реальных кейсов из практики ведущих дизайнеров.

4. Курсовой проект:
   • Разработка полноценного макета веб-сайта с учетом заданного технического задания.
   • Презентация проекта с пояснением принятых решений.
   • Тестирование прототипа на удобство использования (usability testing).
5. Дополнительные модули:
   • Изучение основ анимации для интерфейсов.
   • Разработка адаптивных макетов для различных устройств.
   • Введение в дизайн систем и компоненты UI-китов.

Для  успешного  обучения  UI-дизайну  важно  применять  современные методические подходы:

• Проектный метод: создание реальных проектов, которые обучающиеся могут добавить в свое портфолио[2].
• Индивидуальный подход: учет уровня подготовки каждого ученика.
• Использование актуальных материалов: изучение современных трендов дизайна.
• Обратная связь: регулярный разбор работ с рекомендациями по улучшению.
• Мастер-классы: приглашение практикующих специалистов для обмена опытом.
• Интерактивные задания: создание мини-проектов в ограниченные сроки для развития оперативного мышления[4].

В результате прохождения курса обучающиеся приобретают:

• Базовые навыки проектирования пользовательских интерфейсов.
• Умение работать с профессиональными инструментами дизайна.
• Понимание структуры и этапов разработки веб-сайтов.
• Первые проекты для формирования портфолио.
• Навыки анализа и тестирования интерфейсов.
• Знания современных трендов и стандартов в сфере UI-дизайна.

Владение навыками UI-дизайна открывает перед обучающимися широкие горизонты для профессионального роста. Они могут продолжить обучение в специализированных учебных заведениях или пройти углубленные курсы по UX/UI-дизайну. Кроме того, опыт, полученный в процессе создания интерфейсов, поможет развить гибкость мышления и способность быстро адаптироваться к изменениям в любой креативной или технологической сфере[1].

Интеграция основ UI-дизайна в образовательный процесс детской художественной школы — это шаг навстречу будущему, где искусство и технологии становятся неотделимыми друг от друга. Такой подход не только расширяет кругозор обучающихся, но и открывает перед ними новые перспективы профессионального развития в цифровом мире. Это возможность объединить традиционные навыки с современными инструментами, создавая уникальные и функциональные цифровые продукты[3].

 

Список использованных источников

1. Браун, Т. Дизайн-мышление в бизнесе. От разработки новых продуктов до проектирования бизнес-моделей / Т. Браун. – Текст: непосредственный // Манн, Иванов и Фебер. – 2012. – С. 153–172.

2. Ерохин, С.В. Цифровое компьютерное искусство / С.В. Ерохин. – Текст: непосредственный // СПб.: Алетейя, 2011. – 188 с.

3. Моисеева, А. Н. Развитие эмоциональной отзывчивости у детей средствами искусства / А. Н. Моисеева, Т. А. Мамкина. – Текст: непосредственный // Современная высшая школа: инновационный аспект. – – Т. 9. – № 3. – С. 96–102.

4. Норман, Д. А. Дизайн привычных вещей / Д. А. Норман. – Текст: непосредственный // Манн, Иванов и Фебер. – 2024. – С. 274–281.