Платформа AppSheet – одно из популярных средств разработки приложений так называемого низкого кода (LCDP). В отличие от традиционного программирования, где все делается в текстовом редакторе, на языках вроде C++, Python или Java, тут используется специальный графический интерфейс.

Приложения AppSheet упрощают ввод и обработку данных на любых платформах, в них можно использовать бесконтактную передачу данных NFC или QR-коды. Это расширяет возможности обычных электронных таблиц, превращая их в современную и мобильную систему учета, например, для малого бизнеса.

Создаем приложение за 8 шагов

Наша цель сейчас – просто изучить работу с AppSheet, поэтому попробуем самостоятельно создать небольшую кросс-платформенную CRM-систему. Она должна использовать данные из таблиц Excel, добавлять в них новых клиентов, заполнять и редактировать информацию, ставить задачи сотрудникам и помогать контролировать дедлайны.


1. Создаем данные

Для работы нашему приложению необходимы данные, поэтому начнем с создания таблицы с заголовками, используя для этого «Google Таблицы». Советую давать листам осмысленные названия, , чтобы в процессе работы в них не запутаться.

Какого рода должны быть данные? На самом деле любые. Давайте представим,что у нас B2B компания, которая продает свои услуги другим предприятиям. Поэтому создадим для нашей CRM таблицу с названием компаний-клиентов, адресами их сайтов, e-mail и ссылками на чаты.

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

2. Создаем приложение

Заходим на официальный сайт AppSheet. Регистрируемся и нажимаем Start for free. После того, как выберете подходящее облачное хранилище, открывается выбор из трех категорий приложений. Вкладка Start with your own data позволит создать собственное приложение с нуля. На нее и жмем.

Интерес также представляет вкладка Start with sample app. Она позволяет использовать готовые приложения или просто заглянуть под капот некоторых интересующих вас фич.

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

Обратите внимание на кнопки View и Data. Если их использовать при настройке данных и видов, можно переключаться быстрее. Этот маленький лайфхак сбережет вам кучу времени.

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

3. Разбираемся с ключами

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

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

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

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

  • Если значений мало, можно просто присвоить случайные значения нашим ID.
  • Если много – использовать генераторы паролей. Однако, массово копировать их не всегда удобно

Но это не все – сейчас программа выдает ошибку. Помните, мы обсуждали, что при добавлении новых данных, приложение ломается? Дело в том, что добавив в Google-таблицу новую колонку, вы не сообщили об этом приложению. Это можно сделать, нажав Data – Column – Regenerate Structure.

Теперь отмечаем новую строчку ID как ключ, а значение Label оставляем там же. Label – это этикетка. Этот параметр помогает распознать название ключа. В данном случае наша этикетка – название компании.Раскрываем строку ID и добавляем формулу UNIQUEID() в строчку Initial value. Если этого не сделать при добавлении новой компании, значение ID будет пустым. Не забываем скрыть ID. Это техническая информация, ее не нужно отображать пользователям. Для этого убираем флажок с Show. Пробуем ввести новую компанию – теперь название можно редактировать. Сейчас в нашей базе автоматически сформирован новый ID. Механизм создания ключей всегда одинаков, а сами ключи нужны практически везде.

4. Добавляем возможность ставить задачи

Иногда необходимо контролировать выполнение задач. Это удобно делать в файле с базой компаний-клиентов.Создадим специальный раздел в нашем приложении. Для этого нам понадобится еще одна таблица с данными.

Теперь разберемся, в чем разница между ID задачи и обычным ID. Важно понимать, что ID задачи – это уникальное значение, которое отличает одну задачу от другой и не путать с просто ID, который нужен для присвоения задачи конкретному клиенту. В нашем случае это компания.
Присоединяем данные в приложение. Для этого заходим в раздел Data и жмем Add new table.

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

На страничке компании ничего не изменилось и связи с задачами не возникло. Нужно настроить. Для этого перейдем в настройки строчки ID, в поле Type меняем тип на Ref, а в Source table выбираем «База компаний».

Настроим корректное отображение. Сейчас вкладка с задачами представляет собой набор непонятных символов.

Возвращаемся во вкладку «Задачи» и меняем следующие пункты:

  • Переставляем Label на раздел «Задача».
  • Скрываем при необходимости вкладку «Дата постановки задачи», она будет заполняться сама.
  • Скрываем вкладку «ID задачи», это техническая информация. Приложение само распознало колонку «ID задачи»» как колонку с ключами, поэтому прописывать ничего не нужно. Стоит лишь проверить, чтобы в поле Initial value была формула UNIQUEID(). Если ее нет, то пропишите.
  • Заходим в настройки колонки ID, находим раздел DISPLAY. В Display name прописываем имя строки. В данном случае, это «Компания».

