САНКТ-ПЕТЕРБУРГСКИЙ ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ
Факультет искусств
Направление 072500 «Дизайн»
Магистерская программа «Графический дизайн»
Черновская Яна Александровна
РАЗВИТИЕ МЫШЛЕНИЯ ДЕТЕЙ ШКОЛЬНОГО ВОЗРАСТА
ПОСРЕДСТВОМ КИБЕРНЕТИЧЕСКОГО КОНСТРУКТОРА:
КОМПЛЕКСНОЕ ГРАФИЧЕСКОЕ СОПРОВОЖДЕНИЕ ДЛЯ
КИБЕРНЕТИЧЕСКОГО КОНСТРУКТОРА И ПРОГРАММНОГО
ОБЕСПЕЧЕНИЯ “ТРИК”
Научный руководитель: член Союза
художников, и Союза дизайнеров России,
ст. преподаватель кафедры дизайна
Левандовская Тамара Венедиктовна
Научный руководитель теоретической
части: доктор философских наук,
профессор кафедры дизайна факультета
искусств СПбГУ
Г.Н. Лола
Cанкт-Петербург
2017
Оглавление
Введение
5
1.Глава
11
1.1 особенности развития мышления детей младших классов
11
1.2. Историография кибернетики
17
1.3 Историография языков программирования
22
1.4 Взаимодействие детей с виртуальное средой
25
1.5 Историография UX, UX, развития дизайна интерфейсов
30
2. Отличительные особенности предмета исследования
44
3 глава
54
6. Заключение
73
Приложения
91
Библографии
9
3
2
1.Актуальность.
данная тема актуальна тем , что затрагивает такую современную проблему,
как чрезмерное увлеченности гаджетами детьми, живущих в цифровую
эпоху. Проблема заключается в преимущественно пассивном восприятии
информации и отсутствии развития интеллектуального и творческого
мыслительного процесса. Продукт для которого я создаю свои
дизайн-решения также является инновационным по своим технологиям.
2. Цели:
1. Изучение и участие в юзабилити тестирования
2. создание уместного редизайна и популяризация
продукта(кибернетического конструктора ТРИК)
3. Продумывание концепции ребрендинга, учитывающего
потребностей целевой аудитории
4. Создание комплексного решения для айдентики ТРИК
5. Составление структуры, прототипа, макетов страниц сайта
6. Анализ UX, UI дизайна софта Trick Studio
3
7. Создание концепции редизайна для среды визуального
программирования, софта Trick Studio
8. Контактирование с реальным заказчиком с целью реализации
проекта.
Задачи:
1. Проведение аналитического исследования. Встреча с заказчиком,
составление основных компетенций бренда и анализ целевой
аудитории.
2. Анализ и изучение юзабилити сайтов и программного обеспечения
3. Анализ тестирования визуальной среды программирования ТРИК
Studio
4. Эскизное проектирование
5. Изучение материалов по процессам работы визуальной среды
программирования ТРИК Studio.
6. Проектирование основных элементов айдентики, фирменного стиля.
7. Изучение программы прототипирования, создание UI-kit
8. Проведение авторской фотосессии
3. основные положения исследования и выводы.
В данной работе можно выделить несколько ключевых моментов.
1. Образовательный конструктор Трик положительно влияет на
развитие детского мышления, формируя качества, способные развить
математический склад ума.
4
2. Анализ с точки зрения юзабилити и редизайн софта для среды
визуального программирования необходим для удобного
пользования и развития пользователей (в частности дети 8-12 лет)
3. Будущее внедрение дизайн проекта может положительно отразиться
на дальнейшей судьбе развития бренда ТРИК.
Введение
Данная работа раскрывает поднимает вопрос развития мышления детей
школьного возраст,по средствам кибернетического конструктора трик,
задействуя визуальную среду программирования Trik Studio.
Теоретическая часть данной работы поднимает такие вопросы как
развитие интеллектуальных способностей детей школьного возраста (8-12
лет). Проблема визуального восприятия информации и взаимодействие
детей с интерфейсами также затронута в данном исследовании.
5
C точки зрения графического дизайна данная работа затрагивает вопросы и
создан проект в сферах брендинга, айдентики, пользовательского
взаимодействия, упаковки, анимации. В ходе практической части работы
над проектом был разработан логотип и интерфейс софта для программы
Trik Studio.
Проект, основанный на данной работе может стать востребованным и
актуальным у заказчика.
Актуальность
Данная тема актуальна тем, что затрагивает развитие современных
технологий, обладающих важным влиянием на будущее. Также данная
тема важна потому что затрагивает важную на сегодняшний момент
проблему интеллектуального развития
детей. Мне представляется важным поднять в своей работе вопрос о
преимуществах и недостатках современной информационной эпохи, в
особенности преобладания гаджетов в нашей жизни и жизни наших детей.
практическая часть моей работы является неким предложением по
популяризации способа развития интеллектуальных, математических,
моторных и когнитивных способностей ребенка
Также это тема актуальна с точки зрения существующего дизайн-продукта.
В частности сам дизайн программного обеспечения ТРИК Studio является
устаревшим по своему дизайну и достаточно сложным для визуального
восприятия школьников. Также моя тема является актуальной, потому что
подобная целевая группа(интеллектуально одаренные дети 8-12
лет)является малоизученной с точке зрения юзабилити тестирования. Моя
6
работа в этой части носит теоретический характер, а дальнейшее
воплощение способствует реализации практического тестирования
пользователями. Несмотря на то, что целевая группа это дети,
продвинутые в изучении математике и являются уже интеллектуально
одарены и обладают аналитическим складом ума, существующий дизайн
продукт нуждается в переосмыслении и поиске более “дружелюбной” и
эмоциональной связи и ассоциаций с продуктом.
Объект исследования моей магистерской диссертации это развитие
интеллектуальных способностей детей в возрасте от 8 до 12 лет. В своей
работе я анализирую развитие умственных способностей и устройство
психи у целевой аудитории моего конечного дизайн-продукта.Чтобы
создать качественный дизайн продукт я стараюсь изучить Предметом же
является изучение пользовательского взаимодействия этой целевой группы
со средой программирования трик studio, а также создание нового образа
для кибернетического конструктора ТРИК. В процессе исследования я
затрагиваю история создания логотипов, анализируя современные
тенденции, связывая их с последними технологиями брендинга. В одной из
частей в моей работе мне удалось затронуть тему юзабилити в целом в
теоретическом аспекте, а также коснуться практически на примере
виртуальной среды программирования ТРИК. В практической части своей
работы я хочу создать новый бренд, целевая аудитория которого более
узко обозначена нежели у существующего продукта на сегодняшний день.
Проблема.Настоящая работа освещает такую проблему как развитие
интеллектуальных способностей детей школьного возраста посредством
кибернетического конструктора ТРИК.
7
Главные источники.
Одним из главных источников теоретической части является книга по
обучению детей посредством компьютерной среды (Компьютерная
педагогика в художественном образовании детей и подростков.
Теоретические основы и опыт внедрения,
Николай Селиванов)
В вопросах статистики и проводимых исследованиях мне была полезна
книга о развитии мышления Даниэля Канемана “Думай быстро...решай
медленно” (Канеман, Даниэль Думай медленно… решай быстро. —
Москва: АСТ, 2014. — 653 с. — ISBN 978-5-17-080053-7), также в
исследовании интеллектуальных способностей детей мне помогла книга
моего исследования является курсовая работа по анализу юзабилити
существующей среды программирования Трик Studio (Анализ
пользовательского интерфейса QReal:Robots Курсовая работа студента 445
группы Кузенковой Анастасии Сергеевны) Важным в обзоре юзабилити
возможностей среды визуального программирования стала для меня книга
Джефа Раскина(Джеф Раскин «Интерфейс: нов
ые направления в проектировании компьютерных систем», 2010.)
Цели Одной из основной целью моей магистерской диссертации является
изучение восприятия процессов обучения и соответственно влияние
развивающего конструктора на умственные способности детей. Также еще
одна цель вытекающая из другой является определение потребностей
целевой аудитории, создание соответствующего образа нового дизайн
продукта и визуальной среды программирования.
8
Также в моем исследовании существующей среды программирования я
задалась целью провести анализ существующей среды программирования
ТРИК Studio, с целью создания концептуально решения в качестве
рекомендации к существующему дизайн продукты, с целью возможного
внедрения. Еще одной из целью моего дизайн продукта стоит желание
создать продукт, удовлетворяющий требованиям различной целевой
аудитории, очень разнятся по возрасту.(учащиеся школ начальных классов,
студенты технических вузов,
Задачи
1. Исследовать проблему увлечения детьми гаджетами и выявить
особенности их использования.
2. Провести анализ существующего дизайн продукта и выявить
основные шаги на пути к редизайну.
3. Проанализировать прямые и непрямые аналоги
4. Создать концептуальную основу работы над проектной частью
Методы
1. Изучение литературы
2. анализ и сопоставление свойств схожих продуктов
3. анализ прямых и непрямых аналогов
4. Изучение программ прототипирования
9
5. Проведение сравнительного анализа интерфейса и вовлечение в
проводимое юзабилити тестирования
Краткая структура моей диссертации делиться на 3 части
1)Историческое и терминологическое изучение вопросов формирования
мышления у детей, а также их способы взаимодействия со
информационной средой. Данная работа рассматривает развитие
абстрактного мышления у детей и развитие восприятия визуального в
целом. Также иное исследование затрагивает анализ восприятия детьми
интерфейсов, и способы их взаимодействия с ними.
2)Глобальная, вторая часть моего исследования несет в себе изучения
профессиональной литературы, понятий и способов работы в графических
редакторах.
3)Самая интересная часть данной магистерской диссертации - это
формирование концепции, поиск образа, формы для воплощения.
Непосредственно сама реализация занимает не главную роль в данном
исследовании. Эта работа ценна своей исследовательской частью.
10
1.Глава
1.1 особенности развития мышления детей младших классов
Настоящая работа посвящена исследованию детского интеллектуального
развития на примере кибернетического конструктора.
В начале моего исследования мне было интересно рассмотреть такую
проблему как взаимодействие детей школьного возраста с компьютерной
средой. Далее ход исследования обратит внимание на вовлечение детей в
процесс обучения программированию на примере конкретного продукта, а
именно конструктора ТРИК, и среды визуального программирования
ТРИК studio.
Моя работа посвящена в целом тому, как сделать удобным и полезным, а
главное интересным для детей процесс обучения таким сложным вещам
как программирование. Эта проблема стала актуальной в связи с
современными тенденциями в развитии технологии. Следовательно и в
системе образования должны возникать инновационные решения. Поводом
11
для развития умственных способностей детей может послужить и
изменения в экономике в глобальном масштабе, а также в изменении
восприятия реальности современных детей, благодаря гаджетам.
С каждым шагом прогресса человечества мы создаем новую среду, а
именно среду экономики знаний.1 Именно обладание неким знанием
делает индивида жизнеспособным и прогрессивным членом общества.
Еще одной особенность современного развития детей можно назвать то,
что они родились в эпоху информационных технологий, и современные
психологи дают таким детям очень образное определение как “цифровых
аборигенов”
Если современное поколение выросло без всевозможных гаджетов,
интернета, то для сегодняшних детей подобные явления стали
привычными. Безусловно технологии опережают воображение, что не
может отразиться на развитие способностей современных школьников.
Гаджеты и программы упрощают нашу жизнь, позволяя делать меньше
телодвижений на пути к получению определенной информации. Здесь
можно столкнуться с таким понятием как интеллектуальная скупость. Это
понятие означает что мы выбираем самое простое решение, потому что
автоматически стремимся к экономии умственных ресурсов. Такие ошибки
рассматривались как сбои в обработке доступной информации или ошибки
эвристики (изучение которых прославило Дэниела Канемана).
По мнению отечественных педагогических психологов2 процесс обучения
должен желательно формировать разделяя все возможные способы и виды
мышления. И сама составляющая образовательного процесса обучения
должно соотноситься с определенными видами мышления, существующих
1
2
Лиотар. Состояние постмодерна (1979). СПб. 1998.
(Г.А. Берулавы, 1991; Н.С.
Якиманской
, 1985; И.И. Юдашиной, 1989 и др.)
12
у детей на данном этапе их развития. Особый интерес в этой связи имеет
детский возраст(в данном исследовании возрастный рамки это 8-12 лет).
Данная возрастная категория интересна тем, что в этот период завершается
формирование операциональной структуры мышления и происходит
сближение мышления и воображения в процессе творчества3. Поэтому
очень важно проследить за развитием детей на этапе. Обильное увлечение
визуальными медиа, воздействие интернета и внешних раздражителей
может замедлить интеллектуальные и коммуникативные способности
ребенка. Эта данно исходит из состояние современного социума и его
развития. Современное информационное общество вынуждено жить в
мире многозадачности и рассредоточенности цели, размытом фокусе
внимания. Многозадачность и постоянная подключенность к цифровым
устройствам приводят к тому, что мы тратим огромное количество энергии
на переключение между разными контекстами, вместо того, чтобы
сосредоточится на чём-то одном. Даже современный взрослый попадает в
ловушку зависимости от гаджетов и постепенного расфокусировка
внимания. В основном гаджеты и различного рода диджитал устройства и
игрушки созданы для развлечения, что естественно, т.к. мир, начиная с
раннего возраста познается через игру и игра, это некое безопасно, то, что
уводит нас от реальности в мир детского абстрактного мышления и
состояния отрешенности и погруженности в безобидный и словно
бесконечный процесс получения удовольствия. Мы пока не умеем
использовать новые технологии так, чтобы они не вредили нашей
интеллектуальной продуктивности. Для этого необходимо понимание
базовых механизмов работы нашего мозга.4 Психологи советуют быть
3
(JI.C.
Выготский
, 1983).
4
Мозг освобожденный: Как предотвратить перегрузки и использовать свой потенциал на полную мощь
BrainChains: Discover your brain, to unleash its full potential in a hyperconnected, multitasking world
оценок: ТЕО КОМПЕРНОЛЛЕ / THEO COMPERNOLLE
13
крайне осторожными с использованием гаджетов. Из исследований
известно, что до 7 лет мозг ребенка развивается на 80% своего потенциала.
И развитие происходит за счет раздражения мозга сенсорными
впечатлениями. К ним относятся: движение (крупная моторика), мелкая
моторика, зрение, слух, ощущения, запах. Впечатления же получаемые при
так называемом общении с техникой можно назвать “плоскостными”,
потребительскими, не требующими работы тех участков мозга в полной
мере.Ученые из Калифорнийского университета с помощью
функциональной магнитно-резонансной томографии (МРТ) определили
как работает наш мозг во время просмотра фильмов. Исходя из
исследований ученых можно сделать вывод, что время проведенное за
просмотром фильмов, мультиков, воздействует на мозг также сенсор, как и
реальная жизнь, вызывая определенные эмоции. Данное утверждение
может говорить о негативном влиянии в плане замещения настоящей
жизни искусственными впечатлениями.
Еще одна на сегодняшний день проблема в процессе обучения и детей,
как отсутствие тяги к обдумыванию, недостаточная сосредоточенность
сосредоточенности, сконцентрированности, отсутствие мыслительного
процесса в обдумывании. Современное образование становится
ограниченно «тестовыми технологиями» лишая возможности творить и
мыслить, все меньше задействована моторика рук. Например, многие
школы отказались от ручного письма и обучают современных школьников
печати на компьютере. Если разобраться как в данной ситуации работает
мозг ребенка, то можно проследить снижения уровня способности
осмыслять написанное. В процессе написания текста от руки мозг словно
повторяет очертания того,что было написано ручкой, наш мозг словно
“почувствовав” поверхность бумаги с чернилами запоминает форму буквы
14
лучше, задействовав намного больше возможностей и своих ресурсов. Так
называемое медленное мышление. Ученый Даниэль Канеман приводит
пример с машинистами, полагающимися на машинный способ печати в
своей работе. В своих текстах они не допускали ни одной ошибки, но
совершенно не могли вспомнить о чем был текст. Исследователи пришли к
выводу, что ручка и бумага заставляют людей не только записывать, но и
обрабатывать информацию.
Также можно провести аналогию с объектом нашего исследования кибернетическим конструктором. в целом детские металлические
конструкторы помогают ребенку приобрести множество полезных
навыков. Прежде всего они развиваютмелкую моторику, логику и
системное мышление. В процессе работы ребенок приобретает навыки
технического мышления, самостоятельности и сосредоточенности. Также
улучшается координация движений. Нельзя также не отметить
преемственность поколений и общении с более взрослым наставником,
возможность чему-то научиться, ощутить себя более значимым и важным,
подчеркнуть свою исключительность, это и есть важная потребность
ребенка в формировании личности. Также подобный способ игры
развивает когнитивные функции ребенка. Собранный конструктор являет
собой аналог увеселительного “гаджета” только здесь важен сам процесс,
именно он дает 80% развития. Эта особенность очень важная для
современного института семьи, т.к. опираясь на современные
исследования, можно сказать, что замещение и подмена человеческого
способа коммуникации в семье электронным суррогатом представляют
существенную опасность, так как нарушают нормальный код и алгоритм
психического, социального, культурного и духовного развития детей.
Малолетние пользователи электронных игрушек становятся
самодостаточными, у них слабеют нормальные потребности и мотивации в
15
контактах с родителями и детьми. Постепенно взрослые утрачивают
ведущую роль в отношении психического, речевого, эмоционального,
коммуникативного, социального и духовного развития и теряют
способность влиять на поведение ребенка 5
Тем не менее дети будут продолжать любить гаджеты и их непреодолимая
тяга к познанию и изучению всего нового и инновационного возьмет
вверх. Поэтому в первую очередь нужно было создать продукт,
увлекающий детей, а также развивает их интеллектуальные способности.
Также очень важен процесс обучения. Рассмотрим следующий
эксперимент. Вот, например, один из таких экспериментов. Надо разделить
учеников на две группы. Одну из них поместить в многозадачную среду:
пусть преподаватель объясняет новый материал при телевизоре,
включенном на новостном канале — например, на CNN с их интенсивным
видеорядом и энергичными комментариями. А другой группе надо
обеспечить многозадачную среду, где тот же преподаватель будет читать
лекцию без отвлекающих внешних факторов. Очевидно, что учащиеся в
первой группе усвоят и запомнят материал гораздо хуже, чем во второй.
К сожалению, многие педагоги не знают о негативном влиянии
многозадачности. Они позволяют своим ученикам и студентам
пользоваться во время занятий планшетами и смартфонами — якобы для
ведения записей и выполнения заданий. Но не проверяют, чем учащиеся
занимаются на самом деле. Между тем исследователи обнаружили, что на
некоторых занятиях всего 10% учащихся использовали свои гаджеты
действительно для учебных целей.
5
Влияние гаджетов на развитие коммуникации, социализации и речи у детей раннего и дошкольного
возраста М.В. БЕЛОУСОВА, А.М. КАРПОВ, М.А. УТКУЗОВА
Казанская государственная медицинская академия, 420012, г. Казань, ул. Бутлерова, д. 36
16
В процессе обучения сборки конструктора Трик юным пользователям
нужно не только сосредоточиться на выполнении задачи, но и
задействовать когнитивные ресурсы. Общаясь с наставником или обучаясь
в группе, класс, или на специализированном курсе, ребенок всесторонне
развивается. Подобная система обучения позволяет следовать за
собранным роботом гаджетом, что также хорошо сказывается на
физическом здоровье юного организма
Говоря о более точном предмете моей магистерской презентации,
кибернетическом конструкторе Трик, можно утверждать, что подобный
проект решает многие проблемы в социализации и развитии школьников.
Кибернетический конструктор ТРИК — возможность без помощи
профессиональных инженеров и программистов собирать роботов на
основе передовых технологий мирового уровня. Он позволяет создавать
различные модели от простых радиоуправляемых до сложных
современных кибернетических систем. Простота и удобство конструктора
делают его интересным для школ и для широкой аудитории разного
возраста, добавляя самые современные технологии к лучшим традициям
советской школы.
1.2. Историография кибернетики
В своей работе мне хотелось бы проанализировать развитие
робототехники. Если опираться на развитие технологий и ремесел, можно
сделать вывод, что робототехника представляет собой естественное
логическое продолжение техники как явления. Сейчас роботы постепенно
17
вытесняют человека из многих сфер его деятельности. В будущем, по
прогнозам футурологов, многие профессии просто лишится
“человечности”, потому что на смену людям придут более совершенные с
точки зрения функциональности машины - роботы. Данная развитие
технологий предоставит взамен все новые возможности для творческого
развития человека, но в тоже время и снизит уровень активности
деятельности человека (просмотр кинофильмов, подводные погружения,
компьютерные игры и т.д.) Часть всеобщего труда, затрачиваемая
человечеством на производство средств производства, а не конечного
продукта потребления, постепенно увеличивается от 0%, очевидно
стремясь к 100 %.6 Стоит разобраться, как человечество смогло прийти к
такому положению вещей.
Если окунуться в историю развития робототехники, то можно выделить
ключевые даты и события :
● 5-й век до н.э. Идея разумного робота была впервые упоминается в
древнегреческих мифах. В частности, скульптор Пигмалион изваял
статую и оживил ее. Философ Аристотель создал формальную
логику. Все классические системы компьютеров основываются на
положениях этой науки.
● 4-й век до н. э. Философ и математик Архит Тарентский создал
механического голубя, сделанного из дерева, способного махать
крыльями.
● 1834 г. Андре Ампер написал труд «Опыт о философии науки»,
вводя понятия кибернетики
6
.Боголюбов А.Н., Никитин Д.А. Популярно о робототехнике. – Киев: Наук. Думка, 1989. – 200 с.
18
● 1948 г. Норберт Винер опубликовал книгу «Кибернетика».
● 1968 г. Первое упоминание слово робот в научной статье появилось
в статье В.А.Якубовича «Кибернетика и теория регулирования».
● Весной 1974 г. Студентом 5 курса Гусевым С.В. под руководством
В.А. Якубович создан второй в мире (первый в России) автономный
мобильный робот. В 1983г. по заказу КГБ в МВТУ им. Баумана
(кафедра СМ-7) создан мобильный робот, работающий со
взрывоопасными предметами в составе подразделений по борьбе с
терроризмом.
● В США, в 1985 появляется в продаже домашний робот RB5X. Его
можно запрограммировать на речь, перемещения по комнате и
выполнение несложных заданий по доставке предметов.
● 1996 г. Корпорация Honda создала андроида P-2, который мог
ходить, подниматься по лестницам и переносить тяжести 2000 г.
Проанализировав историческую составляющую вопроса, задаешься рядом
вопросов филисофской напрвленности. Безусловно можно просмотреть
тенденцию развитию общества к замене деятельности человека на
автоматизацию, механизацию многих навыков, умений, профессий.
Многие футурологи считают, что учиться воспринимать будущую
реальность как мир и дополненными реальностями, робототехникой,
высокотехнологичный мир уже сейчас. Человечество придет к данному
образу жизни в любов случае, это становится неизбежно. Поэтому
конструировать будущее детей должны учить уже сегодня. Прогресс и
информационное развитие общества будет требовать актуального
образования. В будущем многие профессии будут заменены роботами и
19
самыми востребованными могут стать профессии людей одинаково
творчески мыслящих и обладающих высокими интеллектуальными
способностями и аналитических складом ума.. Поэтому основы для
подобного всестороннего развития нужно заложить уже в школе.можно.
Продолжая хронологию моего разбора развития робототехники хотелось
бы подробнее рассмотреть технические показатели конструктора Трик, а
также выделить основные аналоги. Углубляясь в сферу моего дипломного
проекта и анализируя аналогичные кибернетические конструкторы я
выделила:
● LEGO (Mindstorm RCX, NXT, EV3,Tetrix, Matrix)
● Fischertechnik
● Vex (Vex IQ,Vex PRO)
● BIOLOID
● ARDrone
На ряду с передовыми технологиями аналогичных кибернетических
конструкторов можно выделить отличительные особенности конструктора
ТРИК:
● Двухъядерный процессор
● DSP-ядро для обработка аудио\видео real-time
● Подключение 4 силовых и 6 сервомоторов
● Подключение до 12 аналоговых и цифровых датчиков
● Wi-Fi/Bluetooth
● Подключение фотомодулей и USB камер
20
● Модули расширения ГЛОНАСС/GPS, GPRS
Данные технические характеристики отвечают современному уровню
развития технологий в области кибернетики. При этом речь идет не
столько о специальной и промышленной робототехнике, сколько о
персональной и сервисной — роботы в быту, вокруг нас. Кроме того,
использование робототехники в образовании позволяет противостоять
мощной современной индустрии развлекательных гаджетов. Для
школьников и студентов робототехника является наглядным и
увлекательным способом изучения механики, математики, кибернетики
(теории управления), программирования, технологии и даже физики. Еще
одним плюсом развивающих конструкторов может считаться развити
креативности у детей. Процесс создания и проектирования нечто нового
заложен в нас с рождения. Так называемая креативность позволяет детям
не только словно проживать свой фантазийный мир как реально, но и
рисовать, строить из игрушек замки, писать сочинения.Ученые,
работающие в этой области, определяют «пики и спады» в проявлениях
агрессивности. «Пики» появляются в возрасте 5, 9, 13 и 17 лет , далее, от 3
до 5 лет наблюдается стабильность в развитии креативности, а от 15 до 18
лет креативность заметно возрастает. «Золотой порой творчества» Гарднер
считает возраст старших дошкольников, а следующий пик, по его мнению,
возникает в возрасте 14-16 лет7
7
Седых К. Ю. Исследование психологических особенностей школьников-участников проекта
«Уральская инженерная школа» (по направлениям «Робототехника» и «3Д-моделирование») :
магистерская диссертация / К. Ю. Седых ; Уральский федеральный университет имени первого
Президента России Б. Н. Ельцина, Институт социальных и политических наук, Кафедра психологии
развития и педагогической психологии. — Екатеринбург, 2015. — 154 с. — Библиогр.: с. 79-84 (72 назв.).
21
1.3 Историография языков программирования
В моем исследовании я посчитала нужным затронуть вопрос
формирования языков программирования, т.к. одна из составляющих
частей моей диссертации является изучение и преобразования дизайна
среду визуального программировани Trik Studio
, созданный для записи
Язык программи́рования — формальный язык
компьютерных программ. Язык программирования определяет набор
правил синтаксиса, лексики а также семантическихправил, определяющих
внешний вид программы и действия, которые выполнит исполнитель под
ее управлением. Исполнитель в данном контексте это ЭВМ. Если
обратиться к истории, то можно выделить этапы развития данной среды.
1)Первые программы.
Первое, что удалось запрограммировать в истории это действия
переключателей на панеле вычислительного устройства, что позволяла
создавать простые и небольшие программы. Одно из ранних упоминаний о
создании полноценного языка программирования можно считать язык
Plankalkül. Этот язык можно считать прорывом в истории, но он не сразу
стал востребованным.
22
2)Машинный язык. К концу 40-х годов, с развитием компьютерной
техники сначала получил распространение машинный язык. программист
просто задавал команды, оперируя с ячейками памяти, основываясь на
технических возможностях аппаратуры. . Основной смысл этого языка
заключается в простом наборе кодов, которые должны быть понятны
процессору.
3)Языки высокого уровня
Новый этап развития языков программирования был сделан в 1954 году.
Появился язык высокого уровня Фортран (FORmula TRANslator).
Компилятор(это программа, которая преобразует текст пользовательской
программы в некоторое представление, пригодное для выполнения ее на
компьютере.)появился в апреле 1957 года. На развитие языка также
повлияло появление в 1954 году компьютера IBM 704. Вслед за ним
появились и некоторые другие языки, например: LISP, ALGOL 58, FACT.
Языки высокого уровняимитируют естественные языки, посредством
внедрения разговорного языка и общепринятых математических символов.
Основное преимущество данных языков состоит в увеличение строк кода
до тысяч в длину длиной. Условными словами можно было, как привычно
человеку, гораздо более просто выразить сложную программную операцию
из битов. В дальнейшем появились COBOL (1959), Паскаль (1970), Си
(1972).
Структурное программирование
В начале 1960-х годов сложность программ возрастала, вследствие чего
потребность в повышении результативности работы программистов
увеличилась, что привело к созданию структурного программирования.
Эдсгер Дейкстра описал основные принципы данного вида
23
программирования. Суть данного вида программирования заключается в
следующем: если задача выполняется какое-либо количество раз, то её
можно обозначить как функцию или как процедуру. И в процесс работы
просто вызывать данную функцию, где она уместно. Данный подход
значительно сократил длину кода. Также было введено понятие структуры
данных( составные типы данных, построенные с использованием отличных
от них типов данных). Например структура времени содержит в себе такие
типы данных как часы, минуты.
Более поздними примерами объектно-ориентированных языков являются
Object Pascal, C++, Java, C# и др.
Ходе работы над магистерской диссертацией я изучала правила разметки
html для большего погружения в тему. Сервис CodeAcademy позволяет шаг
за шагом повторить, созданный заранее код страницы. Данный опыт
рекомендуется при обучению веб-дизайну. Научится программировать, в
первую очередь это значит формулировать задачу в строгих
математических терминах, находить решение в виде последовательности
действий понятных компьютеру, записывать эту последовательность на
языке программирования.
В данном продукте визуальной среде программирования ТРИК Studio
используется язык программирования под названием ДРАКОН. Этот язык
опирается на математику и логику. Однако кроме того, он учитывает
когнитивные вопросы. Благодаря использованию формальных и
неформальных когнитивных приемов дракон-схемы позволяют изобразить
решение любой. Все это данный язык позволяет совершить в наглядной
простой форме. А также улучшить понимаемость алгоритмов и программ
для человеком.Данный язык полезен при организации школьных курсов
24
8
информатики. Блок-схемы, нарисованные по правилам языка ДРАКОН,
отличаются четкостью, наглядностью и прозрачностью структуры. А
наглядность и доходчивость алгоритмов — это именно то, чего так остро
недостает школьным учебникам.(рис.1)
1.4 Взаимодействие детей с виртуальное средой
В данном параграфе я исследую этапы развития мышления детей в
зависимости от возраста и одаренности, а также хочу привести
положительные примера вздимодействия с гаджетами и компьютерной
средой.
Развитие мозга и особенности визуального восприятия детей
Где-то в возрасте двух лет ребенок начинает осознавать себя как личность,
но при этом у него нет понимания многих абстрактных понятий. Что
касается физических навыков, они также несовершенны, но малыш может
ударить или нажать на сенсорную кнопку. Исследования показывают, что
самый популярный гаджет у детей до 4-ех лет – это планшет.Различают
три основные формы абстрактного мышления: понятие, суждение и
умозаключение. Понятие обозначает конкретные предметы, которые
объединены несколькими или одним признаком. Это то с чем мы
знакомимся, как только начинаем учиться разговаривать. Дом, стол, река –
это все понятия. Суждения – это наши отрицания или утверждения,
которые могут быть короткими или длинными. Первые суждения детей
8
Пышкин Е. В. Структурное проектирование: освоение и развитие методов. С примерами на языке C++: Учеб. пособие. — СПб.: Политехнический университет, 2005. — 324
с. — ISBN 5-7422-1000-0
25
выглядят как: «корова делает му», «машина едет». Умозаключение более
сложная форма мышления, так как оно является выводом касательно
существующего суждения. «В бензобаке есть бензин, а водитель за рулем,
значит, машина сейчас поедет» - это умозаключение.
Примерно в возрасте шести лет, лобные доли медленно начинают
созревать и развиваться. Примерно в этом возрасте вы можете начать
учить детей сосредотачиваться на более длительные периоды времени
(мальчиков немного позже, чем девочек). Примерно в этом возрасте дети
начинают учиться обращаться с ножницами. Но до десяти лет у малышей
еще слабо развита мелкая моторика – и это основной фактор, который
влияет на то, как дети физически взаимодействуют с интерфейсом.
Опираясь на мнения педагогических источников можно сказать, что
влияние компьютера на детей 7-8 лет очень благотворно и помогает в
формировании определенных навыков. Работа с компьютером развивает
внимание, логическое и абстрактное мышление. Компьютерные игры
помогают детям научиться принимать самостоятельные решения, а также
быстро переключаться с одного действия на другое. Хорошо влияет
компьютер и на творческие способности детей. В этом случае все зависит
от индивидуальных особенностей ребенка: одни дети начинают быстрее
изучать языки, а другие – рисовать. Развивающие компьютерные игры для
детей – отличный способ самообразования, умение пользоваться
Интернетом может стать хорошей школой общения и навыков по поиску и
отбору информации9
9
Петрова Е. И. Журнал
Философские проблемы информационных технологий и киберпространства
Выпуск№ 1 / 2012
Коды
● ГРНТИ: 15 — Психология
● ВАК РФ: 19.00.00
● УДK: 159.9
● Указанные автором: УДК: 159.9:373
26
Итак, к каким же выводам приходят те, кто занимается проблемой влияния
компьютера на восприятие информации и мышление детей?
Восприятие информации. «Новые дети по-другому воспринимают
информацию. Они привыкли, что все должно быть ярким, зрелищным,
наглядным», – говорит доктор социологических наук, директор проекта
«Новое поколение» ФОМа Лариса Паутова . Это дает и плюсы, и минусы.
Учителя отмечают, что у современных детей форма преобладает над
содержанием. Ребенок может с легкостью сделать электронную
презентацию – красивую, наглядную, яркую, но по содержанию
неглубокую, поверхностную. Обилие и разнообразие информации не дает
возможности для детальной, скрупулезной, аналитической работы, и в
этом их слабость. «Их плюс – море креатива, свобода для творчества и
самореализации», – продолжает Паутова. Наступило новое время, когда
индивидуальные способности ценятся больше, чем командный дух.
Кибернетический конструктор как раз призван для формирования именно
содержательного восприятия деятельности. Ребенок учится
последовательности действий, но освоив простые формы и детали
способен творить, создавая нечто новое. Компьютерная среда
программирования также требует большой концентрации и усилия над
собой, что добавляет к формированию личности волевых качеств.
Эволюция мозга. Мнения по этой проблеме разделились. По мнению
пессимистов, информационно насыщенная среда не стимулирует, а душит
воображение. Дети потребляют огромное количество «готовой»
информации – видео-, аудио-, говорящие игрушки, интерактивные игры.
Повзрослев, они усаживаются за Facebook и Twitter, которые отупляют.
27
Есть исследования, которые показывают: те, кто часами сидит в соцсетях,
как бы впадают в детство. Этот феномен психологи назвали “кризисом
идентичности”. Для него характерны неадекватность самооценки, утрата
чувства перспективы, беспричинный пессимизм, внешняя пассивность,
бескомпромиссность, а порой, и агрессивность. Психологические
эксперименты также показали, что, когда их участникам задавали сложные
вопросы, они начинали думать о компьютерах как о
палочках-выручалочках. По сути, рождается поколение людей,
нуждающихся в очень примитивном общении, потерявших способность к
концентрации внимания и постоянно желающих обратить на себя
внимание.
Уже в десять лет ребенок имеет необходимые физические навыки, чтобы
полноценно пользоваться клавиатурой и мышкой. Но есть особенность,
которая отличает ребенка от взрослого – это до сих пор не разработанная
способность мыслить абстрактно. Она начинает формироваться в 12 лет, а
заканчивает – в 26. Способность мыслить абстрактно очень важна, потому
что она позволяет человеку предвидеть последствия своих действий и
задуматься о них. Конечно, 8-летний малыш может предсказать, что,
опрокинув стакан воды на компьютер, он сломает его. Но можно
гарантировать, что через две недели после ремонта, ребенок будет просить,
чтобы сидеть за компьютером с бокалом воды снова.
Так и с рекламой. Если ребенок один раз пройдет по ссылке, он сделает это
снова и снова, и так до тех пор, пока компьютер не выйдет из строя из-за
вирусов. Все потому, что мозг ребенка еще не может осознать до конца
последствия совершенных действий. Малыш еще не может понять, сколько
времени, денег и усилий будет положено для ремонта компьютера, или
28
сколько данных может быть отправлено хакеру, который может
отслеживать каждый шаг или причинить другой вред.
Говоря об абстрактном мышлении и его развитии, нельзя забывать то, что
программисты очень часто имеют дело с абстракция в придумывании всех
возможных событий. Абстракции – это по определению упрощение
информации, которое достигается рассмотрением большого количества
примеров и сжатием их в общий шаблон.Для некоторых людей
естественно абстрактное мышление, в то же время другие предпочитают
конкретные факты. Абстрактно выражаясь, речь идет о способе, которым
люди обрабатывают информацию. Языки программирования, типы
данных, графические представления, потоки управления и т.д. являются
абстракциями реального мира, абстракциями аппаратного обеспечения и
часто абстракциями абстракций. Исходя из этого можно сделать вывод
того, что любой интерфейс, в частности программная среда должны быть
упрощены и понятны детям, до конца не обладающим абстрактным
мышлением. Очень важно понимать, как пользователь себя ощущает в
процессе работы, чтобы добиться от него большего результата и
заинтересованности. В следующем параграфе можно увидеть раскрытие
данного вопроса более подробно.
1.5 Историография UX, UX, развития дизайна интерфейсов
В данном параграфе я бы хотела коснуться вопроса об истории развития
UX UX дизайна, выделить основные понятия, определения, принципы.
Также мне хотелось бы рассмотреть более подробнее существующие
29
исследования по этой тематике но в сфере пользовательского
взаимодействия детской ЦА с программным обеспечением.
Итак, если утверждать, что интерфейс является совокупностью
логических и физических принципов взаимодействия компонентов
технических средств вычислительной системы, т. е. совокупность правил
алгоритмов и временных соглашений по обмену данными между
компонентами вычислительной системы (логический интерфейс), а также
совокупность физических, механических и функциональных
характеристик средств подключения, реализующих такое взаимодействие
(физический интерфейс). Что же является пользовательским
интерфейсом?ПИ – это способ выполнения задач, это действия,
своешаемые ради получения определенного результата. Машинная часть
интерфейса имеет четко определенное поведение, то поведение
пользователя непредсказуемо. Особенности психики, личности, увлечения,
и прочие факторы влияют на то как поведет себя пользователь в
определенный момент, в следствии этого при разработке интерфейсов,
нужно всегда думать об особенностях юзера той или иной социальной
группы. ские и психологические особенности. Теперь давайте разберемся с
понятием эргономики. Это, в первую очередь, наука, изучающая действия
человека в процессе работы, затраты его энергии, интенсивность при
конкретных видах деятельности и производительность, скорость освоения
пользователем новой техники. Как и любая наука, эргономика обладает
системой определенных смысловых маркеров-показателей, благодаря
которым,можно оценить работу данной системы. Система показателей
Бена Шнейдермана является самой распространенной системой
характеристик на сегодняшний день. Эта система включает в себя
следующие характеристики:
30
1. скорость работы пользователя
2. количество человеческих ошибок
3. субъективная удовлетворенность
4. скорость обучения навыкам оперирования интерфейсом
5. степень сохраняемости этих навыков при не использовании
программного средства.
Плюс данной системы это разделение на области применения, ее
предметность. Улучшение определенных показателей намного
показательнее, нежели абстрактная формулировка по улучшению
эргономики. Данная система позволяет количественно измерить уровни
показателей, что облегчает коммуникацию и ясность проделанной работы
Среди недостатков системы показателей Шнейдермана можно назвать
конфликт показателей(если цель у разработчиков стоит в увеличении
одних показателей, то другими они могут пренебречь), также данная
модель не учитывает всех возможных факторов воздействия на
пользователя. Считается, что, как правило, высоких значений можно
добиться только по двум показателям модели Шнейдермана. Однако
модель Шнейдермана является полезным средством в определении точных
характеристик интерфейса, поэтому зачастую это весьма полезный
инструмент в его разработке.
На сегодняшний день такой целостный подход к изучению удобства
интерфейсов как юзабилити, считается более точным и целостным, нежели
модель Шнейдермана. Если обратиться к многочисленным понятиям слова
юзабилити, то можно выделить три наиболее распространенных. Согласно
международному стандарту (ISO 9241-11) юзабилити— это степень
эффективности, трудоемкости и удовлетворенности, с которыми продукт
может быть использован определенными пользователями при
31
определённом контексте использования для достижения определенных
целей. Определение, предложенное UPA (Usability Professionals
Association) концентрируется больше на понятии юзабилити в контексте
процесса разработки программного продукта: «Юзабилити— это подход
к разработке продукта, который вовлекает обратную связь с пользователем
на всех этапах разработки с целью создать продукт, отвечающий нуждам
пользователя.» Стив Круг в своей книге дает следующее простое
определение: «В действительности юзабилити — просто убеждение в том,
что что-то работает хорошо — будь то веб-сайт, пульт управления или
вращающаяся дверь — по прямому назначению и не оставляет
пользователя безнадежно разочарованным.» 10
Разобравшись с определениями и основными понятиями (дополнительные
понятия я введу в последующих частях исследования), можно приступить
к более глубокому исследованию истории хабилити с точки зрения
рассмотренной ранее нами целевой аудитории, а именно детей в возрасте
8-12 лет. В своем исследовании (в первой части второй главы) я хочу
рассмотреть развитие Детский UX на примере анализов зарубежных сайтов
и предоставленного юзабилити обзора петербургской студии юзабилити, а
также на примере анализа российский юзабилити студии “собака павлова”.
В процессе анализа очень важно учитывать был ли ориентирован
интерфейс на пользовательскую аудиторию ли же аудитория настолько
широка, что дизайн вынужден быть унифицированным?Следующим
подходом, как по сложности, так и по времени своего появления,дизайн
ориентированный на пользователей (User Centered Design, далее ДОП). Его
сущность кратко можно охарактеризовать следующим образом — если мы
хорошо изучим нашу аудиторию и оптимизируем интерфейс под неё, наш
интерфейс будет хорошим. Отсюда два основных следствия ДОП:
10 Круг С. Веб-дизайн: книга Стива Круга или «не заставляйте меня думать!» - Пер. с англ. - СПб: Символ-Плюс, 2005. - 200 с: цв. ил. ISBN 5-93286-021-9
32
Отношение пользователей к интерфейсу является главным показателем
качества интерфейса.Работа над интерфейсом непродуктивна и зачастую
бессмысленна без изучения в первую очередь физиологических
особенностей аудитории, а также уровня начальной подготовки
пользователей, их ожиданий, знаний предметной области. Самой важно о
чем должен помнить дизайнер-проектировщик так это то ,что если вы
спроектировали интерфейс и он вам очень нравится, это ничего не решает,
потому что пользователи могут не разделять ваш вкус. Например,
интерфейсы продуктов для детей разрабатывают взрослые, то и дизайн
долж соответствовать уровню потребностей детской аудитории. Например,
молодые веб-дизайнеры (еще) обладают хорошим зрением и поэтому не
имеют ничего против очень мелкого набора. Адресаты их работы, как
правило, несколько старше, и их зрение уже не так остро, поэтому
дизайнер должен всегда учитывать данные особенности. При этом
очевидно, что интерфейсы для детей разных возрастных групп должны
отличаться друг от друга и тем более от интерфейсов для взрослых.
Если говорить об исследованиях в области детского UX исследования, то
далее в своей работе я рассматриваю некоторые исследования, который
могут быть полезны в процессе дальнейшего проектирования.
В 2012 году исследовательская группа Nielsen Norman Group изучила
интернет-привычки детей в возрасте от 3 до 12 лет, чтобы понять, с какими
трудностями в дизайне и юзабилити сталкиваются дети. Многие взрослые
с уверенностью скажут вам, что дети лучше разбираются в интерфейсах
программ и приложений. Тем не менее это неправда — существует
большая разница между пониманием того, как работает технология, и того,
33
за что отвечает ее та или иная часть.11Поэтому маркетологам не стоит
переоценивать интернет-грамотность детей.
Методология
Что касается методологии, применяемой мной в выполнении практической
части, то предлагаю рассмотреть методику Джеймса Гарретта. Джесс
Джеймс Гарретт — признанный эксперт в сфере информационной
архитектуры и опыта взаимодействия. Именно он предложил эффективный
метод разработки сайта с помощью пяти уровней опыта взаимодействия,
каждый из которых решает одну из ключевых задач, делая процесс
максимально оптимизированным. Концептуальная модель Гарретта
проектирует пользовательский опыт взаимодействия человека с
web-приложениями и сайтами. Она предлагает базис для обсуждения
имеющихся вопросов и проблем, связанных с опытом вместе с
представлением средств и путей для эффективного решения. Разработка
сайта/приложения начинается с верхнего уровня, а затем в процессе
работы продвигается вниз. Другими словами, решения конкретизируются и
обрастают деталями. Все уровни связаны между собой, что предполагает
абсолютную согласованность каждого решения. Между уровнями
реализована зависимость, как прямая, так и обратная: порой проблемы, с
которыми разработчики продукта столкнутся на нижнем уровне, требуют
трансформации тех решений, что были приняты «вверху». Всего уровней,
как уже было отмечено 5. Чтобы понять их специфику и важность,
предлагаем познакомиться вкратце с каждым. Уровень стратегии. Данный
уровень является самым высоким и абстрактным в обсуждаемой модели.В
нем разработчикам сайта придется получить ответы на ряд важных
11
Влад В. Головач Дизайн пользовательского интерфейса2 Искусство мыть слона
http://www.usethics.ru, deus@exmachina.ru Версия 2.11, обновление от 20.5.2010
http://lpgenerator.ru/blog/2014/07/18/yuzabiliti-dlya-samyh-malenkih-ili-kak-sozdat-veb-resurs-kotoryj-ponravitsya-detyam/
34
вопросов относительно ожиданий от готового продукта не только со
стороны пользователей, но и заказчика. Ответы формируются и
представляются в формате списка.
Уровень набора возможностей. В этот уровень включено перечисление
имеющегося арсенала возможностей, которые доступны пользователям. А
вот, что касается их реализации и организации, то эти вопросы будут
решаться на последующем уровне. Проще говоря, на уровне набора
возможностей необходимо понять, что следует делать, а что — нет!
Уровень структуры Уровень структуры — безусловно, один из ключевых,
так как в нем будет прописываться взаимное расположение всех элементов
web-сайта: страниц, окон, кнопок, форм и так далее. Он отвечает на спектр
таких вопросов: «как», «куда», «откуда» будет перемещаться пользователь
ресурса. Благодаря этому уровню, реализуется эффективная структура,
которая, в свою очередь, значительно облегчает навигацию, делая ее
простой и понятной. То есть на предыдущих уровнях были получены
определенные решения, а здесь формируется целостная «картинка», где и
как их применять на практике. Сегодня уровни структуры должны
максимально упрощаться поэтому стоит соблюдать принцип уровней
вложенности.Опираясь на контент, следует сделать все страницы сайта
доступными в 3 клика. Понять это можно следующим образом:
● Первый клик — первый уровень вложенности — главная страница
● Второй клик — второй уровень вложенности — разделы и рубрики
● Третий клик — третий уровень вложенности — статьи12
12
https://whiteprofit.ru/seo/pravilnaya-struktura-sajta.htm
35
Уровень компоновки Следующий в иерархии уровень компоновки,
который представляет собой максимально конкретизированную
реализацию имеющейся абстрактно прорисованной структуры будущего
продукта. В его рамках следует решать вопросы относительно самого
эффективного расположения имеющихся элементов UI.
Уровень поверхности Самый нижний (и один из самых важных) — это
уровень поверхности, который призван отражать внешний вид сайта. На
этом уровне прорабатываются модульная сетка, типографика, цветовые
решения и в итоге создается графический макет. Здесь содержание,
функциональность и эстетика объединяются, чтобы получился
законченный сайт, соответствующий всем целям, сформулированным на
четырех верхних уровнях.
Если говорить о терминах и построении сетки, то в своей работе я
опиралась на изучение сетки bootstrap13
Все уровни взаимодействия, тщательно описанные в книге «Веб-дизайн,
ориентированный на пользователя: 5 уровней взаимодействия» будут
полезны для тех, кто активно занимается проектированием web-систем.
Даже наиболее интересный и грамотный контент (информационный,
визуальный) вкупе с инновационными технологиями не смогут помочь
найти баланс между удовлетворением запросов владельца и «юзера», если
не задействовать опыт взаимодействия.
Джесс вывел модель, которая в полной мере раскрывает тему web-дизайна,
ориентированного на пользователя. Это позволяет сосредоточиться на
общих идеях, а не на приемах и инструментарии. 5 уровней — это
13
Перепелица Ф.А. Эффективная разработка веб‐сайтов. Bootstrap. – СПб: Университет ИТМО,
2015.– 71 с. http://books.ifmo.ru/file/pdf/1828.pdf
36
возможность нарисовать цельную картину разработки, начиная с выбора
стратегии и заканчивая дизайном, что позволит спроектировать грамотный
и успешный на выходе опыт взаимодействия.
Принимая во внимание потребности целевой аудитории не стоит забывать
и о многих факторах являющимися общечеловеческими. Например, что
стало особенно актуальным в век информационных технологий , так это
потеря фокуса внимания или прерывания внимания. Очень важный
момент, играющий важную роль в проектировании интерфейса ПО, это
состояние человека, “путешествующего” не только по сайту, но и по сети
интернет в целом. Сформировавшаяся психика взрослого, способного
мыслить последовательно на много шагов вперед, позволяет с легкостью
идентифицировать такие элементы навигации как меню, или
“бургер-меню”.
Детям сложно воспринимать меню и систему навигации. Дети
импульсивны и им достаточно сложно сконцентрироваться по сравнению
со взрослыми. Для детей важно познавать мир с помощью игры. Ребенок
изучает интерфейс играя. Из-за непостоянной концентрации на объекте,
Что касается более взрослой ЦА(студенты, учителя, предприниматели) в
своей деятельности постоянно сталкиваются с прерываниями. Пришедшее
электронное письмо, телефонный звонок – всё это примеры прерывани.В
проектировании пользовательского взаимодействия, нужно постараться
соблюдать ясность и четкость на любом шаге взаимодействия. Это
необходимо в целях повышения продуктивности.
Также в целях ведения пользователя по определенному пути, стоит
помнить о такой “уловке” как ограничение внимания, выделение главного
в интерфейсе, ведь все познается в сравнении. Ограничение принятия
решений или неосознанный выбор взял свою основу такие законы, как
37
закон Хика и закон Фиттса. Говоря о первом законе, утверждение которого
гласит что "время, требуемое для позиционирования на какой-либо
элемент есть функция от расстояния до этого элемента и от его размера".
Ну то есть применительно к интерфейсам - чем больше и ближе объект к
текущему положению мыши, тем быстрее человек сможет на него
щелкнуть14
Закон Хика позволяет количественно определить наблюдение,
заключающееся в том, что чем больше количество вариантов данного типа
вы предоставляете, тем больше времени требуется на выбор.Исходя из
двух указанных законов можно сделать вывод, что лучший способ
повысить доступность кнопки заключается в том, чтобы делать ее большой
и располагать ближе к курсору. В случае с детской координацией
движений, нужно даже больше увеличить кнопку, чтобы не нее было
легче попасть. Из данного утверждения можно сделать вывод, что размер
кнопки может быть бесконечно большим и занимать бесконечно большое
расстояние.
Это делает такие кнопки наиболее доступными для пользователя. Именно
поэтому, например, меню Mac OS многократно эффективней меню
Windows: если в Mac OS меню всегда расположено впритык к верхнему
краю экрана, то в Windows меню отделено от края экрана полосой
заголовка окна программы (Title Bar).15
Следующий аспект, достойный освещения, это сокращение числа
манипуляций. Редизайн современных продуктов зачастую требует
максимального сокращения. Поэтому анализируя существующий
интерфейс или прототип всегда стоит задать себе подобного рода вопросы:
14
http://nordisk.pp.ru/31/
15
http://textarchive.ru/c-1495996-p3.html
38
Действительно ли необходимо второе окно, или же задание можно
выполнить с помощью одного? Действительно ли здесь требуется нажатие
на клавишу? Можно ли выполнить это задание за один шаг, а не за два?16
Чем меньше действий требуется совершить пользователю, тем меньше
вероятность ошибки (при этом пользователь, которого избавили от
рутинной работы, уже радуется). Проиллюстрировать сферу применения
данного метода удобно на примере печати в MS Word. Существует две
команды меню Файл, а именно Печать и Параметры печати. Обе команды
вызывают одноименные диалоговые окна. Проблема заключается в том,
что по закону Хика обилие элементов управления замедляет восприятие
этих окон и увеличивает вероятность ошибки.17 Также нужно учитывать,
что разные люди ведут себя по-разному и взаимодействие с приложениями
должно соотноситься с различными способами мышления разных людей,
обстоятельств. Из-за внешних факторов как вы не можете предсказать, как
именно пользователи будут использовать ваше приложение, нужно
предложить несколько способов для выполнения каждой учебной задачи18
Одно из важных и уже “привычных” аспектов, которые стоит затронуть,
это использование метафор. Например, используя метафору папок для
хранения документов люди могут организовать свои жесткие диски
аналогично тому, как они организуют картотеки. Метафора корзины
помогает удалять ненужную информацию с рабочего стола. Если
https://habrahabr.ru/post/157593
16
17Московский государственный институт электроники и математики (технический университет)Эргономика и юзабилити пользовательского
интерфейса программного обеспечения. Методическое пособие
МИЭМ, каф. ЭВА. Москва,
2004.
http://textarchive.ru/c-1495996-p3.html
18
Сергеев С. Ф. Методы тестирования и оптимизации интерфейсов информационных систем:
учебное пособие. – СПб: НИУ ИТМО, 2013. – 117 с.
39
вспомнить историю, и первый интерфейс Alto Xerox, увидеть все те же
папки и символы документа.
Основы брендинга и айдентики.
В своем исследовании мне хотелось бы коснуться основных понятий
брендинга, айдентики, затронуть понятия формирования целевой
аудитории, дальнейшей разработки логотипа и всего фирменного стиля.
Понятия Бренда
Термин «бренд» пришел из древненорвежского языка. Древние викинги с
помощью глагола «brandr» называли обозначение клейма,
удостоверяющего право собственности на скот и домашнюю утварь.
Современное толкование понятия «бренд» включает все ассоциации
потребителя, возникающие в связи с товаром в результате приобретения
собственного опыта, одобрения общественности и советов окружающих. В
отличие от продуктов бренды не создаются в производстве, они
формируются и существуют в сознании потребителей, обеспечивая
эмоциональную связь между их восприятием и функциональностью
40
продукта. Формирование образа бренда всегда нечто сакральное,
существующее в “умах” команды маркетологов, дизайнеров,
арт-директора, бренд, это то, связывает продукт и чувства,
сгенерированные в команде агентства. Если брендом правильно управлять
можно владеть мнениями и ощущениями потребителей
Бренд – это набор реальных и виртуальных мнений, выраженных в
торговой марке, который, если им правильно управлять, создает влияние и
стоимость. основные способы разработки логотипа.
Появившись на рынке, бренд развивается в течение всего жизненного
цикла, трансформируя сущность торговой марки от совокупности
идентифицирующих элементов (фирменного названия, фирменного знака,
стиля, слогана) до четко воспринятой потребителями ценности как
совокупности функциональных и эмоциональных элементов, единых с
товаром и способом его представления
19
Брендинг – это деятельность по созданию долгосрочного предпочтения к
товару, основанная на совместном усиленном воздействии на потребителя
с помощью элементов брендинга. Товарный знак, упаковка, рекламные
обращения, презентационные мероприятий, система освещений бренла в
социальных сетях, а также других элементов рекламной деятельности.
Данная объединенных определенной идеей и характерным
унифицированным оформлением, выделяющих товар (услугу) среди
конкурентов и создающих его образ (Brand image)20
19 Котлер Ф. Основы маркетинга. Краткий курс: Пер. с англ. – М.: ИД «Вильямс», 2008.
20 Годин А.М., Дмитриев А.А., Бабленков И.Б. Брендинг: учеб. пособие. М., 2004. С. 7-
41
Позиционирование – нахождение места в сознании целевой аудитории и
создание таких образов и атрибутов торговой марки, которые наиболее
выгодно отличались бы от марок конкурентов, являлись для целевого
потребителя значимыми и отвечали его потребностям или
потребительским ожиданиям наилучшим образом. Позиция и философия
бренда должны быть понятными и ясными как для потребителей, так и для
сотрудников вашей компании. Целевая аудитория должна четко
осознавать, чем отличается ваш товар или услуга, и каковы ваши
преимущества перед конкурентами
Также в исследовании вопросов брендинга нужно изучать такой важный а
1. Инсайт - это то, чтоцелевая аудитория больше всего ценит в жизни.
Пример. Если ЦА - это молодые люди, то они больше всего ценят
крутость, продвинутость, а значит нужно, чтобы и бренд тоже был крутым
и продвинутым.
В своем исследовании я изучала такой способ построения бренда как
«Колесо бренда» (Brand-wheel), разработанное британской компанией
Bates Worldwide. (приложение №3)
Система идентификации бренда или фирменный стиль – система образов и
правил, которая соответствует позиционированию бренда и
коммуникационной концепции бренда, всесторонне поддерживает
коммуникационное послание бренда, и эффективно, насколько это
возможно, выделяет его в конкурентной среде целевого рынка.
тента.
Элементы визуальной идентификации
42
Символ бренда – это сильный запоминающийся образ(ключевым здесь
является память), эмоция, элемент, точно воздействующий на
подсознательный уровень потребителей. Миссия символа, которая должна
быть выражена при создании логотипа, фирменного стиля – корректно и
образно донести до целевой аудитории основную суть позиционирования
бренда,обнаружить и определить его из общего графического шума,
построить грамотную коммуникацию между 29 брендом и потребителем,
задействовать фирменный стиль, лого организации для общения и
сообщения
Логотип для крупных компаний является основным коммуникатором
между брендом и потребителем. Логотип является квинтэссенцией
творчества и созданным на мотивационных компонентах, полученных на
базе маркетинговых исследований. Корректно разработанный логотип
способен, при достаточном уровне контактов с целевой аудиторией,
повлиять на имидж продукта или услуги и увеличение объемов продаж
бренда.
21
Торговая марка, зарегистрированная в установленном законом порядке,
становится товарным знаком.В чем разница между ними?Является
юридически защищенным элементом индивидуализации товара. Является
уникальным, но не защищенным юридически элементом
индивидуализации товара.
2 глава
21 Светлана Васильевна Карпова СОВРЕМЕННЫЙ БРЕНДИНГ Монография
43
2.1 Отличительные особенности предмета исследования
В данной главе можно ознакомиться с отличительными особенностями
непосредственно самого продукта для которого разрабатывается
дизайн-продукт. Опираясь на исследования “Кибертеха” на базе кафедры
Матмеха СПбГУ, участвующей в разработке и популяризации проекта
ТРИК.можно обозначить, что использования существующих
робототехнических наборов стало очевидно отсутствие платформы
одновременно простой для использования, достаточно мощной и
относительно недорогой. В доступных наборах зачастую используется
устаревшая электроника. Это не позволяет вузам использовать недорогие
робототехнические наборы для решения современных задач, а в школе
приводит к быстрой потере школьниками интереса к работе с такими
конструкторами (как только в руки попадает современный смартфон).
Слабые вычислительные возможности — не единственный недостаток
опробованных нами популярных конструкторов (LEGO, Fischertechnik,
Vex и еще несколько малоизвестных в России, Европе и США азиатских
вариантов). Например, сборка моделей из простых пластмассовых деталей
приводит у школьников к практически полной потере элементарных
технических навыков конструирования (как отмечают школьные педагоги,
работавшие с такими конструкторами). Проект ТРИК родился от
потребности в новом инструментарии, как результат многолетнего
использования робототехники в школах и вузах для преподавания
различных дисциплин и научных разработок.
Платформа ТРИК, разрабатываемая в рамках проекта, имеет три основных
направления развития.
44
Мощный контроллер собственной разработки (а не копия какого-то
зарубежного продукта), не имеющий аналогов на мировом рынке.
Контроллер позволяет подключать практически все доступные в магазинах
электроники моторы и датчики и обеспечивает достаточную
вычислительную мощность для многих современных задач.
Среда программирования, позволяющая собирать программы из картинок
(пиктограмм), проводить виртуальные эксперименты (имитационное
моделирование) и программировать контроллер. Для образовательных
целей в среде программирования предусмотрен поэтапный переход к
текстовому программированию. Планируется реализация инструментария,
достаточного для подготовки к ЕГЭ. Среда является свободно
распространяемым ПО.
2.2 Анализ логотипов и фирменных стилей аналогичных
кибернетическому конструктору ТРИК. В данной главе я анализирую
аналогичные элементы фирменного стиля у схожих по своим функциям и
целям кибернетическим конструкторам. Опираясь на сравнительную
таблицу можно заключить, что в образах конструкторов присутствует
некая техногенность. Например, Lego mindstorms позиционируют свой
продукт, как игрушку, развлекательное, не слишком серьезное занятие.
45
Фишертехник же например позиционирует себя в первую очередь как
традиционный, классический продукт, в образе логотипа чувствуются
преемственность поколений, дань традициям. В логотипе корейского
бренда читается технологичность, развитие будущего, некая
унифицированность, обезличенность.
Вывод: чтобы выделиться среди конкурентов, нужно в первую очередь
отличаться от них своим позиционированием, а следовательно и
айдентикой. Заходя вперед, хочется сказать, что в своей работе я старалась
не подражать ни одному образу конкурентов, дабы сохранить
индивидуальность.
2.3 анализ существующего фирменного стиля и позиционирования
кибернетического конструктора ТРИК. Опираясь на общение с заказчиком,
мне удалось выяснить, что в данный логотип не было заложено особенной
идеи и концепции. Он просто был набран общепринятым шрифтом и не
несет никакой смысловой нагрузки. Логотип несет в себе
жизнерадостность и положительные эмоции, что и должен делать логотип,
ориентированный на детскую аудиторию, а также на аудиторию гиков, о
которой поговорим позже. Данный логотип не является носителе некого
“ключа” с помощью которого развивался бы фирменный стиль продукта.
Логотип Trik Studio несет в себе отсылку к технологиям, но он устарел графически и
смотрится не гармонично
46
2.4 Анализ интерфейсов с высоким уровнем юзабилити.
В данной части моего исследования мне бы хотелось затронуть тему
юзабилити и проектирования интерфейсов с точки зрения современных
тенденций.Примеры ресурсов с высоким юзабилити помогут установить
определенный уровень и ориентир в данном проекте. Для того чтобы
лучше понять суть юзабилити, а также вдохновиться перед самим
процессом проектирования сайтов я , предлагаем вам взглянуть на
разобранные ниже примеры.
1. Google Play Store
В ходе исследования для меня было важно проанализировать интерфейс
интернет-магазинов. Google Play Store содержит огромное количество
приложений, продуктов(платных и бесплатных), которые можно скачать
прямо с сайта или телефона под управление OS Android. Организация
информации столь масштабного объема требует большого опыта и
мастерства от разработчиков юзабилити интернет магазина. Благодаря
пролистываю и “движению” баннеров приложений в горизонтальном
скроле Дизайн ресурса прост и привлекателен. Экран свободен от лишней
информации, что частично связано с расположенным в его левой части
навигационным меню.(приложение 1 рис 1)
2. Mozilla
Компания Mozilla Corporation — создатель третьего по популярности в
мире бесплатного браузера Mozilla Firefox. Официальный сайт компании
кажется простым и гениальным одновременно. Тенденций стремления к
простоте прослеживается и в данном ресурсе. Выявив основные цели своей
целевой аудитории, Mozilla разместили необходимую им информацию
(сведения о компании и продуктах) прямо на домашней странице. Браузер
47
вы можете скачать тут же. Знать потребности целевой группы всегда
важно и без этих данных не обходится не один крупный “игрок”на рынке
подобного рода компаний. Маркетинговое исследование дает возможность
бизнесу процветать, а пользователям быть счастливыми.
(приложение 1 рис 2)
3. Towfiqi. Этот ресурс реализует готовые дизайнерские решения
(графические макеты страниц) для сайтов на Wordpress, Joomla и других
движках. В Данном дизайне интерфейса прослеживается тенденция
флетового, “ленточного” минимализма, этот сайт является примером
эффективной формулы: чем меньше, тем лучше. Цветовые фоны просто и
лаконично отделяют блоки информации, разграничивая. Цветовое решение
сайта исходит из цветов логотипа, а скругленные края кнопки дает
ассоциацию с его формой . (приложение 1 рис.3)
4. Apple. Элегантный дизайн Apple никогда не разочаровывает своим
юзабилити. Благодаря труду большой команды дизайнеров, эргономика и
ясность для пользователя достойны подражанию. Удобный и
привлекательный интерфейс, единый, унифицированный стиль отсылает
нас к швейцарскому, международному стилю типографики. Подобное
единообразие является одной из причин, почему люди всегда будут
выбирать «айфоны», «айпады» и «макбуки». Самое интересное, на данном
сайте Apple- это отсутствие прокрутки первого экрана. Все, что вам может
понадобиться, “яблочные“ дизайнеры умудрились разместить на одном
экране, без скроллинга, что можно считать ярким примером, достойным
подражания. Лаконичность и простота цветовой гаммы, минимализм, - все
это создает эффект концентрации на продукте. Пользователь запомнит
именно сам продукт. (Приложение 1 рис 4). С точки зрения юзабилити
очень лаконично решена.
48
5. Reebok. Данный сайт является отличным примером интернет-магазина.
Анализируя дизайн карточек товара, можно обратить внимание на
отсутствие лишних линий и деталей. Меню подбора размера моделей
сформировано и скомпонованы в отдельные блоки, обтекаемые по форме и
скруглению. Крупное навигационное меню дает возможность быстро
“путешествовать по сайту”. Что для меня примечательно, так это большое
пространство, отводимое на “воздух” и отступы от края меню,
выпадающих списков.
Высококонверсионный ресурс помогает каждому посетителю лучше
узнать вашу компанию и конкретное предложение. Он способен
формировать позитивное отношение к бренду, вызвать и повысить
осведомленность. Если вы не задумаетесь об этом сегодня, то завтра для
вашего бизнеса может и не наступить.
Обратите внимание, что современные сайты превращаются в целевые
страницы все больше и больше: ясные призывы к действию, контрастные
конверсионные кнопки или лид-формы, четко сформулированные офферы,
простая иерархия графики, много пустого пространства. Этот тренд
стимулируют новые поведенческие паттерны online пользователей: идет
борьба за внимание и конверсию.
Анализируя подборку аналогов от известной петербургской студии “собака
павлова”, разобралась сайты и интерфейсы для детей с точки зрения UX/UI
22
22 http://pavlova.cc/westuxresearch/
49
2.5 Анализ существующей среды программирования ТРИК Studio
В данной части магистерской диссертации мне хотелось бы
проанализировать и предложить свои решения по улучшению работы
программы. Исходя из материала предоставленного командой ТРИК, а
также опираясь на юзабилити тестирование, проводимое в 2015 году, в
котором, принимали участие студенты СПбГУ технических
специальностей, хотелось бы приставить комлексный анализ визуальное
среды программирования Трик Studio.
Выявление взаимосвязей и проблем в проектировании интерфейса одна из
важных задач, предшествующая практической части моей работы. ТРИК –
система визуального программирования роботов, разрабатываемая на
кафедре системного программирования Санкт-Петербургского
государственного университета. Данный софт позволяет создавать
программы для роботов, используя графический символы визуального
языка. воплотить эти программы в жизнь можно прямо в данной
программе, на компьютере,посылая команды роботу USB-интерфейс или
через Bluetooth. Далее я бы хотела описать интерфейс основных разделов
ТРИК studio.
1)Самое кликабельное с точки зрения исследования айтрекинга меню это
палитра.Оно элементов располагается справа под миникартой и содержит
набор доступных элементов для создания диаграмм.
2)Редактор свойств расположен в левом верхнем углу и используется для
редактирования значений свойств выделенного на сцене элемента.
50
3)Список переменных находится слева под редактором свойств и
отображает название и значение всех переменных, используемых во время
исполнения диаграммы.
4)Настройки сенсоров позволяют настроить расположение на портах
контроллера робота .23
Анализируя интерфейс аналогичной среды программирования от
производителя ЛЕГО( LEGO mindstorms) я сделала некоторые выводы в
необходимости редизайна самой структуры. Исходя из проведенных мной
теоретических исследований, можно сделать вывод, что, чем меньше
элементов управления, тем меньше вероятность ошибки. Система может
уменьшить число элементов, если она знает сама, какими именно
параметрами она должна руководствоваться.
Предложения по редизайну.
При запуске программы я бы поменяла, сделала бы скрин, подобный
игровому, чтобы заинтересовать пользователя, а также сделать иконки
более простыми и очевидными для выбора нежели в существующей версии
программы, где элементы выбора находятся на разных уровнях (визуально
23
51
друг под другом)
Эти элементы могут быть на одном уровне важности, а вот недавние
документы можно оставить в левом верхнем углу, потому что в основном,
в процессе обучения, пользователь будет поэтапно обучаться, сохраняя
свой проект и ему будет удобнее возвращаться к моменту прерывания.
Меню свойств разнести с датчиками, чтобы стало намного проще
Первое,что хотелось бы сделать понятным это ввести понятия диаграммы
поведения пользователя, то есть цепочки последовательности действий,
выполняемых роботом. Возможно создать иконку для обозначения
пути-диаграммы24 или упростить названия действия
Если обратиться выбору режима работы (Редактирование и Отладка), то
возникает вопрос по поводу большого свободного пространства под
кнопками перехода, которое можно изменить, увеличив свободное
пространство для сцены. Учитывая закон чтения информации слева
направо, сверху вниз, можно было бы перенести эти кнопки справа вверху.
24https://docs.google.com/presentation/d/1o3--ibuPbI7w7mwYP2RhP9L-49Qy0KQGPwnLrtZmN0c/embed?hl=ru&size=s&slide=id.gc97bf7e4d_0_18
52
Мне видится более удачным, как устроены блоки программы схема
контроллера(рис 6.)
а также мне кажется удобным решение с цветовыми маркерами в панеле
палитра(рис 7.). Данная система лучше скролла в аналогичной палитры
кибернетического конструктора ТРИК. Скролл не замедляет работу и не
дает возможность видеть все юниты одновременного
Каждая диаграмма в Trik Studio представляет собой последовательность
блоков, соединенных связями. Диаграмма начинается блоком «Начало» и
завершается блоком «Конец» (блок «Начало» появляется на сцене по
умолчанию при создании новой диаграммы).
Создание элемента на диаграмме
В программе есть три основных способа создания элемента:
● создание элемента с помощью палитры
● создание элемента с использованием «линкеров»
● создание элемента с помощью жестов мыши.
«Дизайн – это не только то, как выглядит продукт. Дизайн – это то, как он
работает.» — Стив Джобс
Так же основываясь на пользовательском опыте взаимодействия детей с
видеоиграми, мне захотелось привнести персонажа-помощника. Очень
часто подобный опыт использовался в работе со сложными сервисами.
Например, в первоначальном дизайне сайт mailchimp, использовался
персонаж обезьянки-почтальона, посылающего дружелюбные сообщения,
предлагая помощь.
53
Подводя итог аналитической части интерфейса визуальной среды
программирования Trik Studio, можно сделать вывод, что с точки зрения
UX дизайна, программа нуждается в незначительных изменениях. Со
стороны UI дизайна нужно провести более тщательную работу.
3 глава
Третья глава содержит развернутую концепцию дизайн-проекта и
описание алгоритмов, инструментов, технологий, при помощи которых он
был разработан. В третьей главе должен быть представлен сам
дизайн-проект, оценена его практическая значимость и даны указания о
возможности его реализации.
54
3.1 Концепция
Чтобы грамотно продумать концепцию дизайн-продукта, нужно изучить
целевую аудиторию потенциальных пользователей. Дизайн продукт всегда
должен производить определенное впечатление, а задача дизайнера
обеспечить встречу ЦА с нужным ощущением, способным увлечь, повести
за собой. Но для начала, следует рассмотреть сам продукт с точки зрения
применения в реальной жизни.
Кибернетический конструктор ТРИК дает возможность развиваться,
собирая роботов и, программировать и моделировать их поведение, и все
это не потребует помощи программистов и инженеров. Конструктор
позволит вам и вашим детям проектировать разнообразные модели от
простых радиоуправляемых роботов до сложных современных
кибернетических систем. Конструктор ТРИК изначально проектировался
для использования в системе вузовского образования и проведения
НИОКР, но именно мой проект был направлен на создание и
привлекательного образа для более широкой аудитории, учитывая что
разработчики конструктора упростили, сделав доступными существующие
технологии школ и для широкой аудитории разного возраста. Сам проект
может сопровождать пользователя на таком пути как
«школа-колледж-вуз-производство» как в основном, так и в
дополнительном образовании. Это открывает новые возможности
сотрудничества средней и высшей школы в направлении подготовки
инженеров, ИТ-специалистов и других технических специалистов.
Контроллер ТРИК и среда программирования TRIK Studio выполнены на
основе многолетнего опыта университетских разработок и обладают
существенным потенциалом на мировом рынке.
55
Бесплатно распространяемая среда программирования, входящая в состав
конструктора ТРИК, позволяет новичкам быстро освоить
программирование роботов, а профессионалам создавать собственные
предметно-ориентированные визуальные языки. Использование
конструктора ТРИК в образовании
В школе
Конструктор ТРИК предоставляет доступ к сложным современным
технологиям через иконки (пиктограммы), как современные смартфоны.
При этом каждому желающему предоставляются все возможности для
погружения в технологии до любой степени детализации благодаря
открытой программной платформе и свободному ПО, что делает его
одинаково полезным и в школах, и в вузах.
Разработка сложных моделей роботов требует межпредметных знаний и
позволяет развивать широкий спектр навыков и компетенций. Сборка
моделей требует от школьника умения работать с инструкцией, развивает
пространственное мышление, моторику, навыки технического труда.
Программирование поведения робота развивает алгоритмическое
мышление, требует овладения навыками работы с программными
продуктами, а интересные задания мотивируют на изучение основ теории
управления и тригонометрии. Поэтому конструктор ТРИК можно
использовать в качестве учебного пособия на различных школьных
предметах.
Технологии. Сборка моделей по инструкции, разработка дополнительных
металлических, пластмассовых и иных элементов конструкции в рамках
творческих проектов.
56
Информатика и ИКТ. Программирование роботов, изучение
компьютерных технологий в творческих проектах, связанных с
конструированием моделей.
Математика. От простых выражений к формулам с переменными и
тригонометрическим функциям. Наглядная демонстрация “процентов”,
“дробей”, работы с вещественными числами, “углы и градусы”,
“геометрические фигуры и их свойства”. Также можно использовать
основы теории автоматического управления для преподавания понятия
производной (дифференциала) и для объяснения физического смысла
интегрирования.
Черчение (трёхмерное моделирование). пространственное мышление,
развивающееся в процессе обучения дает способность мыслить
различными плоскостями, что облегчит ребенку изучения такого предмета
как черчение и геометрия. Творческий подход при конструировании
подталкивает школьников на изобретение недостающих элементов
конструкций. Современные 3D принтеры, позволяющие быстро
“напечатать” начерченную модель, уже достаточно недороги. Кружки,
ДДЮТ, станции юных техников постепенно обзаводятся фрезерными
станками, 3D принтерами, лазерной резкой. С помощью этих ресурсов
можно решать новые изобретательские задачи и создавать
специализированные решения для соревнований международного уровня.
Физика. Модель робота может использоваться в объяснении таких
физических понятий как сила трения покоя и скольжения, угловые и
линейные скорости. Разбор строения подобного робота может помочь в
более простом объяснении демонстраций рычага и “плеча”. Ускорение
свободного падения и центростремительное ускорение могут быть
продемонстрированы, благодаря встроенному в контроллер акселерометру.
57
Также возможна разработка сложных стендов с использованием
механических приводов и видеонаблюдения за экспериментом с
элементами «дополненной реальности».
В дополнительном образовании
Использование робототехники в школьных предметах в качестве
наглядного пособия делает обучение увлекательным, позволяет закреплять
практическими навыками изученный школьный материал.
Однако гораздо больше возможностей у робототехники в дополнительном
образовании (независимо от возраста обучающихся). Робототехника как
предмет и как набор методических средств сочетает в себе лучшее от
классических кружков моделирования и кружков математики и
программирования, добавляя возможность свободного творчества в новом
увлекательном формате.
К нам обратились несколько педагогов, занимающихся дополнительным
образованием, с предложением попробовать совместно реализовать
несколько необычных творческих проектов. Например, поступило
предложение организовать театральное представление, где робот будет
играть на сцене вместе с людьми отведенную ему роль (двигаться,
“говорить”). Несколько ДДЮТ также вышли с предложением опробовать
ТРИК в рамках своих занятий.
Кроме того, широкие функциональные возможности ТРИК позволяют
организовывать и проводить высокотехнологичные, современные
соревнования, качественно отличающиеся от других на мировой арене.
В вузах
58
В вузах различного технического и естественнонаучного профиля
существует потребность в конструкторе, который можно было бы
использовать и для преподавания, и в исследованиях для
опытно-конструкторских работ. Вузы по достоинству ценят
вычислительные возможности, заложенные в контроллере и его
технический потенциал.
Использование моделей роботов для преподавания программирования и
основ информатики на младших курсах увлекает студентов не меньше
школьников. Наш эксперимент на математико-механическом факультете
СПбГУ только лишний раз доказал эту широко признанную в мировой
практике истину.
Проблемы мотивирования школьников и студентов к изучению
формальных теорий, привлечение молодых кадров в технические
специальности и подобные тревожат не только преподавателей России. С
нами уже вступили в диалог коллеги из Германии и Финляндии, которые
случайно услышали о нашей разработке.
На данный момент к контроллеру ТРИК (для использования в
преподавании и в НИОКР) проявили интерес преподаватели и сотрудники,
в том числе, следующих вузов федерального уровня: НИУ ИТМО, ННГУ,
СВФУ, УрФУ, ДонГУ, КубГУ, СПбГПУ, СПбГУ, ТУСУР, ТГУ(Томск).
В заключение
Конструктор ТРИК позволит не просто модернизировать преподавание
многих предметов и техническое творчество, вдохнув знакомство с
передовыми современными технологиями в образовательный процесс, но и
позволит качественно улучшить подготовку технических специалистов
будущего.
59
Концепция дизайн-продукта
Задачи по редизайну.
Изначально, общаясь с заказчиком, был определен курс на расширении
целевой аудитории, а так же формирования единого образа группы
продуктов ТРИК. Если провести анализ логотипа трик то можно получить
ряд ассоциаций: жизнерадостный,
Логотип на прямую не ассоциировался с робототехникой, конструкторами.
Многие респонденты выдвинули догадку, что этот логотип относится к
брендам
Задачи редизайна
60
Позиционирование бренда
Что нужно было привнести в бренд
В новом логотипе должна читаться идея “хорошо забытого старого”.
Данная часть позиционирования исходила из преемственности поколений
и общей среды распространения конструктора(школы на уроках труда).
Подобная идея возникает при рассмотрении формы элементов самого
конструктора. Элемент ностальгии и истории должен сподвигнуть одно
направление целевой аудитории приобрести этот продукт.
развивающая игрушка, позволяющая почувствовать себя создателем
чего-то нового
Следующим шагом должно быть определение KPI и пути получения
большей прибыли.
Анализ ЦА
Сложность работы с брендом ТРИК заключалась в точном таргетировании
на платежеспособной целевой аудитории. На первый взгляд могло
показаться, что ца продукта это дети(в данной работе мы рассматривали
развитие мышления детей 8-12 лет)
61
Исходя из желания заказчика в расширении целевой аудитории, и
облегчении процесса заказа в будущем, была взята за основу идея создания
интернет магазина.
Целевая аудитория сайта : учителя, родители, неравнодушные родители,
которым важно развитие мышления ребенка, интеллектуалы, Из их сфер
интересов можно выделить: любовь к передаче Что?Где?Когда?, подписка
на журнал “наука и жизнь”, зимние виды спорта,
с техническим образованием, следящими за инновациями, новинками в
сфере гаджетов, но обладающие ясным умом, любящие воспитывать и
проводить время с детьми.
Выгода:
Инсайт ЦА: я-хороший родитель, потому что развиваю своего ребенка.
Они хотят, чтобы их ребенок был именно таким, как они в молодости.
Анализ ретро игрушек и инструкций к нему показал.
Что касается детской целевой аудитории, которая в ходе ребрендинга
должна захотеть купить этот продукт. Эта ЦА является основной,
“движущей силой”
Анализ аккаунтов социальных сетей людей, пользующихся конструктором.
выделить ключевые моменты ЦА и объединить единые пункты,
пересекающиеся в анализе разных ветвей ЦА
62
ЦА больше мужская, поэтому цветовую гамму следует выбирать
сдержанную, лаконичную.Исходя из цвета уже существующего бренда, и
дизайна в целом я выбрала сочетание серого, зеленого, голубого. Цветовая
гамма вместе несет на себе также и концептуальное значение. Синий
цвет-это цвет, взятый из кода программирования.
Бренд-чемпион
Конструктор как нечто навязанное также должен быть чем-то
притягательным и интересным для детей
Логотип
За основу построения логотипа была взятам система самого конструктора,
складывающегося и образующего точки-связи. Буквы построены по сетке
и обладают небольшим масштабированием по вертикали. Данная
пропорция создает ощущение механического, машинного. Буква R словно
собирается в конструктор, создает ощущение движения. Образ,
сложившейся на основе конструктора, создает ощущение технологичности,
промышленного. Скругленные углы букв нужны для смягчения образа в
пользу детской целевой аудитории. Сглаженные формы букв
перекликаются с формой самого конструктора, который напоминает
советский металлический конструктор. Деталь буквицы К и треугольник
являются частью кода. Если более внимательно всмотреться в кодовую
строку, то теги заключены в угловые скобки (>). Также, опираясь на
непосредственное назначение одной из компонент моего продукта (среда
63
программирования Trik Studio) в вариация использования логотипа
предусмотрена версия использования логотипа с обозначенным цветовым
решением, указывающим на подобный тег. И само начертания логотипа,
используемого в среде визуального программирования, дополнено
отличным начертанием от оригинального логотипа.
Иллюстрации
В ходе работы над мудбордом и концепцией в целом пришла идея
создания изометрических иллюстраций. Основываясь на идее реального
трехмерного пространства, в котором существует сам спроектированный
робот, захотелось создать серию иллюстраций, которые потом
использовались бы в печатных изданиях, на сайте, инструкциях.
Построив изометрическую сетку на основе закона об изометрии, я
расположила основные элементы изометрической иллюстрации
контроллера, деталей конструктора, а также элементов программы трик
studio.
Данный вид иллюстрации можно использовать в имиджевых плакатов, для
привлечения
Наклейки
упаковка
В данный момент на производстве и фасовке конструктора используется
промышленная коробка для инструментов. Общаясь с заказчиком, я
пришла к выводу, что можно использовать данный вид упаковки, т.к. это
более практичный способ хранить набор конструктора.
Анимация логотипа может использоваться в презентациях и выставках на
различных конференциях а также при загрузке программы.
64
Методы работы
В ходе работы мной были использованы различные методы работы над
проектом. Одной из самых важных методологий, которую я использовала,
можно считать концепцию, работу над анализом целевой аудитории. Также
большой вклад в работу внесла технология колесо бренда, составление
портрета бренд-чемпиона, выявления его портрета из целевой аудитории.
Входе работы над проектной частью я использовала метод соотнесения
аналогов и сопоставление концепций, аналогичных продуктов, подобной
линейки (робототехнических конструкторов). Очень важной техникой в
работе над дизайн-впечатлением является составлении карты ассоциаций,
соотнесенных с продуктом и целевой аудиторией. Составление мудборда
помогло в поиске образа логотипа, и нужного настроения.
В ходе графической разработке логотипа я использовала сначала эскизное
проектирование. ( с поиском формы можно ознакомиться в приложении 9.)
“бумажное проектирование” играет немаловажную роль в создании
“живого”образа логотипа, его формы, смысла, воплощенного в деталях. В
ходе проектирования я старалась соответствовать заданной тематике и не
стараться огрубить логотип, а привнести в него больше “человечности” и
“доброжелательности”.
В процессе графической прорисовки я использовала программы Adobe
Illustrator. Для прорисовки идеальной формы логотипа я использовала
модульную сетку. Взяла за основу круг, который составляет толщину букв.
В ходе проектирования чистового варианта логотипа я использовала
65
технологию Pixel Perfect. Эта методика необходима в работе, в
особенности в построении логотипов, в частности из геометрических
форм. Она позволяет при масштабировании в веб ресурсах сохранять
“контур” формы ровным и более “четким”.Подобная технология
используется в проектировании веб ресурсов и мобильных приложений25
Само построение логотипа та же происходило по сетке, где форма букв
приближена к квадрату.
В создании сайта я использовала методологию построения 6 уровней
проектирование интерфейса
1)уровень стратегии
Задача по редизайну сайта: соединить интернет магазин и легкий способ
заказа набора с привлечением заинтересованности продуктом детской
аудиторией. Задача в том, чтобы дети захотели, чтобы им купили данный
конструктор. в тоже время задача сайта выделиться среди аналогов, но не
потерять связь с главным концептом,
2)уровень возможностей
Пользовательские возможности.
● Ознакомиться с продуктом, выбрать продукт для более подробного
ознакомления (ссылки в навигационном меню на главной странице
сайта, а также непосредственно главная страница, с ссылками на
подробное описани.
● Выбрать набор
25
Pixel Perfect Precision Monument Valley и ввела понятие Pixel Perfect. cdn.ustwo.com/PPP/PP3.pdf
66
● Заказать набор
● Ознакомиться с новостями в блоге
● Узнать о компании
● Связаться
● Заказать консультацию
● Зарегистрироваться в личном кабинете
3)В уровне структуря я придерживалась древовидной системы
распределения уровней подачи страниц. подобная система универсальна и
подходит для создания практически любых типов сайтов. Находясь на
главной странице, пользователь может выбирать на что переходить
дальше. После перехода в нужный раздел, он подбирает необходимый
подраздел и т.п. У древовидной структуры очень много достоинств, но так
же есть и недостаток. Приложение 11
В данном приложении можно рассмотреть древовидную структуру
сайта-интернет магазина.
С главной странице по навигационному меню пользователь может перейти
на страницу конструктора, контроллера и ПО, также пользователь может
перейти на страницу магазина и заказать выбранный набор также детали к
нему, далее в меню пользователь может прочесть про доставку и способы
оплаты, а также про контакты
4)Уровень компоновки
уровень компоновки включает в себя прототипирования основных
элементов интерфейса.
67
В данной части своего проекта я изучала программу для прототипирования
Axure. создала прототип переходов страниц.
5)Уровень поверхности. На данном этапе я выбирала внешние атрибуты
дизайна сайта.
Сетка.
В проектировании дизайна интерфейса очень важна сетка, как и в
графическом дизайне, в верстке печатных изданий. За основу в разработке
дизайна сайта-магазина я взяла сетку bootstrap26 . Ее особенность и
удобство в том, что позволяет дизайнерам и верстальщикам создавать
адаптивность сайт с большим процентом соответствия макетов и верстке.
В адаптивном дизайне нужно сохранять структуру макета и аккуратность
подачи информации для всех разрешений, поэтому макеты следует делать
для всех контрольных точек. При этом колонки сетки остаются
статичными и добавляются по мере увеличения ширины экрана, а
элементы меняют свое положение, подчиняясь колоночному ритму и
точкам перехода,breakpoints. За таковые можно принять 640, 768, 960,
1024, 1280 и 1440. И для каждого разрешения экрана соответственно будет
разное количество колонок.
27
Типографика. Существует мнение, что 95% процентов дизайна сайта
состоит из типографики. Я использовала шрифт он удобочитаем за счет
кернинга. Размер заголовков и схема ведения соотношений графических
элементов представлена в приложении 12
Основываясь на книге Горбунова
26
Мастер-класс по построению Bootstrap
http://webdesign-master.ru/blog/tools/2016-11-26-bootstrap-psd.html
27
Блог Rambler
68
Цветовое решение. основываясь на современных трендах построения
цветовых решений28 . Градиент и яркие цвета, цветные тени, закругленные
края - все это мировые тенденции в дизайне интерфейсов. Основываясь на
мудбордах, целевой аудиории, а также концепции цветового решения
логотипа, я выбрала цвета и определенные элементы UI. Подробнее данное
решение можно рассмотреть в приложение 13. Данный UI-kit должен
находить тонкую грань между “детскостью” целевой аудитории и
рациональной подачей информации.
В разработке дизайна интерфейса среды визуального программирования
Trik Studio очень важны Базовые инструменты UI
В процесс проектирования нужно всегда помнить что, кнопка - это
действие, ссылка -это навигация. Селекторы - выбор нескольких вариантов
(квадратики), а радиобатоны - выбор взаимоисключающих вариантов
(кружочки).29
Возможная реализация дизайн-проекта
Что касается реализации, то она возможна, на уровне сотрудничества по
проектированию новой визуальной среды программирования Трик Studio.
28
https://medium.muz.li/color-trend-2016-2017-c40e34f08f2c
29
https://www.youtube.com/watch?v=3z1Vza0YkmI
69
Потому что именно она является самым проблемным участком в проекте
на данном этапе существования самого проекта ТРИК.
Перспективы развития проекта большие, т.к. данный бренд должен
привнести в будущее развитие компании большее заинтересованность
целевой аудитории, а следовательно больший капитал для развития.
Уже по инициативе преподавателей 6 школ начаты образовательные
эксперименты по использованию решений ООО «КиберТех», при этом не
только в Санкт-Петербурге, но даже в Ростове, Самаре и Екатеринбурге.
Преподаватели крупных федеральных вузов (СПбГПУ, СПб НИУ ИТМО,
СПбГУ, КГТУ, КубГУ, УрФУ, ЛГУ им.Пушкина, СВФУ, К(П)ФУ, ИрГТУ
и др.) также проявили интерес к ТРИКу и выразили готовность
участвовать в образовательных экспериментах. Проект вызвал интерес и у
представителей европейских вузов.
Организаторы четырех различных всероссийских крупных
робототехнических соревнований и фестивалей высказали
заинтересованность в использовании платформы ТРИК для организации
оригинальных национальных соревнований.
Конструктор ТРИК и среда программирования может стать основой для
возрождения системы секций и кружков технического творчества,
добавляя самые современные технологии к лучшим традициям советской
школы.
Бренд, разработанный мной должен стать интересным и понятным для
большого круга ЦА, в чем и заключалась сложность разработки
концепции.
Многочисленные прогнозы развития отрасли информационных технологий
в перспективе 10-15 лет указывают на взрывной рост сегмента
70
робототехники. При этом речь идет не столько о специальной и
промышленной робототехнике, сколько о персональной и сервисной —
роботы в быту, вокруг нас. Поэтому мое участие в разработке брендинга и
дальнейшем сотрудничестве с командой ТРИК, может послужить
хорошую службу развитию самого проекта как на российском рынке, так и
на зарубежном. Преследуя стратегические цели, правительства многих
государств (США, Германия, Южная Корея, Япония, Израиль, Иран и
других) вкладывают средства в подготовку специалистов будущего через
финансирование соответствующих образовательных программ и
исследований.
Кроме того, использование робототехники в образовании позволяет
противостоять мощной современной индустрии развлекательных гаджетов.
Для школьников и студентов робототехника является наглядным и
увлекательным(!) способом изучения механики, математики, кибернетики
(теории управления), программирования, технологии и даже физики.
Поэтому использование элементов робототехники в образовании —
набирающая обороты мировая тенденция, известная как “STEM Robotics”.
Опираясь на анализ фирменных стилей и брендов, подобных
конструкторов, можно сделать вывод, что концепция ТРИК выделяется на
фоне остальных в силу своего “дружелюбия”, идеи развития начиная с
детского возраста, обучаясь на уровне взрослого, быть не как все
остальные дети.
Из нашего опыта использования существующих робототехнических
наборов стало очевидно отсутствие платформы одновременно простой для
использования, достаточно мощной и относительно недорогой. В
доступных наборах зачастую используется устаревшая электроника. Это не
позволяет вузам использовать недорогие робототехнические наборы для
71
решения современных задач, а в школе приводит к быстрой потере
школьниками интереса к работе с такими конструкторами (как только в
руки попадает современный смартфон).
Российская ассоциация образовательной робототехники и «Иннополис»
подтвердили готовность адаптировать свои методики под ТРИК.
Также 5 инициативных учителей из разных школ подтвердили желание
разрабатывать учебные программы на основе технологий ООО
«КиберТех» и приступили к реализации.
Простота и удобство сборки моделей и программирования делают
конструктор ТРИК доступным даже для младшей школы. Использование
сложных математических алгоритмов, например, определения лица
человека, распознавания голосовых команд и пр., происходит с помощью
готовых пиктограмм среды программирования.
Поэтом обновленный дизайн программного обеспечения, ставшего более
понятным и простым, поможет разбираться в сложном процессе
программирования многим группам целевой аудитории.
Для старшеклассников и студентов предусмотрен переход от графического
представления алгоритма к традиционному тексту программы.
72
6. Заключение
В заключение своей магистерской работы можно сказать, что данная
работа может считаться удачно выполненной. В соответствии с
концепцией, были созданы соответствующие графические решения.
Данная работа опирается на глубокие теоретические исследования образа
мышления детей, а они соответственно являются основной целевой
аудиторией продукта(кибернетического конструктора ТРИК).
Также мое исследование затрагивает такой редкий вопрос как юзабилити и
пользовательское поведение на веб-ресурсах. Данный вопрос редко
затрагивался у юзабилити исследователей в нашей стране. После
внедрения моего нового дизайна в среду программного обеспечения я
планирую провести исследование среди школьников 8-12 лет,
пользующихся данным конструктором и средой программирования ТРИК
Studio.
Данная практика оказалась чрезвычайно полезной для моего
формирования как будущего специалиста в области графического и
дизайна пользовательского взаимодействия.
На мою работу оказали большое влияние работы .В ходе работы
73
Заключение представляет собой подведение итогов работы. Объем не
должен превышать 2,5 страниц.
74
Приложение 1
(рисунок 1)
75
(рисунок 2)
(рисунок 3)
(рисунок 4)
(рисунок 5)
76
названия
позиционирован
ие
интерфейс
логотип
среды
программирования
(если имеется)
80
LEGO (Mindstorm
образ
RCX, NXT, EV3,Tetrix, “компьютерной
Matrix)
игры”
Fischertechnik
Бренд с богатой
http://pacpac.ru/pro
историей,
duct/pkp-04001-txt-
пластмассовый
combo-2-in-1/
развивающий
конструктордля
детей,
подростков и
студентов,
изобретенный
профессором
Артуром
Фишером[1]в
1964 году[2].
Обучение через
игру
Vex (Vex IQ,Vex PRO)
Spark a curious
https://www.vexrob
mind before they
otics.com/vexiq
decide that
engineering "isn't
cool"."Drive
Forward" is the
81
new "Hello
World".
BIOLOID
набор для
создания робота
,
производимый
корейской
фирмой Robotis
1.Логотипы
82
Название
автор
ссылка на
логотип, знак
сайт(если есть)
Lundén Architecture
Company
Tsto
http://www.tsto.or
g/
Favorite Website
https://thefwa.co
Awards
m/awards
Стиль Roger
Burkhard
творческой
студии
веб-разраб
https://www.lundgrenli
отки,
ndqvist.se/
основанной
в Берне,
Швейцария
#брендинг_pll
sll #брендинг
83
логотип Uber
Трэвис Каланик
https://www.beha
nce.net/uber_desi
gn
https://www.beha
nce.net/gallery/44
248007/Uber-Reb
rand-Logotype
https://www.beha
nce.net/gallery/46
997743/QuoteChe
f-Price-calculatio
n-widget
84
Letter S
reg Anthony
Thomason
Dec 18,
2014
BTA – Architecture
studio Branding by
Griselda Marti
Fivestar Branding http://fivestarlogo
Agency
Bradenton, Fl
.com/bta-architect
ure-studio-brandi
ng-by-griselda-m
34207
arti/
United States
86
Logo and Identity for
MIT Media Lab
Pentagram
https://pinthemall.
net/pin/56859cfa8
1007/
87
Graphéine
https://www.beha https://www.beha
nce.net/gallery/31 nce.net/gallery/31
Braindo
658551/Educatio
658551/Education
n-Brand-Design
-Brand-Design
http://hoagency.r
http://hoagency.ru
u/
/work/braindo/
http://www.penta
https://www.beha
gram.com/
nce.net/gallery/45
271101/OpenVie
w-Identity-system
88
История
https://ru.pinterest
ребрендинга
.com/pin/3533919
логотипов
01994923633/
UBER Analytics
http://www.awsm https://www.beha
Platform
d.com/
nce.net/gallery/48
006735/UBER-A
nalytics-Platform
89
История
Uber Design
ребрендинга для
Uber
GS Group —
VolgaVolga
http://volga-volga
мультиотраслев
.com/portfolio/30
ой частный
1
международный
высокотехнолог
ичный холдинг с
российскими
корнями.
Редизайн
Рекламное
https://docs.googl
фирменного
агентство Энди
e.com/document/
стиля ИТМО
d/1S9Ow0tK8SA
gdDmJdRvONhZ
c6EgXKBSXQc5
2QXMuQh2E/edi
t#
Четвертый
Nimax
https://www.beha
образовательны
nce.net/gallery/45
й проект Mail.Ru
206167/Technopo
Group для
lis
студентов
90
технических
вузов.
Айдентика
Fida Kuchukbaeva
Музея
https://vk.com/pll
sll
механики -
студенческ
ий проект
Portfolio WIP
Alex Torres
https://dribbble.co
m/shots/3228149Portfolio-WIP
тренды
https://medium.m
цветовых
uz.li/color-trend-2
сочетаний 2017
016-2017-c40e34
f08f2c?gi=ffea27
1d1c4a#.sgnhpgd
2v
Иконки
91
https://nucleoapp.com/?ref=freebiesbug&utm_source=freebiesbug&utm_mediu
m=topbanner&utm_campaign=freebiesbug
Приложение №5, рисунок№1.
Рисунок №2
92
Библиография
приложение №6
93
Раздел 1. Книги по Web - дизайну
1. «Веб-дизайн. Книга Джесса Гарретта Элементы опыта
взаимодействия», Джесс Гарретт
2. «Веб-дизайн. Книга Дмитрия Кирсанова», Дмитрий Кирсанов
3. «Веб-дизайн. Книга Келли Гото», Келли Гото и Эмили Котлер
4. «Веб-Дизайн. Книга Стива Круга или "Не заставляйте меня
думать!"», Стив Круг
5. «Веб-дизайн. Книга Якоба Нильсена», Якоб Нильсен
6. «Сетки. Креативные решения для графических дизайнеров»
7. «Большая книга веб-дизайна», Терри Фельке-Моррис
8. Влад В. Головач «Дизайн пользовательского интерфейса 2» Искусство
мыть слона http://www.usethics.ru, deus@exmachina.ru Версия 2.11,
обновление от 20.5.2010
http://books.ifmo.ru/file/pdf/1363.pdf
http://books.ifmo.ru/file/pdf/1828.pdf
Раздел 2 . Разработка мобильных приложения для различных платформ
1. «Привет, Android! Разработка мобильных приложений»
2. «Программирование для мобильных устройств на iOS»
3. «Разработка игр для iPhone и iPad», Тодд Мур, 2013
94
4. «The App and Mobile Case Study Book», Rob Ford, Джулиус
Вейдманн, 2011
Раздел 3. Книги по юзабилити
1.
«Дизайн привычных вещей» Дональд Норман, 2006
2.
«Психбольница в руках пациентов» Алан Купер, 2009
3.
«Измерение пользовательского опыта» ('Measuring User Experience')
Томас Таллис, 2016
4.
«Практическое руководство по измерению пользовательского
опыта» ('A Practical Guide to Measuring Usability') Р. Дж. Торрес, 2002
5.
«Исследование Джона Гулда и Клейтона Льюиса под названием
«Дизайн для юзабилити, мнение дизайнеров» ('Designing for Usability and
What Designers Think')
6.
«Практическое руководство по тестированию юзабилити» ('A
Practical Guide to Usability Testing', Joseph S. Dumas, 1999
7.
«Ководство» Артемий Лебедев, проект существует с 1997,
изменяется по наши дни
8.
«UX-дизайн. Практическое руководство по проектированию
опыта»…Расс Унгер, Кэролайн Чендлер. 2011.Издательство:
«Символ-Плюс»
9.
«This Is Service Design Thinking: Basics, Tools, Cases», SBN:
906369279XГод издания: 201210. «Информационная архитектура в
Интернете»,Питер Морвиль, Луис Розенфельд, 2010
95
11. «Сторителлинг в проектировании интерфейсов. Как создавать истории,
улучшающие дизайн», Уитни Кесенбери, Кевин Брокс, 2013
12. Mobile Usability. Как создавать идеально удобные приложения для
мобильных устройств, Якоб Нильсен, Ралука Будиу, 2013
13. Мобильная разработка. Галерея шаблонов, Тереза Нейл, 2013
14. jQuery Mobile. Разработка приложений для смартфонов и планшетов,
Максимилиано Фиртман, 2013
15. «Четыре способа для начала изучения пользовательского опыта»
Патрика Нимана (Patrick Neeman). 2010
16. «Тайны дизайна интерфейсов» Ценнид Боулес и Джеймс Бокс, 2011
17. UX-дизайн. Идея - эскиз - воплощение, С. Гринберг, Ш. Карпендэйл,
2014
Раздел 4. Программирование и верстка
1. «CSS для веб-дизайнеров» , Кит Джереми, 2013
2. JavaScript — Подробное руководство Флэнаган - JavaScript Подробное руководство 6-ое издание, 2014
3. «Типографика Шрифт, верстка, дизайн 3-е издание», Феличи 2010
4. «HTML5 CSS3 - разработка сайтов для любых браузеров и
устройств», Фрейн, 2012
5. «Об интерфейсе» - Основы проектирования, Алан Купер 2014
96
6. «Книга по верстке для тех, кто не умеет верстать» Робин
Уильямс,2011
7. «HTML5 для веб-дизайнеров», Кит Джереми, 2013
Раздел 5. Типографика
1. «Гражданский шрифт и кириллический «Киш»», Владимир Ефимов
2. «Типографика в терминах и образах», Владимир Кричевский
3. «Искусство шрифта», Соломон Телингатер
4. Эмиль Рудер. Типографика
5. Учебник «Типографика и вёрстка» Артёма горбунова
6. (http://artgorbunov.ru/bb/soviet/20140519/)
7. «Типографика: шрифт, верстка, дизайн», Дж. Феличи, 2-е издание,
2014
8. Новая типографика. Руководство для современного дизайнера, Ян
Чихольд, 2012
Раздел 7. Книги по созданию логотипов
1. Майкл Эвами — Logo. Создание логотипов. Самые современные
разработки
2. Иоханнес Иттен — Искусство цвета
97
3. «Логотип и фирменный стиль. Руководство дизайнера», Автор:
Дэвид Эйри, 2005
4. «Знаки в Графическом дизайне», Автор: Победин В.А.
5. «Логотип» Автор: Бенуа Эльбрюнн
Раздел 8. Общие книги по дизайну
1. «Взлом креатива. Как увидеть то, что не видят другие», Майкл
Микалко
2. «Цвет в дизайне. Мастер-класс», Том Фрейзер, Адам Бэнкс
3. «Думай как дизайнер», Жанна Лидтка и Тим Огилви
4.
«Руководство графического дизайнера для работы с клиентами»
Армин Хоффман, 2001
5.
«Дизайнер говорит: цитаты, остроты, слова мудрости», Сара Бейдер,
2003
6. «Дизайн.Форма и хаос», Пол Рэнд
7.
«Воплощение идей», Скотт Белски
1. Твори целый день, Лиза Конгдон, 2010
2. Дизайн — это работа, Майк Монтейро, 2013
3. Отзывчивый веб-дизайн, Итан Маркотт, 2012
4. Эволюция дизайна. От теории к практике, Тимоти Самара
5. Тайные знания коммерческих иллюстраторов, Яна Франк,2010
98
6. Гармония линий: Законы пропорции и совершенства, Дьёрдь Доци,
2009
7. Гармония цвета: Полное руководство по созданию цветовых
комбинаций – Т. Саттон, Б. Вилен.ISBN 5-17-027219-7 ISBN
5-271-10361-7 ISBN 1-59253-031-1
8. Универсальные методы дизайна - Мартин Б., Хантингтон Б., 2014
9. Дизайн. Разработка проектов. Разбуди свое вдохновение! Джессика
Глейзер, Кэролин Найт, 2014
10.100 главных принципов дизайна. Как удержать внимание, Сьюзан
Уэйншенк, 2015
11.Модульные системы в графическом дизайне. Пособие для графиков,
типографов и оформителей выставок, Йозеф Мюллер-Брокманн,
2014
12.Инфографика. Самые интересные данные в графическом
представлении, Дэвид Маккэндлесс, 2013
13.Дизайн XXI века, Под редакцией Шарлотты, Питера Фиелл, 2008 г.
14.
15.
16.
Раздел 10. Книги по философии и современной культуре
1. Максимальная концентрация Как сохранить эффективность в эпоху
клипового мышления Люси Джо Палладино
2. Дизайн-код. Культура креатива, Галина Лола, 2011
99
3. Цифровое компьютерное искусство, С. Ерохин, 2011
4. Практика глобализации: игры и правила новой эпохи. М.: Инфра-М,
2000. - 344 с.
5. «Хэгерти о креативности. Здесь нет правил», Hegarty on Creativity:
There Are No Rules, 2016, Джон Хегарти
6. Искусство влиять и побеждать. 10 универсальных техник убеждения,
которые помогут вам в бизнесе и не только, 2015
7.
8.
7.
Сорокина, В. Н. Массовые коммуникации и массовая культура /
133. B. Н. Сорокина // Массовые коммуникации и массовая культура.
Российская массовая культура конца XX века: материалы круглого стола, 4
декабря 2001 г., г. Санкт-Петербург. СПб., 2001. - С. 160-163.
Раздел 11. Маркетинг и реклама
1. «Реклама. Игра на эмоциях», Алексей Иванов
2. «Как придумать идею, если вы не Огилви», Иванов Алексей
3. «Мобильный маркетинг. Как зарядить свой бизнес в мобильном
мире»
4. Леонид Бугаев, 2012
5. Империя приложений. Как создавать приложения-хиты, Чед Мурета,
2013
100
6. . Котлер Ф. Маркетинг менеджмент/ Ф. Котлер, - СПб: Питер, 1999.
7. Имери В. Как сделать бизнес в Internet/ В. Имери. - Киев:
Издательство "Диалектика", 1998.
8. Барткевич, Е. Баннер умер. Да здравствует баннер! / Е. Барткевич //
Мой Интернет. — 2008. — №8. С. 52-53.
9. Бест, Р. Маркетинг от потребителя / Р. Бест. М.: Манн, Иванов и
Фербер, 2008. - 760 с.
10. Галицкий, Е. Б. Чем отличаются пользователи Интернета от прочих
россиян? / Е. Б. Галицкий, А. В. Сидорова // Интернет-маркетинг. —
2007. -№3. С. 130-140.
11.Кравченко, Д. В. Свежий взгляд на надоевшие вопросы Электронный
ресурс. / Д. В. Кравченко. — Режим доступа:
http://www.webplanet.rU/news/opinion/2005/3/l/look.html (10.03.2009).
12.Лебедев-Любимов, А. П. Психология рекламы / А. П.
Лебедев-Любимов. 2-е изд. - СПб.: Питер, 2007. - 384 с.
13.Оптимизация сайтов под поисковые системы (SEO) Электронный
ресурс |. Режим доступа: http://www.webprojects.ru/services/promo/seo/
(10.03.2009).
14.Pinterest для бизнеса. Как привлечь целевой трафик из самой
быстрорастущей социальной сети в мире, Бет Хайден, 2013
15.Маркетинг в социальных сетях, Дамир Халилов, 2013
Раздел 12 Прототипирование
101
1. «Прототипирование. Практическое руководство»,Тодд Варфел, 2013
2. «Сначала мобильные!» Люк Вроблевски, 2012
3. Самоучитель по АXURE Mobile Prototyping with Axure 7 ISBN:
9781849695145. Packt Publishing
4. Основы контентной стратегии, Эрин Киссейн, 2012
Интернет ресурсы.
1. Современные тренды Статья http://www.cossa.ru/155/109171/
2. "Web Design Books of Trends 2015-2016" от компании UXPin. Книга
онлайн
3. Ссылка Тренды в анимации взаимодействий мобильных устройств и
пользователей:
https://freelance.today/trendy/7-tipov-animacii-v-mobilnyh-prilozheniyah.html
1. Правила проектирования МП для IOS
https://developer.apple.com/design/tips/
2. Правила проектирования для МП для Android
https://freelance.today/trendy/7-tipov-animacii-v-mobilnyh-prilozheniyah.
html
3. Самоучитель по верстке для новичков CodeAcademy
https://www.codecademy.com/
4. Онлайн самоучитель по версткеhttp://htmlbook.ru/
102
Отзывы:
Авторизуйтесь, чтобы оставить отзыв