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

Пока я все никак не создам статью про решение с хакатона, обещанное еще тут, на волне эмоциональных переживаний попыток поступления в китайские ВУЗы хочется обсудить то, от каких проблем реализации может спасти наличие системного аналитика на проекте.

Дисклеймер

Статья ни в коем случае не несет в себе посыл “ололо, китайцы не умеют программировать”. Это неправда, вполне себе умеют. Но, видимо, на системах для ВУЗов не сильно заостряют внимание. Да и ладно, русские тоже могут в сверхзвуковые ракеты, а в стиральные машинки не очень.

Статья предназначена для того, чтобы на реальных примерах и в шутливом тоне разобрать достаточно простые ошибки юзабилити, которые, однако, могут доставить пользователям немало хлопот и негатива.

Так уж повезло, что под раздачу попали китайские ВУЗовские системы, в которых автор вертится последние месяца 4.

Также стоит отметить, что приведенные в статье примеры относятся к ВУЗам самых разных рангов. Есть тут скрины как систем ведущих ВУЗов Пекина и Шанхая, так и менее известных региональных ВУЗов.

Вводные

Дано:

Желание поучиться за границей, а именно в Китае. Почему туда, зачем, как я вообще дошла до такой жизни — за рамками статьи, но могу ответить в комментариях, если такой интерес будет. Спойлер, нет, это не связано с политической ситуацией.
Желаемая специальность — что-то около IT (software engineering, computer science and technology, computer software and theory, etc)
Желаемый уровень — Master Degree
Язык обучения — английский
Весь Google для поиска университетов и программ

Подготовка

Для начала необходимо найти ВУЗы, которые предоставляют обучение по требуемой специальности на нужном языке. Затем выбрать желаемые, в которые подавать заявку, по своим внутренним критериям (наличие стипендии, замороченность заявки, учебная программа специальности в данном ВУЗе и так далее). И, наконец, зарегистрироваться в ВУЗовских системах подачи заявок.

И вот отсюда-то и начнем собирать прелести китайских ВУЗовских систем для иностранных студентов.

Верхнеуровневая структура системы

Что нам, верхнеуровнево, нужно в системе для подачи заявки в ВУЗ? Примерно следующие возможности полезно дать абитуриенту:

Войти и выйти из системы
Заполнить всю интересующую нас информацию о нем
Сохранить информацию
Отредактировать информацию (в том числе, вернуться к редактированию спустя время)
Загрузить документы, необходимые для поступления
По факту заполненности заявки — отправить ее в ВУЗ на рассмотрение

Что же, давайте пройдемся по реализации этих пунктов IT-специалистами Поднебесной.

Организуем удобный login и logout

А давайте оставим просто login

Тут я наблюдала два варианта развития событий:

Login есть, зачем нам logout?
Возможно, предполагалось удержание абитуриента в системе любой ценой =)

Вот просто полное отсутствие кнопки logout. И, если она тебе нужна, сам догадайся, как оно работает. Без шуток, вот зацензуренный скрин системы одного из ВУЗов:

Системы с таким подходом сами logout’ят тебя в известное только им время. Причем делают это тоже очень удобно, подробнее в следующем пункте.

Login сделали, регистрацию оставили на потом…

В процессе перебора ВУЗов попался такой, в котором просто нет кнопки регистрации в системе подачи заявок. И во всех гайдах по подаче, которые удалось найти на сайте, только следующая фраза: “Log in to the website of School of International Education…. Then click "APPLY NOW", fill in the application form and submit it.”

И пруфоскрин:

В общем, рожденный логиниться — зарегистрироваться не может.

Возможно, предполагалось, что кандидат должен проконтактировать с ВУЗом для создания аккаунта. Но ёпрст, я пролазила по всему сайту, никаких упоминаний и инструкций о подобном!

И давайте не сообщать о logout’е

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

А мы же на прошлом шаге решили отказаться от кнопки logout. И спустя таймаут нужно выкидывать пользователя из его кабинета.

Учесть в таймауте конкретно время бездействия пользователя?

