<?xml version="1.0"?>
<!DOCTYPE article
PUBLIC "-//NLM//DTD JATS (Z39.96) Journal Publishing DTD v1.4 20190208//EN"
       "JATS-journalpublishing1.dtd">
<article xmlns:mml="http://www.w3.org/1998/Math/MathML" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" article-type="research-article" dtd-version="1.4" xml:lang="en">
 <front>
  <journal-meta>
   <journal-id journal-id-type="publisher-id">National Security and Strategic Planning</journal-id>
   <journal-title-group>
    <journal-title xml:lang="en">National Security and Strategic Planning</journal-title>
    <trans-title-group xml:lang="ru">
     <trans-title>Национальная безопасность и стратегическое планирование</trans-title>
    </trans-title-group>
   </journal-title-group>
   <issn publication-format="print">2307-1400</issn>
  </journal-meta>
  <article-meta>
   <article-id pub-id-type="publisher-id">36136</article-id>
   <article-categories>
    <subj-group subj-group-type="toc-heading" xml:lang="ru">
     <subject>НАУКА, ИННОВАЦИИ И ОБРАЗОВАНИЕ</subject>
    </subj-group>
    <subj-group subj-group-type="toc-heading" xml:lang="en">
     <subject>SCIENCE, INNOVATION AND EDUCATION</subject>
    </subj-group>
    <subj-group>
     <subject>НАУКА, ИННОВАЦИИ И ОБРАЗОВАНИЕ</subject>
    </subj-group>
   </article-categories>
   <title-group>
    <article-title xml:lang="en">The analysis of methods of visualization of prototypes in design of web interfaces of information and education internet resources</article-title>
    <trans-title-group xml:lang="ru">
     <trans-title>Анализ методов визуализации прототипов в проектировании веб-интерфейсов информационно-образовательных интернет-ресурсов</trans-title>
    </trans-title-group>
   </title-group>
   <contrib-group content-type="authors">
    <contrib contrib-type="author">
     <contrib-id contrib-id-type="orcid">https://orcid.org/0000-0002-3573-785X</contrib-id>
     <name-alternatives>
      <name xml:lang="ru">
       <surname>Кузьмина</surname>
       <given-names>Татьяна Анатольевна</given-names>
      </name>
      <name xml:lang="en">
       <surname>Kuzmina</surname>
       <given-names>Tatyana A.</given-names>
      </name>
     </name-alternatives>
     <email>kuzmina@igps.ru</email>
     <bio xml:lang="ru">
      <p>кандидат педагогических наук;</p>
     </bio>
     <bio xml:lang="en">
      <p>candidate of pedagogical sciences;</p>
     </bio>
     <xref ref-type="aff" rid="aff-1"/>
    </contrib>
   </contrib-group>
   <aff-alternatives id="aff-1">
    <aff>
     <institution xml:lang="ru">Санкт-Петербургский университет ГПС МЧС России</institution>
     <city>Санкт-Петербург</city>
     <country>Россия</country>
    </aff>
    <aff>
     <institution xml:lang="en">Saint-Petersburg university of State fire service of EMERCOM of Russia</institution>
     <city>Saint-Petersburg</city>
     <country>Russian Federation</country>
    </aff>
   </aff-alternatives>
   <volume>2019</volume>
   <issue>2</issue>
   <fpage>105</fpage>
   <lpage>109</lpage>
   <self-uri xlink:href="https://futurepubl.ru/en/nauka/article/36136/view">https://futurepubl.ru/en/nauka/article/36136/view</self-uri>
   <abstract xml:lang="ru">
    <p>Проанализирована общая статистика юзабилити в контексте проектирования оптимального веб-интерфейса. Рассмотрены методы прототипирования интерфейсов информационно-образовательных интернет-ресурсов.</p>
   </abstract>
   <trans-abstract xml:lang="en">
    <p>The general statistics of a usability in the context of design of the optimum web interface is analysed. Methods of prototyping of interfaces of information and education Internet resources are considered.</p>
   </trans-abstract>
   <kwd-group xml:lang="ru">
    <kwd>веб-дизайн</kwd>
    <kwd>интерактивный прототип</kwd>
    <kwd>прототипирование</kwd>
    <kwd>разработка веб-сайтов</kwd>
    <kwd>веб-интерфейс</kwd>
   </kwd-group>
   <kwd-group xml:lang="en">
    <kwd>web-design</kwd>
    <kwd>interactive prototype</kwd>
    <kwd>prototyping</kwd>
    <kwd>development of websites</kwd>
    <kwd>web interface</kwd>
   </kwd-group>
  </article-meta>
 </front>
 <body>
  <p>Ускоряющаяся разработка веб-технологий (от англ. web - «паутина», интернет-пространство) и средств компьютерной графики способна демотивировать потенциальных пользователей изучать и использовать усложненные веб-инструменты, что может привести к технологической десинхронизации, которой возможно избежать, следуя так называемому «принципу выравнивания», то есть своевременной и максимальной модернизации обучения и информирования, сообразуясь со скоростью развития веб-инструментов информационно-образовательных интернет-ресурсов. На сегодняшний день существует большое количество разнообразных веб-интерфейсов (от англ. interface - совокупность средств взаимодействия между элементами системы) [1]: интерфейс «машина-машина», служащий для взаимодействия машин с машинами; интерфейс «машина-инфраструктура», служащий для взаимодействия машин с инфраструктурой внешней среды (пример реализации - интеллектуальные транспортные сети); интерфейс «машина-природа», служащий для взаимодействия машин с природой (пример реализации - «умный дом»); интерфейс «человек-я», служащий для взаимодействия человека с самим собой (пример реализации - умные часы, мобильные гаджеты); интерфейс «человек-тело», служащий для взаимодействия человека с собственным телом (пример реализации - удаленный мониторинг и контроль здоровья через интернет); интерфейс человек-человек», служащий для взаимодействия человека с человеком (пример реализации - мобильные гаджеты как средство мгновенного удаленного соединения между людьми, реализация «коллективного разума»); интерфейс «человек-машина», служащий для взаимодействия человека с машинами. Понятие веб-интерфейса, в части, касающейся взаимодействия человека и машины-компьютера, тесно связано с понятием юзабилити (от англ. usability - удобство и простота использования), то есть простотой, удобством, интуитивным пониманием. Проанализировать юзабилити интернет-сайта для общей оценки поведения пользователей и для эффективной разработки/усовершенствования веб-интерфейса можно с помощью сервисов системной веб-аналитики, в России крупнейшим интернет-сервисом в данной области является «Яндекс.Метрика» [2]. В рамках анализа юзабилити рассматривается: статистика посещений пользователей с периодами прироста новых посетителей, целевой аудитории; отказы, непродолжительные просмотры или визиты; время и глубина просмотров веб-страниц, кликабельность активных веб-ссылок и элементов веб-интерфейса. Так называемая термическая карта интернетсайта, карта ссылок и кликов, иллюстрирует ссылки и элементы веб-интерфейса, которые оказываются в зоне наибольшего внимания пользователей. Эти данные помогают понять веб-разработчикам, насколько удобен интернет-сайт для посетителей, и используются для дальнейшего совершенствования веб-интерфейса. К примеру, согласно данным сервиса «Яндекс- Метрика» у посетителей официального интернетсайта Санкт-Петербургского университета ГПС МЧС России 5 приоритетных целей посещения (рис. 1, 2): вход в личный кабинет; просмотр контактов университета; информация о бюджетной форме обучения; чтение новостей университета; информация об обучении на договорной основе. В общем случае проектирование пользовательского веб-интерфейса может быть представлено в виде условного алгоритма (рис. 3). С точки зрения веб-дизайна протипами являются эскизы веб-страниц или документы с HTML/XHTML-разметкой (от англ. HyperText Markup Language - «язык гипертекстовой разметки», стандартизированный язык разметки документов в интернет) интернет-сайта с рядом структурных элементов, к примеру различных форм отправки информации, меню etc. Целесообразность использования как статичного, так и динамичного прототипирования при реализации рабочего проекта определяется на стадии создания предварительного проекта. На этапе структурирования схем веб-страниц применяется статичное прототипирование. На этапе разработки веб-дизайна применяется интерактивное прототипирование, которое позволяет при помощи встраиваемого языка программирования для доступа к объектам веб-приложений JavaScript имитировать работу модели пользовательского интерфейса при отсутствии сохранения данных на веб-сервере (от англ. server - специализированное оборудование для выполнения на нём сервисного программного обеспечения) [3]. В случае наличия в предварительном или рабочем проекте решений по цветовой гамме интернет-сайта, возможно использование не черно-белого, а цветного прототипирования. Стоит отметить, что стадия тестирования юзабилити проходит успешнее на цветных прототипах в силу более толерантного восприятия пользователями-тестерами [4]. В качестве примера успешного гибкого подхода к использованию прототипирования при создании официальных информационных и информационно-образовательных интернет-сайтов можно привести Санкт-Петербургский университет Государственной противопожарной службы МЧС России, в доменной зоне которого на доменах 3-го уровня функционируют официальные информационные и информационно-образовательные интернет-сайты (рис. 4, 5, 6) [5, 6]. Ряд основных критериев для условного принятия решения об использовании прототипирования при проектировании веб-интерфейсов представлен в таблице 1. Также стоит отметить, что прототипирование используется не только в проектировании вебинтерфейсов интернет-сайтов, но и для отладки интерактивного пользовательского интерфейса реляционных баз данных с точки зрения удобства загрузки взаимосвязанных данных [7]. Представляется целесообразным использовать многообразие веб-технологий и для современного подхода к профессиональной деятельности специалистов Федеральной противопожарной службы, и для эффективного освоения стандартизированного содержания образования, поскольку и знания, и информация являются не только источниками прибыли, но и стратегическим ресурсом нашего государства с точки зрения суверенитета и национальной безопасности. Рисунок 1 - Термическая карта блока в верхней части страницы официального интернет-сайта Санкт-Петербургского университета ГПС МЧС России за период с 3 октября 2017 года по 2 октября 2018 года Рисунок 2 - Термическая карта блока в нижней части страницы официального интернет-сайта Санкт-Петербургского университета ГПС МЧС России за период с 3 октября 2017 года по 2 октября 2018 года Рисунок 4 - Информационно-обучающий портал «Арктика без опасности» Рисунок 3 -Условный алгоритм поэтапного проектирования пользовательского веб-интерфейса Рисунок 5 - Обучающий портал «Основы радиационной безопасности» Рисунок 6 - «Система дистанционной поддержки сотрудников судебно-экспертных учреждений» Таблица 1 Критерии при проектировании веб-интерфейсов Критерий Решение Тестирование будущего проекта на начальных этапах создания проекта Использовать прототип Упрощение формулировки требований и внесения корректировок Снижение стоимости проекта путем устранения ошибок до ввода в эксплуатацию Возможность отрабатывать на серверной части усложненное взаимодействие с пользователем путем имитации Быстрое согласование разрабатываемого проекта или отказ из-за нереализуемости на начальном этапе Демонстрация будущего проекта на начальных этапах создания Упрощение процесса отрисовки макета на стадии веб-дизайна Простой проект, состоящий из нескольких однотипных шаблонов. Не использовать прототип. Проект, создающийся на готовой технологической платформе с ограниченным определенным функционалом. Сложные креативные визуальные решения. Редизайн с сохранение прежнего функционала.</p>
 </body>
 <back>
  <ref-list>
   <ref id="B1">
    <label>1.</label>
    <citation-alternatives>
     <mixed-citation xml:lang="ru">
            
              Никифоров О.Ю. Интерфейсы Интернета вещей // Научный альманах. - 2015. № 9(11). - С. 1344-1347
            
          </mixed-citation>
     <mixed-citation xml:lang="en">
            
              Nikiforov O.Yu. Interfeysy Interneta veschey // Nauchnyy al'manah. - 2015. № 9(11). - S. 1344-1347
            
          </mixed-citation>
    </citation-alternatives>
   </ref>
   <ref id="B2">
    <label>2.</label>
    <citation-alternatives>
     <mixed-citation xml:lang="ru">
            
              О сервисе - Метрика. Помощь [Электронный ресурс]. - Режим доступа: https://yandex.ru/support/metrika/ (дата обращения: 20.04.2019)
            
          </mixed-citation>
     <mixed-citation xml:lang="en">
            
              O servise - Metrika. Pomosch' [Elektronnyy resurs]. - Rezhim dostupa: https://yandex.ru/support/metrika/ (data obrascheniya: 20.04.2019)
            
          </mixed-citation>
    </citation-alternatives>
   </ref>
   <ref id="B3">
    <label>3.</label>
    <citation-alternatives>
     <mixed-citation xml:lang="ru">
            
              Проектирование пользовательских интерфейсов. Краткий обзор процесса [Электронный ресурс]. - Режим доступа: http://web.archive.org/web/20080112171847/http://www.jvetrau.com/2007/12/18/proektirovanie-polzovatelskih-interfeysov-kratkiy-obzor-protsessa/ (дата обращения: 20.04.2019)
            
          </mixed-citation>
     <mixed-citation xml:lang="en">
            
              Proektirovanie pol'zovatel'skih interfeysov. Kratkiy obzor processa [Elektronnyy resurs]. - Rezhim dostupa: http://web.archive.org/web/20080112171847/http://www.jvetrau.com/2007/12/18/proektirovanie-polzovatelskih-interfeysov-kratkiy-obzor-protsessa/ (data obrascheniya: 20.04.2019)
            
          </mixed-citation>
    </citation-alternatives>
   </ref>
   <ref id="B4">
    <label>4.</label>
    <citation-alternatives>
     <mixed-citation xml:lang="ru">
            
              Прототипирование и его роль в разработке сайта [Электронный ресурс]. - Режим доступа: https://depix.ru/articles/prototipirovanie_i_ego_rol_v_razrabotke_sayta (дата обращения: 20.04.2019)
            
          </mixed-citation>
     <mixed-citation xml:lang="en">
            
              Prototipirovanie i ego rol' v razrabotke sayta [Elektronnyy resurs]. - Rezhim dostupa: https://depix.ru/articles/prototipirovanie_i_ego_rol_v_razrabotke_sayta (data obrascheniya: 20.04.2019)
            
          </mixed-citation>
    </citation-alternatives>
   </ref>
   <ref id="B5">
    <label>5.</label>
    <citation-alternatives>
     <mixed-citation xml:lang="ru">
            
              Кузьмина Т.А., Степанов И.М. Система дистанционного обучения для подготовки спасателей к действиям в условиях Арктической зоны // Подготовка кадров в системе предупреждения и ликвидации последствий чрезвычайных ситуаций: материалы Междунар. науч.-практ. конф. 1 июня 2017 года. Санкт-Петербургский университет ГПС МЧС России. - СПб.: СПб ун-т ГПС МЧС России, 2017. - С. 61-63
            
          </mixed-citation>
     <mixed-citation xml:lang="en">
            
              Kuz'mina T.A., Stepanov I.M. Sistema distancionnogo obucheniya dlya podgotovki spasateley k deystviyam v usloviyah Arkticheskoy zony // Podgotovka kadrov v sisteme preduprezhdeniya i likvidacii posledstviy chrezvychaynyh situaciy: materialy Mezhdunar. nauch.-prakt. konf. 1 iyunya 2017 goda. Sankt-Peterburgskiy universitet GPS MChS Rossii. - SPb.: SPb un-t GPS MChS Rossii, 2017. - S. 61-63
            
          </mixed-citation>
    </citation-alternatives>
   </ref>
   <ref id="B6">
    <label>6.</label>
    <citation-alternatives>
     <mixed-citation xml:lang="ru">
            
              Шарапов С.В., Кузьмина Т.А. Перспективы использования объектно-ориентированной системы подготовки пожарно-технических экспертов // Науч.-аналит. журн. «Вестник С.-Петерб. ун-та ГПС МЧС России». - 2017. - № 3. - С. 183-188
            
          </mixed-citation>
     <mixed-citation xml:lang="en">
            
              Sharapov S.V., Kuz'mina T.A. Perspektivy ispol'zovaniya ob'ektno-orientirovannoy sistemy podgotovki pozharno-tehnicheskih ekspertov // Nauch.-analit. zhurn. «Vestnik S.-Peterb. un-ta GPS MChS Rossii». - 2017. - № 3. - S. 183-188
            
          </mixed-citation>
    </citation-alternatives>
   </ref>
   <ref id="B7">
    <label>7.</label>
    <citation-alternatives>
     <mixed-citation xml:lang="ru">
            
              Бобров А.И., Чуйков А.М., Кузьмина Т.А. Информатизация процессов надзорной деятельности в МЧС России // Современные технологии обеспечения гражданской обороны и ликвидации последствий чрезвычайных ситуаций: сб. ст. по материалам X Всерос. науч.-практ. конф. курсантов, слушателей, студентов и молодых ученых с междунар. уч. 18 апреля 2019 года. Воронежский институт - филиал ФГБОУ ВО Ивановской пожарноспасательной академии ГПС МЧС России. - Воронеж: Воронежский ин-т - филиал Ивановской пожарно-спасательной академии ГПС МЧС России, 2019. - С. 43-45
            
          </mixed-citation>
     <mixed-citation xml:lang="en">
            
              Bobrov A.I., Chuykov A.M., Kuz'mina T.A. Informatizaciya processov nadzornoy deyatel'nosti v MChS Rossii // Sovremennye tehnologii obespecheniya grazhdanskoy oborony i likvidacii posledstviy chrezvychaynyh situaciy: sb. st. po materialam X Vseros. nauch.-prakt. konf. kursantov, slushateley, studentov i molodyh uchenyh s mezhdunar. uch. 18 aprelya 2019 goda. Voronezhskiy institut - filial FGBOU VO Ivanovskoy pozharnospasatel'noy akademii GPS MChS Rossii. - Voronezh: Voronezhskiy in-t - filial Ivanovskoy pozharno-spasatel'noy akademii GPS MChS Rossii, 2019. - S. 43-45
            
          </mixed-citation>
    </citation-alternatives>
   </ref>
  </ref-list>
 </back>
</article>
