Начните работу с созданием приложений

Добро пожаловать в Tulip

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

Добро пожаловать в Tulip!

Tulip - это платформа без кода, созданная для уникальных потребностей передовых производственных предприятий. С помощью Tulip вы можете разрабатывать надежные, композитные решения для самых сложных производственных задач. Это руководство посвящено основам платформы Tulip. Мы рассмотрим основные возможности, места и концепции, а также вместе создадим простое приложение "Hello World".

:::(Информация)(ПРИМЕЧАНИЕ:)
Эта статья предполагает, что у вас есть доступ к инстансу Tulip. Если у вас его нет, вы можете получить доступ, начав бесплатную пробную версию{target="_blank"}, или связавшись с человеком или группой, которые управляют доступом к Tulip для вашей организации.
:::

Ресурсы, которые помогут вам в обучении

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

База знаний{target="_blank"}.

База знаний - это коллекция статей, видео и документации, которые помогут вам научиться пользоваться Tulip. Если вы читаете эту статью, значит, вы уже нашли ее. Отлично!

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

Университет Тюльпана{target="_blank"}.

Tulip University - это бесплатный ресурс для изучения Tulip по требованию. Tulip University содержит десятки курсов, сертификаций и заданий по созданию приложений, которые помогут вам перейти на новый уровень создания приложений. Сделайте первые шаги, записавшись на курс Tulip Essentials{target="_blank"}, отработайте навыки в Tulip Challenges и поделитесь своими достижениями, став Tulip Certified App Builder{target="_blank"}.

Библиотека{target="_blank"}.

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

Сообщество{target="_blank"}.

У вас есть вопросы, но вы не можете найти ответ в Базе знаний или Университете? Есть идея для функции, которая сделает вашу жизнь в 100 раз проще? Нужен способ быть в курсе всего самого нового и интересного в Tuliverse? Загляните в Tulip Community.

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

Ориентирование - быстрый тур по вашему экземпляру

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

• Приложения и редактор приложений
• Столы
• Торговый зал
• Приборные панели
• Настройки учетной записи

Мы можем рассмотреть каждый из них по очереди.

Приложения и редактор приложений

Страница приложений

Когда вы войдете в свою учетную запись, вы окажетесь на главном экране Apps. Здесь вы можете просматривать и управлять всеми приложениями в вашем экземпляре.

Чтобы найти эту страницу, наведите курсор на "Apps" в верхней навигационной панели и нажмите "Apps" в выпадающем меню.

{height="" width="" width="" }

Домашний экран приложений и редактор приложений

Редактор приложений - это место, где вы будете создавать приложения. Чтобы попасть в редактор приложений, вы можете выбрать существующее приложение или создать новое. Нажмите на свое приложение. На этом экране вы можете просмотреть данные о завершении приложения, управлять {{glossary.Permission}} и {{glossary.Approval}}, а также опубликовать версию вашего приложения.

Нажмите на любой шаг в этом меню, и вы перейдете в редактор приложения.

{height="" width="" width=""}

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

::::(Информация)(ПРИМЕЧАНИЕ:)
Для подробного знакомства с редактором приложений ознакомьтесь с этой статьей.
:::

Давайте рассмотрим 4 ключевых инструмента в редакторе приложений:

• Интерфейс перетаскивания
• Панель инструментов
• Контекстная панель
• Панель шагов и записей

Интерфейс перетаскивания

В центре экрана находится интерфейс перетаскивания - ваш чистый лист.

{height="" width="" width="" }

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

Панель инструментов

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

Контекстная панель

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

Панель шагов и записей

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

{height="" width="" width=""}

Таблицы

Таблицы - это пользовательские базы данных, которые вы создаете для хранения данных, собираемых вашими приложениями.

{height="" width="" width="" }

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

:::(Информация)(ПРИМЕЧАНИЕ:)
Для получения краткого обзора создания приложений с таблицами попробуйте пройти курс"Создание простого приложения для ввода данных{target="_blank"}" в университете. Таблицы также подробно рассматриваются в других разделах Базы знаний{target="_blank"}.
:::

Чтобы найти таблицы, перейдите на вкладку "Приложения" в верхней навигационной панели и выберите "Таблицы" из выпадающего списка.

На главном экране "Таблицы" у вас будет возможность просмотреть существующую таблицу или создать новую.

Торговый зал