Пусть лучше наш абитуриент, когда нажмет кнопку “Сохранить”, после того, как закончил перебивать все сведения о своем образовании и трудоустройстве, обнаружит, что он разлогинен.

Ненуачо. Нам с низкой скоростью печати кандидаты-в-программисты не нужны.

И ругнемся по-китайски.

И ладно, что в настройках системы выставлен английский, и вообще — она для иностранных студентов. Пусть заранее готовятся к тому, что в Китае с английским не очень.

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

Action points для системного аналитика, раз

В случае, если в системе предусмотрена необходимость аутентификации и авторизации - все, что касается этого пользовательского опыта, должно быть этому самому пользователю понятно.
Упорно нет бюджета на logout? Давайте предусмотрим размещение информации о способах выхода из системы. Если внутри есть таймауты - не забудем их указать (в идеале, с правилами, как себя эти самые таймауты ведут)
На регистрацию бюджета тоже недодали? Та же история, давайте напишем хотя бы про это.
Но лучше-таки обоснуем необходимость полного сценария и выбьем бюджет.
Если система предусматривает использование на нескольких языках, все выдаваемые пользователю ошибки должны быть в соответствующей локали.

Предоставляем комфортный интерфейс для заполнения информации

Не раскрываем особенностей полей

Представим, что у нас есть набор полей, которые абитуриент должен заполнить.

А давайте не сообщим кандидату, какие ограничения есть у полей, например, разрешенные длина или символы? Можно еще и повеселее квест сделать, например, вот так:

Что происходит на скрине - два поля, которые, идеологически, оба о городах, дают сохранить в себе разное количество символов. Признаться, я долго рефлексировала на тему того, что название города, в котором я проживаю, должно быть, в китайском понимании, короче названия города, в котором я родилась.

Решила, что им просто не интересен мой текущий город. Все равно к ним собираюсь.

Или, например, попытаемся ввести место работы.

Сохраняем… оп!

А вот нельзя кавычки. Не догадался? Ну, проверишь, заполнишь заново. И не важно, что проверить надо миллион полей, а ты живой человек, у которого глаз замыливается.

Впрочем, иногда ограничения все же проскакивают. Но вот конфуз — в основном на китайском! Мы же помним, из предыдущего пункта — абитуриента к суровой китайской реальности готовить нужно заранее!

Особенно классно эти очевидные ограничения отрабатывают при сохранении информации. Об этом ниже.

И заодно не раскрывать, что вообще придется заполнить

Очень много китайских систем подачи заявок в ВУЗ сделаны одинаково, видимо, один вендор. В них можно увидеть следующее:

Допустим, абитуриент нам попался непоседливый, хочет заранее пройтись по всем страницам заявки, оценить масштаб бедствия по ее заполнению. Ну или не непоседливый, а старательный и логичный, тут как посмотреть.

Левое меню вроде бы приветливо сообщает нам о доступных страницах. Наведем мышкой на название “Study plan”:

О, подсветилось, наверное, можно нажать. Нажимаем. Происходит… ничего.

Подавляющее большинство китайских систем не дает тебе посмотреть, что же тебя в этой загадочной заявке ждет далее, пока ты полностью не заполнишь и не сохранишь предыдущие пункты. И все бы ничего, но у меня происходили случаи, когда я в процессе заполнения понимала, что этот ВУЗ мне не подойдет, как раз из-за особенностей заявки ~~(или из-за того, что прошляпила информацию на сайте ВУЗа)~~. И очень неприятно, спустя пару часов заполнения осознать, что все зря.

Либо осознать нечто покруче — что тебе нужно x2 больше документов для заявки, чем ты предполагал. Переходим к следующему пункту.

Скрыть не смогли, будем раскрывать поинтереснее!

Допустим, мы все же попали в систему, где можно погулять по вкладкам и посмотреть, что тебя ждет. Но, кажется, это слишком просто.

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

