1. Проблема всех мобильных приложений

Долгое время студенты JavaRush просили мобильное приложение для учебы. И мы их понимаем — в современном мире телефон доступен гораздо чаще, чем полноценный компьютер с IntelliJ IDEA. Гораздо легче в течение дня выделить несколько раз по 15 минут, чем сесть за учебу на 1-2 часа.

Обучения на JavaRush стало бы значительно эффективнее, если бы мы придумали, как использовать все представляющиеся нам возможности. Вот только как засунуть в телефон IDE?

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

Однако, где-то в начале 2019 года мы совершили прорыв. Вместо того, чтобы копировать большие IDE, мы решили сосредоточиться на проблемах пользователей во время написания их кода. Наше решение базировалось на нескольких простых принципах:

  • Чтение кода важнее написания кода
  • Набираемый код важнее способа его набора
  • Управление курсором должно быть простым и интуитивно понятным
  • Нет одного-единственного способа правильно решить задачу.

2. Наше решение

У нас получилось создать достаточно красивое решение, которое соответствовало всем принципам.

Просмотр кода

Во-первых, мы решили разделить режимы просмотра кода и режим редактирования кода. В режиме просмотра кода свайп скролит текст, а не двигает курсор. Да и просматривать код удобнее, когда клавиатура не занимает пол-экрана.

Подсказки

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

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

И, конечно же, слова-подсказки должны быть уникальны для каждой задачи. Для каждой из 1500 задач, существующих на JavaRush. Мы потратили два месяца только на совершенствование алгоритма генерации подсказок. И все равно потом пришлось обрабатывать подсказки каждой задачи вручную.

Результат впечатляющий, хотя думаю, мы все еще продолжим их улучшать.

Курсор

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

Мы создали специальную кнопку-джойстик, которая позволяет управлять курсором, не закрывая код. А также добавили специальные кнопки для посимвольного перемещения курсора. И все это для того, чтобы вы в процессе набора кода думали о коде, а не о том, как же его все-таки набрать!


3. Обзор мобильного приложения

Мы начинали с четырех разделов в мобильном приложении:

  • Курс Java
  • Задачи
  • Помощь
  • Группы

И немного подробнее о каждом из них

Курс Java

В разделе Курс Java отображается список всех уровней JavaRush, сгруппированных по квестам. В каждом уровне отображаются его лекции. Вы легко можете перейти к последней лекции: для этого есть специальная кнопка «Начать/Продолжить».

Задачи

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

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

Помощь

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

Также вы можете задать собственный вопрос по задаче. Ваш код при этом будет добавлен к вашему вопросу автоматически: ничего никуда копировать не нужно.

Группы

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

На декабрь 2020 года в мобильном приложении уже 11 разделов.