Вкладка Shop Floor используется для управления станциями и физическими устройствами, связанными с вашим экземпляром Tulip. На вкладке Shop Floor вы найдете опции для создания и управления станциями, управления пограничными устройствами, машинами и Tulip Vision.

Сейчас давайте сосредоточимся на "Станциях". Когда вы нажмете "Станции", вы попадете на страницу, где вы создадите станции и назначите на них приложения - важный шаг в рабочем процессе публикации.

::::(Информация)(ПРИМЕЧАНИЕ:)
Вы можете узнать больше о станциях в Базе знаний и в Tulip University{target="_blank"}
:::

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

Приборные панели

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

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

Важно отметить, что приборные панели можно экспортировать в виде URL-адреса и поделиться ими с любым человеком, независимо от того, есть ли у него аккаунт в Tulip.

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

Настройки учетной записи

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

Tulip Player

Одна из самых важных частей Tulip - Tulip Player - не находится в вашем веб-экземпляре.

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

Чтобы загрузить Tulip Player, перейдите по этой ссылке. Инструкции по установке и настройке смотрите здесь

Создание приложений

Теперь, когда вы можете ориентироваться в своем экземпляре, давайте пройдем краткий курс по созданию приложений. Нет лучшего способа сделать это, чем создать приложение вместе. Итак, откройте свой экземпляр и давайте вместе создадим приложение "Hello World".

Создание нового приложения

Первое, что нам нужно сделать, это создать новое приложение. Для этого перейдите в раздел "Apps" платформы, используя меню "Apps" в верхней навигационной панели.

Там нажмите кнопку "Создать приложение" в правом верхнем углу. Затем появится модальное окно, которое спросит вас, хотите ли вы создать новое приложение или начать с шаблона. Мы рекомендуем вам поиграть с различными доступными шаблонами, но пока давайте начнем с пустого приложения, нажав "создать" в правом нижнем углу модального окна.

Вы попадете на главный экран приложения, где вы будете управлять настройками этого приложения. Назовите свое приложение "Hello World", нажав на карандаш рядом с надписью "Untitled App" в левом верхнем углу. Затем нажмите на любой шаг, и вы перейдете в редактор приложения.

Создание приложения "Hello World"

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

• Проектирование пользовательского интерфейса
• Добавление логики
• Тестирование

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

Проектирование пользовательского интерфейса приложения

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

::::(Информация)(ПРИМЕЧАНИЕ:)
Проектирование пользовательского интерфейса подробно рассматривается в Tulip University{target="_blank"}.
:::

На данный момент, давайте оставим все как есть. Мы собираемся добавить 4 элемента в наш пользовательский интерфейс:

• Форма для создания строки заголовка
• Переменная, отображающая название приложения
• Кнопка меню
• Кнопка, при нажатии на которую отображается сообщение "Hello World".

Разработка базового макета

Базовые макеты - это шаблоны проектирования, которые применяются к каждому шагу в вашем приложении.

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

Чтобы перейти к базовому макету, нажмите на текст "Базовый макет" в левом нижнем углу редактора приложений. Вы узнаете, что редактируете базовый макет, когда фон за текстом будет выделен светло-голубым цветом.

Чтобы добавить полосу заголовка, перейдите в меню "Активы" на панели инструментов и выберите опцию "прямоугольник". Если он не виден сразу, найдите "rectangle" в строке поиска.

Когда вы выберете "прямоугольник", вы увидите, что в область песочницы редактора приложения была добавлена фигура. Нажмите на фигуру, чтобы выбрать ее. На правой панели вы увидите опции для настройки параметров актива. Измените цвет на темно-серый. Настройте параметры виджета так, чтобы его размеры составляли 1920w x 100h, или просто перетащите его на место так, чтобы он занимал всю верхнюю часть приложения.

Добавление названия шага в верхнюю навигационную панель

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

Для этого нажмите на меню "Текст" на панели инструментов и выберите "Переменная" из выпадающего списка. В качестве альтернативы можно воспользоваться сочетанием клавиш и просто нажать "V".

Переменные в Tulip - это держатели для значений. Когда вы выбираете отображение переменной, ваше приложение отобразит значение, которое в данный момент хранится в этой переменной.

Чтобы получить доступ к имени шага, нам нужно настроить нашу переменную.

Убедитесь, что выбрана встроенная переменная, и перейдите к панели виджетов на правой панели. В разделе "Источник данных" выберите "App Info". Выберите "Имя шага" из выпадающего списка "Select App Info".

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

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