Казалось бы, нормальная относительно практика, поставил “yes” в вопросе про “Please clarify if an illegal or criminal” (орфография и грамматика сохранены), будь добр, поясни, что ты такого натворил в жизни. Вот только иногда такое может неприятно ударить по кандидату.

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

В итоге по факту заполнения информации об образовании, я обнаружила, что от меня ожидают переведенный и нотариально заверенный школьный аттестат. Вот когда вы последний раз задумывались, где ваш школьный аттестат, и как он выглядит?

P.S. Со мной оказался хард, на котором 10 лет лежали фотографии этого самого аттестата. Вот уж никогда бы не подумала, что в 16 лет сохраняю такие инвестиции в будущее.

Ну и напоследок — разовьем креативность абитуриентов

Особенность меня, как абитуриента, в том, что я, хоть и мечу на Master Degree по IT-специальности, по основному образованию я айтишником не являюсь от слова “совсем”. Оба моих диплома говорят о том, что я — инженер по судовым ядерным реакторным установкам.

Для России в подавляющем большинстве случаев это абсолютно не страшно. Помню, как познала дзен, когда 19-летняя знакомая студентка выдала: “Какая разница, где учится, чтобы потом работать не по специальности”.

С китайцами такое не прокатит. Вот что пишут в требованиях большинства ВУЗов:

“College educational background or equivalent, and majors in computer science, computer engineering, electronic engineering, etc. If the applicant's major is irrelevant to any of the major mentioned above, education background or working experience related to "IT" is expected.”

Поэтому в моем случае необходимо доказывать, что не только

но и working experience related to "IT" имеет хороший.

Требуя с абитуриента что-то, нужно дать ему возможность это предоставить. ~~Ваш кэп.~~

И вот какой пердюмонокль со мной происходит в системе того же вуза, выдержка из чьих требований приведена выше:

Итак, имеется вкладка “Education & Employment”. Вот только ввести на ней можно лишь Educational Background. И вот как хочешь, так и отображай свой working experience related to "IT".

Может быть, есть что-то под резюме ниже, в Upload Documents?

Штош, придется выкручиваться и каким-либо образом указывать свой профессиональный опыт в разрешенных для подачи документах.

Ну и не заметный на фоне нюанс — в требованиях хотят motivation letter, в системе же можно загрузить только personal statement. Ну, бывает.

И напоследок — как можно очевиднее указываем то, что мы хотим выяснить у кандидата

Иногда наименования полей для заполнения могут ввести в ступор. Например:

Китайские вузы очень любят рекомендательные письма. После того, как ты подписал их X штук, автоматически на такое поле реагируешь как “тот, кто рекомендует меня, как студента”. Окей, вроде все понятно, собираешься заполнять и тут:

Ага. Ну ладно, думаю я, видимо, это для статистики, откуда я про них узнала. Вот только остальные обязательные поля этого блока вносят сомнения в эту стройную теорию:

Не знаю, как вам, но меня вводит в ступор требование указать Phone Number и Organization веб-сайта, с которого я почерпнула информацию об институте. Ладно хоть пункты Nationality и Job Title не обязательные.

Иногда в этих случаях помогает переключение на китайскую версию системы. Тут не помогло.

Action points для системного аналитика, два

Не забывай про локализацию. Дубль 2
Если на то, что должен ввести пользователь, наложены ограничения, проследи, чтобы ему про это сообщили.
Если система предполагает продолжительное заполнение пользователем информации — дай ему возможность оценить масштаб проблемы. И понять, хочет ли он в это ввязываться вообще.
Если же таковой возможности вы давать не хотите — то деактивируйте соответствующие кнопки и переходы
Если в системе есть что-то, что пользователь обязательно должен подготовить заранее (например, перечень документов) —
Для всего того, что вы хотите получить от пользователя — должно быть предусмотрено место ввода или загрузки = пользователь не должен гадать, куда ему поместить обязательную для вас информацию
Все, что пользователь должен заполнить, должно быть названо максимально конкретно. Обязывать вводить несочетаемые поля тоже не стоит.

Качественно сохраняем информацию от абитуриента