На страничке компаний задачи тоже приняли понятный вид

5. Добавляем сотрудников

Давайте сделаем так, чтобы задачи присваивались конкретным сотрудникам. Для этого создадим таблицу с сотрудниками. Сюда включим имя и фамилию, номер телефона, фото.Добавляем таблицу в приложение. В данном случае ID – это имя сотрудника. Если имена повторяются, присваиваем каждому свой ID. Добавляем связь между сотрудниками и задачами. Для этого переходим в таблицу с задачами и добавляем новую колонку с сотрудниками.

Обновляем таблицу в приложении. В таблице «Задачи» меняем тип данных в колонке «Сотрудник» на ref и ссылаемся на таблицу с сотрудниками. Теперь у нас появилась необходимая связь.

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

Далее обновляем таблицы «Задачи» и «Сотрудники» в приложении с помощью клавиши Regenerate Structure. Теперь задача присвоена конкретному сотруднику. Следом сделаем так, чтобы каждый сотрудник видел только свои задачи. Переходим Data – User Settings. Открываем любой раздел, например, Option 1. Обязательно включаем раздел Show?, делаем type «Enum» и прописываем ссылку «Сотрудники[сотрудник]». Теперь в приложении появилась возможность зайти как сотрудник.

Мы почти у цели. Переходим Data – Table – Таблица «Задачи» – Security – Security filter. В строке вставляем формулу: «[Сотрудник] = USERSETTINGS(Пользователь)». После сохранения сотрудник сможет выбрать свое имя в настройках, и будут высвечиваться только персональные задачи.

6. Настраиваем пользовательский интерфейс

Теперь надо, чтобы все выглядело красиво. Для этого используем вкладку UX. Переходим UX – VIEWS. Выбираем раздел «База компаний». Убираем лишние кнопки из данного вида. Для этого находим строчку Column order и меняем порядок расположения элементов так, как нам нужно.

Чтобы поменять иконки, нужно в DISPLAY найти раздел icons, а там уже можно выбрать необходимую иконку. Точно так же настраиваем вид «Задачи». Добавим еще один вид – «Сотрудники». Для этого выбираем тип Desk, а в самом приложении подгружаем фотографии сотрудников.

Для того, чтобы настроить необходимые кнопки, заходим в раздел Action. Иконки меняем в Display, в разделе icons.

Теперь сделаем так, чтобы выполненные задачи скрывались и, если сегодня дедлайн, высвечивалось бы напоминания. Для этого переходим в Data – Slice и жмем кнопку Add New Slice. Всего у задач три статуса: активная, задача завершена или отложена. Давайте сделаем так, чтобы завершенные задачи скрывались из отображения. Прописываем формулу: OR([Статус задачи] = "Активная", [Статус задачи]="Отложена"). После переходим в UX во вкладку Views. Там находим вкладку Задачи. Подменим данные в вкладке For this data с «Задачи» на только что созданный Slice «Актуальные задачи». Теперь выполненную задачу можно легко скрыть, изменив статус.

Чтобы активные и отложенные задачи разделялись в табличном виде, сгруппируем их. Для этого перейдем в вкладку Views меню настройки UX. Найдем там раздел Group by и сгруппируем по статусу задачи. Группировка появилась. Теперь добавим выделение задачи, если у них сегодня дедлайн. Для этого переходим UX – Format rules – Add new rules. В строке формулы прописываем: «[Дедлайн]=Today()». Отмечаем колонку задачи, выбираем иконку и цвет.

7. Русифицируем. Добавляем логотип и название

Теперь осталось русифицировать наше приложение. Для этого переходим UX – Localize, там переводим названия. Изменим логотип. Для этого переходим UX – Brand. Во вкладке App logo прикрепляем ссылку на свой логотип или выбираем системное лого.

Теперь меняем название приложения. Это делается в разделе Info – Properties. В поле Short name коротко прописываем название. Не старайтесь делать его длинным, оно не поместится на экране телефона.

8. Устанавливаем на телефон и смотрим, что у нас получилось

Чтобы установить созданное нами приложение на телефон, скачиваем AppSheet в App Store или Google Play. Заходим в него и видим список всех созданных вами приложений, находим там нашу CRM. Переходим в нее и нажимаем в настройках Add Shortcut. Теперь логотип нашего приложения появился на рабочем столе.

Итак, мы с вами создали свою простейшую CRM для любых устройств на основе «Google Таблиц». Можем добавлять в нее любые компании, отправлять письма, ставить и скрывать выполненные задачи. А если сегодня дедлайн, информация будет выделяться. Все задачи закреплены за сотрудниками, им можно звонить и отправлять СМС.
Made on
Tilda