Последнее, что нам нужно сделать, это назвать наш шаг. Дважды щелкните на "Шаге без названия" в левой панели "Шаги" и переименуйте шаг в "Hello World".

Добавление кнопки меню

Используя меню "Кнопки" на панели инструментов, добавьте кнопку Меню в ваше приложение. Перетащите ее на место в левом или правом верхнем углу верхней панели.

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

Добавление кнопки Hello World

Используя меню "Кнопки" на панели инструментов, добавьте кнопку в ваше приложение. Отцентрируйте ее на макете.

В следующем разделе мы добавим логику к этой кнопке.

Добавление логики в приложения

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

Структура логики в Tulip

Логические утверждения в Tulip следуют одной и той же схеме: When → If → Then.

{height="" width=""}.

Когда происходит событие, Если выполняются или не выполняются определенные условия, Тогда приложение выполняет заданные действия.

Триггер для нашего приложения "Hello World" будет следовать этой же структуре.

Когда пользователь нажимает кнопку, приложение выводит сообщение "Hello World". Мы не будем вставлять в этот триггер никаких условных операторов.

Где вы добавляете триггеры в Tulip

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

• в виджеты, такие как кнопки и интерактивные таблицы
• В шаги, для таких действий, как "при открытии шага", "при закрытии шага" или "когда устройство срабатывает".
• В приложениях, для действий типа "когда приложение открывается".
• Создайте свой первый триггер

Давайте напишем наш первый триггер.

Наш триггер будет делать две вещи:

1. хранить строку текста в переменной
2. Отображать сообщение, содержащее эту переменную.

Когда вы закончите, он должен выглядеть следующим образом:

{height="" width=""}.

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

Дайте своему триггеру имя, например, "Печать Hello World".

Поскольку этот триггер прикреплен к кнопке, мы позаботимся об операторе WHEN: КОГДА кнопка будет нажата.

Поэтому наша задача - написать операторы действия, THEN. Давайте начнем с сохранения строки текста в переменную.

Нажмите "Добавить новое действие". В выпадающем меню выберите "Манипуляция данными", а затем "Сохранить". В этом действии нам нужно указать, какие данные мы хотим сохранить и где. В выпадающем меню после "Data:" выберите "static value", а затем "Text". Мы поместим наше сообщение в это статическое значение. В поле ввода напишите сообщение "Hello World".

Следующая часть этого триггера - определение "location:", или места, где будут храниться ваши данные. Выберите "Переменная" из выпадающего списка, а затем выберите создание новой переменной. Дайте вашей переменной имя, например, "Hello World Variable", и нажмите на зеленую галочку.

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

Поэтому нажмите "Добавить новое действие" и выберите "Показать сообщение" из выпадающего списка. Последнее, что нам нужно сделать, это указать, какие данные будут в сообщении. Поскольку мы уже создали переменную, вы можете выбрать "Переменная" из выпадающего списка, а затем выбрать переменную "Hello World".

Сохраните триггер. Теперь вы готовы протестировать свое приложение.

Тестирование приложения

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

Открыв режим разработчика, вы можете протестировать свое приложение. Нажмите кнопку "Начать", а затем нажмите кнопку. В нижней части экрана должно появиться сообщение "Hello World".

Публикация приложения

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

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

Чтобы опубликовать приложение, вернитесь в редактор приложений. Нажмите кнопку "опубликовать" в правом верхнем углу экрана. Появится модальное окно с предложением прокомментировать, что изменилось в этой версии. Добавьте любой комментарий. Комментарии станут более важными, когда вы начнете работать в масштабе, но пока вы можете оставить их простыми. Затем нажмите "Опубликовать версию 1".

Что вы создаете с помощью Tulip

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

Ответ, конечно же, зависит от ваших операционных потребностей. Многие пользователи ставят перед Tulip конкретные задачи, такие как:

• Сокращение ошибок при ручной сборке
• отслеживание времени работы и простоя оборудования
• Повышение прозрачности производства
• Упрощение генеалогии продукции в условиях высокой степени смешивания.

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

• Цифровые рабочие инструкции
• Мониторинг оборудования
• Отслеживание производства
• Прослеживаемость и генеалогия

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

::::(Информация)(ПРИМЕЧАНИЕ)
Узнайте, как выбрать свой первый сценарий использования в этом {target="_blank"} курсе Tulip University.
:::

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

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