Выше мы уже прошлись по прекрасным особенностям сохранения информации и запомнили, что, чтобы прорваться в китайский ВУЗ, нам нужно тренировать скоропечатание, чтобы успеть, пока не разлогинило.

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

Дружелюбные системы при попытках сохранить что-то не перевариваемое обрежут все как им удобно. И проведут-таки это самое сохранение. Менее дружелюбные хотя бы ругнутся (конечно же, по-китайски), что, батенька, что-то пошло не так, но мы не можем сообщить, что именно. Максимально недружелюбные — не скажут вам ничего, просто потрут подчистую все, что вы вводили на странице, издевательски мигнув “Успешно!”

Action points для системного аналитика, три

Когда пользователь что-то сохраняет, он должен понимать, как с его введенной информацией дела. Не получилось сохранить — показываем, что именно пошло не так. И показываем, что получилось, только когда реально получилось (мы не застрахованы от внутреннего “что-то пошло не так”, но хотя попытаемся не врать пользователю).

Предусматриваем инструменты для редактирования

Не перестаем быть user-friendly

Как вы думаете, нашелся ли хоть где-то функционал “Вы редактировали информацию на странице, но не сохранили ее. Вы точно хотите уйти со страницы?”

Правильно. Конечно нет.

Остаемся верны принципам очевидности

Сейчас будет немного не про ВУЗовскую систему, а про правительственную, используемую для подачи заявок на государственную стипендию.

После создания заявки система присылает письмо, в котором присутствует следующее:

Your Application for LALALA University is generated, but not submitted yet.

You can modify your Application form online at https://link.to.modify, with your Application number and password before it is submitted.

Application Number: AppNum

Password: Qwerty

Отлично, думаешь ты, отвлекусь, потом вернусь к заполнению. Возвращаешься, идешь по ссылке и тебя перекидывает на:

View? Вроде нам нужен modify, но ладно, окей, мы уже выясняли, что называть вкладки и разделы в соответствии с содержанием как-то не модно. Введем регистрационные данные, после загрузки попадем на

Я посмотрела раз. Посмотрела два. Спустя секунд 30 я поймала себя на мысли, что не понимаю, как перейти в редактирование моей заявки. Пункты меню вокруг, отсутствующие на скрине, тоже не предлагали ничего про 修改 (modify).

P.S. Мой друг справился с этой задачкой значительно шустрее меня. Так что, может, проблема во мне, и тут все очевидно :D

Action points для системного аналитика, четыре

Очень мило напоминать людям, что они забыли что-то сохранить после редактирования. Хотя бы потому, что они наверняка старались =)
А еще милее давать им понять, как начать что-то редактировать. А то пара седых волос, что все, ничего не поделать, а вторую заявку не создать из-за уникальности по номеру паспорта, им точно гарантирована.

А вот про удаление никто не говорил

Приведу пару скринов разных систем, в которых ожидается загрузка документов:

Представим, что кандидат оказался в ситуации, когда вместо своего диплома загрузил фото ~~груди~~ любимого котика. И мы снова попадаем в ситуацию “Чтоделатькакбытькудажамкать”.

Ответ, в принципе, лежит на поверхности, но когнитивные усилия для него требуются - можно “поверх” загрузить нужный документ. Вот только если котика мы грузанули в раздел Others, и нужные документы уже загружены в основные разделы — что ж, или котик, или дублирование документа, и риск выглядеть умничкой что загрузил одно и то же в разные поля =)

Ах да, возможность скачать документ и проверить, что вы не промахнулись с загрузкой — не всегда так очевидна, как на втором скрине. Возможно, придется полазить по системе и найти тот самый заветный download.

Делаем загрузку еще удобнее

Пришлось на своем пути встретить и загрузку Шредингера. Система для того, чтобы дать выбрать документ с компьютера, открывает новую вкладочку, примерно так:

Окей, выбираем нашу справку о несудимости и тыкаем submit.

Статус загрузки сменился мгновенно, а вот окошко загрузки будет еще дооолго в состоянии обработки. И, если закрыть эту внешнюю вкладку, и попробовать сохранить “Успешно загруженный” документ — ничего не выйдет =)

