Обучение детей разработке мобильных приложений в Thunkable
Раньше я не слишком интересовался разработкой мобильных приложений, поскольку для меня смартфон так и не стал основным рабочим инструментом или хотя бы источником развлечений. Конечно, я был вынужден приобрести смартфон (в прошлом году у меня был пост об обновлении своего смартфона) и получить навыки работы с ним, так как сейчас это требуется по работе и при общении с финансовыми институтами, государственными органами и так далее.
В принципе, то, что интернет развивается в сторону мобильных устройств (в основном смартфонов), коммерсантам стало понятно еще в начале 2010-х или даже раньше. Лично я это заметил только в начале 2023 года. По информации на различных статистических сайтах количество мобильных пользователей интернета превысило количество пользователей интернета с настольных персональных компьютеров (ПК) и ноутбуков примерно на рубеже 2016-2017 годов.
На данный момент среди граждан, пользующихся интернетом, около 93 % используют для доступа в интернет смартфон и только около 62 % используют для той же цели настольный ПК или ноутбук (эти множества, очевидно, сильно пересекаются: многие пользуются интернетом через смартфоны и через настольные ПК/ноутбуки одновременно, см. источник). При этом интернет-трафик с мобильных устройств составляет около 60 % от общего интернет-трафика.
Только что я начал полуторамесячный курс по разработке мобильных приложений для детей в группе 10-13 лет (второй год обучения в нашей компьютерной академии).
Веб-сервис «Thunkable»
В качестве инструмента разработки мы используем веб-сервис (платформу) «Thunkable»:
https://thunkable.com (сайт платформы)
https://x.thunkable.com (веб-среда разработки)
https://docs.thunkable.com (документация, на английском)
https://community.thunkable.com (сообщество разработчиков)
Для разработки мобильных приложений с помощью веб-сервиса «Thunkable» достаточно иметь на настольном компьютере (или ноутбуке) браузер и доступ в интернет. Веб-сервис предоставляет на выбор 5 тарифных планов, в том числе тарифный план «Free» - бесплатный. Естественно, бесплатно доступен урезанный набор функций, которого при этом, в принципе, достаточно для обучения детей разработке мобильных приложений.
Дополнение от 21.09.2024 г.: бесплатный тарифный план ограничивает количество проектов, которое можно хранить в рамках своего аккаунта, десятью проектами. Это довольно важное ограничение и оно очень неудобно.
Дополнение от 24.10.2024 г.: с середины октября функционал, доступный на бесплатном тарифном плане, в очередной раз ограничили: количество хранимых в аккаунте проектов снижено с десяти до трех, количество создаваемых в рамках одного проекта экранов ограничено пятью (раньше не ограничивалось). Вероятно, буду рассматривать перевод курса на веб-сервис «MIT App Inventor». Последний полностью бесплатен, активно развивается и именно из него родился веб-сервис «Thunkable». Но у меня нет опыта работы с «MIT App Inventor», хотя мы используем в обучении известный веб-сервис scratch.mit.edu того же MIT (по-русски «МТИ» - Массачусетский технологический институт).
Веб-сервис «Thunkable» позволяет кроссплатформенную разработку мобильных приложений: для запуска на смартфонах с системой «iOS» и на смартфонах с системой «Android».
Компанию и веб-сервис «Thunkable» создали в 2015 году индиец и китаец, окончившие американский МТИ («Массачусетский технологический институт»). Штаб-квартира компании находится в городе Сан-Франциско (штат Калифорния, США). Во времена студенчества оба участвовали в разработке другой известной среды разработки мобильных приложений «App Inventor» (appinventor.mit.edu). Полученный опыт они положили в основу своего продукта, но внесли и множество своих добавлений и изменений. (Тут мне сразу вспомнились индиец Динеш и китаец Дзан Янг из американского сериала «Silicon Valley» 2014-2019 годов.)
Название веб-сервиса «Thunkable» произносится примерно как «та́нкбл» (понятно, что «th» - это не совсем русская «т»), с ударением на первый слог. В этом можно убедиться, послушав видеоролики на их ютуб-канале (сейчас приходится ради образовательных целей обходить «замедление» ютуба). В английском языке концовка «-able» обычно образует прилагательное из глагола. Слово «thunk» в английском имеет различное значение в разных контекстах. Я не знаю точно, что оно означает в данном случае, но думаю, что в первую очередь тут подразумевается слово «think» («думать» по-русски). То есть «thunkable» - это, полагаю, что-то вроде «имеющий отношение к мысли, размышлению», но с оттенком весёлости.
Маскот платформы - Билли Бивер (Billy Beaver), фамилия переводится на русский как «бобр». Вот как он выглядит:
Регистрация на веб-сервисе
Регистрация на веб-сервисе бесплатная, но обязательная. Есть ряд способов регистрации, из них два основных - регистрация с помощью Google-аккаунта и регистрация с помощью электронной почты. Я регистрировался с помощью электронной почты. Обычно при регистрации нужно придумать псевдоним (логин) и пароль. Тут схема другая: каждый раз при авторизации на веб-сервисе вводишь адрес электронной почты, после чего тебе на почту высылают письмо со ссылкой, по которой следует перейти для входа на веб-сервис.
Таким образом, пароль не нужно придумывать и запоминать, поскольку пароля нет. Ссылка в письме действует в течение 5 минут, потом становится недействующей. Если вы перейдете по этой ссылке в течение 5 минут после ее формирования, то она будет действовать следующие 30 дней и только потом станет недействующей. Это работает только для первого перехода по ссылке, дальнейшие переходы по этой ссылке никак не меняют срок ее действия. Не уверен, что такой способ мне нравится: с одной стороны не нужно возиться с паролем, с другой стороны нужно при каждом входе заходить в свой почтовый ящик (или где-то хранить ссылку из письма), что напрягает.
Не требуется написание кода
Последние годы на Западе (а потом и у нас, как мартышки) форсят понятие «No Coding Required» («не требуется написание кода» или еще близкое по смыслу «не нужно уметь программировать») при разработке приложений.
Понятно, что это изобретение маркетологов, задача которых, как известно, втюхать свой товар как можно большему числу пользователей. Насколько я понимаю, изобретатели данного понятия считают, что пользователи, которые не являются программистами, не купят инструмент разработки приложений из-за того, что считают умение программировать недоступным обычному человеку.
На самом деле, при разработке любых приложений умение программировать необходимо. В данном случае фраза «не требуется написание кода» подразумевает, что не требуется писать код текстом, на текстовом языке программирования. Для программирования на этом веб-сервисе используется визуальный язык программирования, программа составляется из разноцветных блоков. Насколько я понимаю, это один из многочисленных клонов-последователей известного и популярного языка программирования Scratch. По сравнению с текстовыми языками программирования у визуально-блочного языка есть как преимущества (например, отсутствие синтаксических ошибок), так и недостатки (сложно копировать куски кода с одного уровня вложенности на другой; очень трудно и неудобно писать длинные и сложные программы).
Интерфейс веб-среды разработки
Действующая новая версия интерфейса веб-среды разработки имеет название «X», поэтому адрес веб-среды разработки выглядит как «x.thunkable.com». Предыдущую версию интерфейса веб-среды разработки называют «Classic» и, насколько я понимаю, она уже недоступна для новых пользователей веб-сервиса.
Как я понял, у интерфейса «X» веб-среды разработки есть два подвида: «Snap to Place» (StP) и «Drag and Drop» (DnD). Более новым и продвинутым считается подвид «Drag and Drop», который работает по умолчанию. В общем, на это можно особо внимания не обращать, но эти термины встречаются в документации и могут иногда сбить с толку.
Вот как выглядит интерфейс веб-среды разработки на данный момент (по умолчанию), можно кликнуть мышью на изображение, чтобы просмотреть в большем размере:
В данный момент на иллюстрации выше открыт инструмент среды разработки для проектирования интерфейса создаваемого мобильного приложения (в левом верхнем углу окна выбрана вкладка «DESIGN», еще этот инструмент называют «дизайнером»).
Можно видеть, что тут создается мобильное приложение, содержащее три разных экрана (screen), которые видно в центральной части иллюстрации. На экраны помещены изображения, надписи и кнопки. Это интерфейс мобильного приложения, которое мы создавали на первом занятии по данному курсу. Приложение называется «Виртуальный питомец», подобных мобильных приложений существует множество: игрок должен заботиться о своем виртуальном питомце. В нашем случае питомец - котик, которого можно покормить или погладить, нажав на одну из двух кнопок.
Для написания программы для создаваемого мобильного приложения на визуальном языке программирования с помощью разноцветных блоков можно переключиться в левом верхнем углу экрана на вкладку «BLOCKS». Вот как выглядит программирование в данном веб-сервисе:
На иллюстрации выше видно, каким образом запрограммированы две кнопки на первом экране создаваемого мобильного приложения. При нажатии (клике мышью с настольного персонального компьютера или тычке пальцем по экрану смартфона) на каждую из этих кнопок происходит переход на один из двух других экранов приложения.
Тестирование мобильного приложения
Нажав на первую слева из кнопок в меню в верхнем правом углу экрана среды разработки, откроем текущий экран мобильного приложения для тестирования прямо тут же, в браузере. Это можно сделать в любой момент и это очень удобно.
Другая возможность тестирования еще интереснее: она позволяет быстро запустить создаваемое мобильное приложение на вашем смартфоне. Для этого нужно сначала установить на смартфон бесплатное мобильное приложение «Thunkable Live» (оно есть как в магазине приложений «Google Play», так и в магазине приложений «App Store»). После установки это приложение нужно запустить и сформировать текстовый код (для тех, кто зарегистрировался на веб-сервисе «Thunkable» с помощью электронной почты; для зарегистрировавшихся через Google-аккаунт тестирование тоже возможно, но я сам это не проверял). После этого следует нажать на вторую слева кнопку в меню в верхнем правом углу экрана среды разработки на компьютере и в открывшемся окошке ввести сформированный на смартфоне текстовый код (он состоит из 7 символов). Создаваемое мобильное приложение откроется в внутри приложения «Thunkable Live», можно нажимать на кнопки и так далее. Тоже очень удобно.
Публикация мобильного приложения
К сожалению, в рамках бесплатного тарифного плана вы имеете только две возможности: 1) выслать себе на электронную почту архив с файлами созданного мобильного приложения (я пробовал только в формате APK [Android Package Kit] для системы «Android»), всё получилось. Этот архив вы можете при желании распространять самостоятельно. 2) Вы можете поделиться (share) ссылкой на созданное мобильное приложение, при этом тот, кому вы передадите ссылку, сможет перейти по ней, только если зайдет в свой аккаунт на веб-сервисе «Thunkable». Перешедший по полученной от вас ссылке сможет либо напрямую свободно редактировать ваш проект, либо (если вы передали ссылку на «страницу проекта») - просмотреть ваш проект в режиме «только для чтения» (при этом он имеет возможность скопировать ваш проект к себе в аккаунт и после этого сможет вносить в свою копию любые изменения).
В рамках бесплатного тарифного плана вы можете создавать проекты только вида «Public» (ваше приложение сможет запустить и скопировать кто угодно). Проекты вида «Private» (доступные только вам) можно создавать лишь в рамках платных тарифных планов.
Удобная публикация проекта доступна только в рамках платных тарифных планов, под такой публикацией я подразумеваю две возможности: 1) веб-публикация проекта, при этом проект хостится на сервере веб-сервиса «Thunkable», как будто это обыкновенный сайт; 2) публикация проекта в магазинах приложений «Google Play» и «App Store».
Заключение
В целом веб-сервис «Thunkable» мне пока что нравится, но я с ним еще мало работал. Для обучения детей разработке мобильных приложений вполне подходит, если ограничиться тестированием приложения в веб-среде разработки или в рамках приложения «Thunkable Live» на смартфоне.
О недостатках. Как я понял, нельзя поделиться веб-ссылкой на созданное мобильное приложение с человеком, у которого нет аккаунта на веб-сервисе «Thunkable». Я привык, что такая возможность обычно есть на веб-сервисах бесплатно (на данном веб-сервисе можно опубликовать созданное приложение в виде веб-версии, как обычный сайт в интернете, но это платная функция, как я уже упоминал выше).
Также стоит иметь в виду ограничение количества хранимых в рамках аккаунта проектов десятью тремя проектами - это затрудняет обучение, этого слишком мало, недостаточно для обучения; для обучения имеет смысл рассмотреть переход на альтернативные веб-сервисы, например, на «MIT App Inventor»).
В принципе, то, что интернет развивается в сторону мобильных устройств (в основном смартфонов), коммерсантам стало понятно еще в начале 2010-х или даже раньше. Лично я это заметил только в начале 2023 года. По информации на различных статистических сайтах количество мобильных пользователей интернета превысило количество пользователей интернета с настольных персональных компьютеров (ПК) и ноутбуков примерно на рубеже 2016-2017 годов.
На данный момент среди граждан, пользующихся интернетом, около 93 % используют для доступа в интернет смартфон и только около 62 % используют для той же цели настольный ПК или ноутбук (эти множества, очевидно, сильно пересекаются: многие пользуются интернетом через смартфоны и через настольные ПК/ноутбуки одновременно, см. источник). При этом интернет-трафик с мобильных устройств составляет около 60 % от общего интернет-трафика.
Только что я начал полуторамесячный курс по разработке мобильных приложений для детей в группе 10-13 лет (второй год обучения в нашей компьютерной академии).
Веб-сервис «Thunkable»
В качестве инструмента разработки мы используем веб-сервис (платформу) «Thunkable»:
https://thunkable.com (сайт платформы)
https://x.thunkable.com (веб-среда разработки)
https://docs.thunkable.com (документация, на английском)
https://community.thunkable.com (сообщество разработчиков)
Для разработки мобильных приложений с помощью веб-сервиса «Thunkable» достаточно иметь на настольном компьютере (или ноутбуке) браузер и доступ в интернет. Веб-сервис предоставляет на выбор 5 тарифных планов, в том числе тарифный план «Free» - бесплатный. Естественно, бесплатно доступен урезанный набор функций, которого при этом, в принципе, достаточно для обучения детей разработке мобильных приложений.
Дополнение от 21.09.2024 г.: бесплатный тарифный план ограничивает количество проектов, которое можно хранить в рамках своего аккаунта, десятью проектами. Это довольно важное ограничение и оно очень неудобно.
Дополнение от 24.10.2024 г.: с середины октября функционал, доступный на бесплатном тарифном плане, в очередной раз ограничили: количество хранимых в аккаунте проектов снижено с десяти до трех, количество создаваемых в рамках одного проекта экранов ограничено пятью (раньше не ограничивалось). Вероятно, буду рассматривать перевод курса на веб-сервис «MIT App Inventor». Последний полностью бесплатен, активно развивается и именно из него родился веб-сервис «Thunkable». Но у меня нет опыта работы с «MIT App Inventor», хотя мы используем в обучении известный веб-сервис scratch.mit.edu того же MIT (по-русски «МТИ» - Массачусетский технологический институт).
Веб-сервис «Thunkable» позволяет кроссплатформенную разработку мобильных приложений: для запуска на смартфонах с системой «iOS» и на смартфонах с системой «Android».
Компанию и веб-сервис «Thunkable» создали в 2015 году индиец и китаец, окончившие американский МТИ («Массачусетский технологический институт»). Штаб-квартира компании находится в городе Сан-Франциско (штат Калифорния, США). Во времена студенчества оба участвовали в разработке другой известной среды разработки мобильных приложений «App Inventor» (appinventor.mit.edu). Полученный опыт они положили в основу своего продукта, но внесли и множество своих добавлений и изменений. (Тут мне сразу вспомнились индиец Динеш и китаец Дзан Янг из американского сериала «Silicon Valley» 2014-2019 годов.)
Название веб-сервиса «Thunkable» произносится примерно как «та́нкбл» (понятно, что «th» - это не совсем русская «т»), с ударением на первый слог. В этом можно убедиться, послушав видеоролики на их ютуб-канале (сейчас приходится ради образовательных целей обходить «замедление» ютуба). В английском языке концовка «-able» обычно образует прилагательное из глагола. Слово «thunk» в английском имеет различное значение в разных контекстах. Я не знаю точно, что оно означает в данном случае, но думаю, что в первую очередь тут подразумевается слово «think» («думать» по-русски). То есть «thunkable» - это, полагаю, что-то вроде «имеющий отношение к мысли, размышлению», но с оттенком весёлости.
Маскот платформы - Билли Бивер (Billy Beaver), фамилия переводится на русский как «бобр». Вот как он выглядит:
Регистрация на веб-сервисе
Регистрация на веб-сервисе бесплатная, но обязательная. Есть ряд способов регистрации, из них два основных - регистрация с помощью Google-аккаунта и регистрация с помощью электронной почты. Я регистрировался с помощью электронной почты. Обычно при регистрации нужно придумать псевдоним (логин) и пароль. Тут схема другая: каждый раз при авторизации на веб-сервисе вводишь адрес электронной почты, после чего тебе на почту высылают письмо со ссылкой, по которой следует перейти для входа на веб-сервис.
Таким образом, пароль не нужно придумывать и запоминать, поскольку пароля нет. Ссылка в письме действует в течение 5 минут, потом становится недействующей. Если вы перейдете по этой ссылке в течение 5 минут после ее формирования, то она будет действовать следующие 30 дней и только потом станет недействующей. Это работает только для первого перехода по ссылке, дальнейшие переходы по этой ссылке никак не меняют срок ее действия. Не уверен, что такой способ мне нравится: с одной стороны не нужно возиться с паролем, с другой стороны нужно при каждом входе заходить в свой почтовый ящик (или где-то хранить ссылку из письма), что напрягает.
Не требуется написание кода
Последние годы на Западе (а потом и у нас, как мартышки) форсят понятие «No Coding Required» («не требуется написание кода» или еще близкое по смыслу «не нужно уметь программировать») при разработке приложений.
Понятно, что это изобретение маркетологов, задача которых, как известно, втюхать свой товар как можно большему числу пользователей. Насколько я понимаю, изобретатели данного понятия считают, что пользователи, которые не являются программистами, не купят инструмент разработки приложений из-за того, что считают умение программировать недоступным обычному человеку.
На самом деле, при разработке любых приложений умение программировать необходимо. В данном случае фраза «не требуется написание кода» подразумевает, что не требуется писать код текстом, на текстовом языке программирования. Для программирования на этом веб-сервисе используется визуальный язык программирования, программа составляется из разноцветных блоков. Насколько я понимаю, это один из многочисленных клонов-последователей известного и популярного языка программирования Scratch. По сравнению с текстовыми языками программирования у визуально-блочного языка есть как преимущества (например, отсутствие синтаксических ошибок), так и недостатки (сложно копировать куски кода с одного уровня вложенности на другой; очень трудно и неудобно писать длинные и сложные программы).
Интерфейс веб-среды разработки
Действующая новая версия интерфейса веб-среды разработки имеет название «X», поэтому адрес веб-среды разработки выглядит как «x.thunkable.com». Предыдущую версию интерфейса веб-среды разработки называют «Classic» и, насколько я понимаю, она уже недоступна для новых пользователей веб-сервиса.
Как я понял, у интерфейса «X» веб-среды разработки есть два подвида: «Snap to Place» (StP) и «Drag and Drop» (DnD). Более новым и продвинутым считается подвид «Drag and Drop», который работает по умолчанию. В общем, на это можно особо внимания не обращать, но эти термины встречаются в документации и могут иногда сбить с толку.
Вот как выглядит интерфейс веб-среды разработки на данный момент (по умолчанию), можно кликнуть мышью на изображение, чтобы просмотреть в большем размере:
В данный момент на иллюстрации выше открыт инструмент среды разработки для проектирования интерфейса создаваемого мобильного приложения (в левом верхнем углу окна выбрана вкладка «DESIGN», еще этот инструмент называют «дизайнером»).
Можно видеть, что тут создается мобильное приложение, содержащее три разных экрана (screen), которые видно в центральной части иллюстрации. На экраны помещены изображения, надписи и кнопки. Это интерфейс мобильного приложения, которое мы создавали на первом занятии по данному курсу. Приложение называется «Виртуальный питомец», подобных мобильных приложений существует множество: игрок должен заботиться о своем виртуальном питомце. В нашем случае питомец - котик, которого можно покормить или погладить, нажав на одну из двух кнопок.
Для написания программы для создаваемого мобильного приложения на визуальном языке программирования с помощью разноцветных блоков можно переключиться в левом верхнем углу экрана на вкладку «BLOCKS». Вот как выглядит программирование в данном веб-сервисе:
На иллюстрации выше видно, каким образом запрограммированы две кнопки на первом экране создаваемого мобильного приложения. При нажатии (клике мышью с настольного персонального компьютера или тычке пальцем по экрану смартфона) на каждую из этих кнопок происходит переход на один из двух других экранов приложения.
Тестирование мобильного приложения
Нажав на первую слева из кнопок в меню в верхнем правом углу экрана среды разработки, откроем текущий экран мобильного приложения для тестирования прямо тут же, в браузере. Это можно сделать в любой момент и это очень удобно.
Другая возможность тестирования еще интереснее: она позволяет быстро запустить создаваемое мобильное приложение на вашем смартфоне. Для этого нужно сначала установить на смартфон бесплатное мобильное приложение «Thunkable Live» (оно есть как в магазине приложений «Google Play», так и в магазине приложений «App Store»). После установки это приложение нужно запустить и сформировать текстовый код (для тех, кто зарегистрировался на веб-сервисе «Thunkable» с помощью электронной почты; для зарегистрировавшихся через Google-аккаунт тестирование тоже возможно, но я сам это не проверял). После этого следует нажать на вторую слева кнопку в меню в верхнем правом углу экрана среды разработки на компьютере и в открывшемся окошке ввести сформированный на смартфоне текстовый код (он состоит из 7 символов). Создаваемое мобильное приложение откроется в внутри приложения «Thunkable Live», можно нажимать на кнопки и так далее. Тоже очень удобно.
Публикация мобильного приложения
К сожалению, в рамках бесплатного тарифного плана вы имеете только две возможности: 1) выслать себе на электронную почту архив с файлами созданного мобильного приложения (я пробовал только в формате APK [Android Package Kit] для системы «Android»), всё получилось. Этот архив вы можете при желании распространять самостоятельно. 2) Вы можете поделиться (share) ссылкой на созданное мобильное приложение, при этом тот, кому вы передадите ссылку, сможет перейти по ней, только если зайдет в свой аккаунт на веб-сервисе «Thunkable». Перешедший по полученной от вас ссылке сможет либо напрямую свободно редактировать ваш проект, либо (если вы передали ссылку на «страницу проекта») - просмотреть ваш проект в режиме «только для чтения» (при этом он имеет возможность скопировать ваш проект к себе в аккаунт и после этого сможет вносить в свою копию любые изменения).
В рамках бесплатного тарифного плана вы можете создавать проекты только вида «Public» (ваше приложение сможет запустить и скопировать кто угодно). Проекты вида «Private» (доступные только вам) можно создавать лишь в рамках платных тарифных планов.
Удобная публикация проекта доступна только в рамках платных тарифных планов, под такой публикацией я подразумеваю две возможности: 1) веб-публикация проекта, при этом проект хостится на сервере веб-сервиса «Thunkable», как будто это обыкновенный сайт; 2) публикация проекта в магазинах приложений «Google Play» и «App Store».
Заключение
В целом веб-сервис «Thunkable» мне пока что нравится, но я с ним еще мало работал. Для обучения детей разработке мобильных приложений вполне подходит, если ограничиться тестированием приложения в веб-среде разработки или в рамках приложения «Thunkable Live» на смартфоне.
О недостатках. Как я понял, нельзя поделиться веб-ссылкой на созданное мобильное приложение с человеком, у которого нет аккаунта на веб-сервисе «Thunkable». Я привык, что такая возможность обычно есть на веб-сервисах бесплатно (на данном веб-сервисе можно опубликовать созданное приложение в виде веб-версии, как обычный сайт в интернете, но это платная функция, как я уже упоминал выше).
Также стоит иметь в виду ограничение количества хранимых в рамках аккаунта проектов десятью тремя проектами - это затрудняет обучение, этого слишком мало, недостаточно для обучения; для обучения имеет смысл рассмотреть переход на альтернативные веб-сервисы, например, на «MIT App Inventor»).