Вот только если дождаться отбивки от внешней вкладки, что она справилась, тогда есть шанс на успех.

Не забываем про сокрытие особенностей

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

Вот только если при сохранении что-то пошло не так… Помните про дружелюбные и не очень системы?

Здесь та же история — скорее всего, вам даже не сообщат, почему ваш документ не сохранился. В хорошем случае — ругнутся по-китайски без объяснения причин.

Но к этому моменту чтения вас уже вряд ли этим удивишь =)

Action points для системного аналитика, пять

Если в системе предусмотрен некий сценарий с загрузкой файлов — пользователю должен быть доступен и понятен каждый его шаг. Угадывать, как перезагрузить файл или не иметь возможности его удалить — не лучшие варианты по “понятности” и “доступности” =)
Дубль два про “не врать пользователю о результатах работы системы”. Как и при сохранении, при загрузке важно показывать пользователю актуальный и верный статус процесса.

А что с отправкой заявок?

Тут уже косячат не столько системы, сколько те, кто их обрабатывает. Вашу заявку могут уже отклонить, но в системе статус не поменять.

Однако, в части первичной обработки заявок и их верификации — все здорово, сотрудники ВУЗов оперативно с этим справляются.

Немного смешнявок на сладкое

Не относится к системам ВУЗов и багам, но вы видели китайскую капчу?)

Требуется нажать иероглифы в указанной последовательности. Пошел 5й год моего изучения китайского, но китайская капча меня побеждает в 50% случаев.

И какой из всего этого вывод

Неожиданно, но на примере китайских систем подачи заявок в ВУЗы очень хорошо прослеживаются простые ошибки пользовательских сценариев, которые вроде бы и очевидны, но если их допустить — весь процесс подачи работы с системой может оставить неприятное послевкусие. Если вы системный аналитик, одна из ваших задач — не пропускать в разработку и не принимать от тестирования то, что может доставить пользователю дискомфорт. Соберем вместе все то, что заметили:

При необходимости использовать несколько локализаций на разные языки — перевод необходимо предусмотреть для всего, что доступно пользователю
Сценарии входа/выхода/регистрации, если они предусмотрены функционалом системы, должны быть прозрачны для пользователя
Если пользователь должен ввести в систему какие-то данные — он должен понимать, что и куда вводить. Не стоит называть поля для ввода чрезмерно лаконично
Ограничения на вводимые данные должны быть известны пользователю
Не должно быть требований ввода несочетаемых логически полей. Как в моем примере — ввести номер телефона для веб-сайта
В случае, если вводимых данных много, и они разбиты по вкладкам, полезно дать пользователю возможность просмотреть все то, что от него требуют ввести — т.е. не блокировать переключение между вкладками
В противном случае, если ну никак нельзя пустить пользователя на соседнюю вкладку, пока он не разберется с предыдущей — не давайте ложных надежд на возможность переключения
Когда в систему подразумевается загрузка документов, и она обязательна — пользователь должен либо заранее знать точный список (т.е. мы ему где-то, в понятном и доступном месте на сайте системы, например, ему про это сообщили), либо иметь возможность внутри системы сразу просмотреть данный список
+ Если список документов варьируется, нужно рассказать пользователю об этих “если”
+ Кроме того, перечень обязательных к загрузке документов в системе не должен противоречить тому, что мы выложили где-то в сопроводительных документах
При наличии в системе процессов, которые подразумевают наличие статуса, к примеру “успешно”/”в процессе”/”не успешно” — пользователю необходимо сообщать правдивый статус происходящего
Возможности редактирования введенной информации, если они предусмотрены, также не должны вызывать недоумений
На случай, если пользователь что-то изменил и не сохранил — полезно предусмотреть предупреждение об этом, особенно если вводимая информация обширна

Вот так, на примере относительно монофункциональной системы подачи заявок в ВУЗы можно собрать приличное количество сюрпризов и квестов. Оно, конечно, весело, но только первые раз 10 =)