Создавайте хайку о продуктах Google с помощью PaLM API и Flutter.

1. Прежде чем начать

Одним из самых впечатляющих прорывов в области машинного обучения (МО) является генеративный искусственный интеллект (ИИ), способный создавать потрясающие изображения, текст, аудио и даже видео на основе простых текстовых запросов или подсказок от пользователей. В частности, с выпуском API PaLM компания Google предоставляет разработчикам возможность создавать категории приложений с восхитительным пользовательским интерфейсом, переосмысленным с помощью технологии PaLM.

В этом практическом задании вы создадите приложение, использующее API PaLM для генерации хайку на основе названий продуктов Google. Вы также используете Flutter для создания кроссплатформенного приложения, отображающего хайку.

Предварительные требования

• Базовые знания больших языковых моделей (LLM), таких как подсказки.
• Базовые знания разработки на Flutter с использованием Dart.

Что вы узнаете

• Как использовать API PaLM от Google.
• Как создать кроссплатформенное Flutter-приложение для отображения результатов.

Что вам понадобится

• Flutter SDK
• Текстовый редактор , например, Visual Studio Code (VS Code).
• Настройка VS Code для Flutter и Dart
• Настройка Flutter для Android или iOS (включая эмуляторы и симуляторы)
• Настройка рабочего стола для Flutter под Windows, Linux или macOS
• Настройка веб-сайта для Flutter
• Ключ API для PaLM API

2. Настройка

Скачайте стартовый код

1. Перейдите в этот репозиторий GitHub .
2. Нажмите «Код» > «Скачать zip-архив» , чтобы загрузить весь код для этого практического занятия.
3. Распакуйте загруженный zip-файл, чтобы получить корневую папку codelabs-main . Вам понадобится только подкаталог haiku-generator , который содержит следующие папки:

• Папки step0 – step3 содержат исходный код, на основе которого вы будете строить каждый шаг в этом практическом занятии.
• Папка finished содержит готовый код для готового демонстрационного приложения.

Загрузите зависимости проекта.

1. В VS Code нажмите Файл > Открыть папку > codelabs-main > haiku_generator > step0 > lib > main.dart .
2. Если в диалоговом окне VS Code появляется запрос на загрузку необходимых пакетов для стартового приложения, нажмите « Получить пакеты» .

3. Если вы не видите диалоговое окно VS Code с запросом на загрузку необходимых пакетов для стартового приложения, откройте терминал, перейдите в папку step0 и выполните команду flutter pub get .

Запустите стартовое приложение

1. В VS Code убедитесь, что эмулятор Android или симулятор iOS правильно настроен и отображается в строке состояния.

Например, вот что вы увидите, когда используете Pixel 5 с эмулятором Android:

Вот что вы увидите при использовании iPhone 13 с симулятором iOS:

2. Нажмите Начните отладку . Приложение запустится на вашем эмуляторе Android или симуляторе iOS.

Ознакомьтесь с приложением для начинающих.

В стартовом приложении обратите внимание на следующее:

• Пользовательский интерфейс довольно прост.
• В выпадающем меню пользователи могут выбрать конкретный продукт Google.
• После того, как пользователь нажмет кнопку « Сгенерировать хайку!» , приложение Flutter отправит встроенный запрос на конечную точку API PaLM, которая сгенерирует хайку.
• Приложение отображает сгенерированные хайку в текстовом виджете после получения ответа. Однако, если вы выберете «Сгенерировать хайку!» , ничего не произойдет, поскольку приложение пока не может взаимодействовать с API PaLM.

3. Настройте доступ к API PaLM.

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

• Для настройки доступа к API PaLM следуйте инструкциям в документации по созданию ключа API, а затем запишите этот ключ для дальнейшего использования в этом практическом занятии.

4. Добавьте меню продуктов Google.

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

Чтобы добавить список продуктов Google в приложение, выполните следующие действия:

1. В VS Code перейдите к файлу step1/lib/data/repositories/product_repository_impl.dart .
2. В тело функции getAllProducts() добавьте следующую переменную, которая будет хранить массив названий продуктов Google:

product_repository_impl .dart

var productData = [
  {'productName': 'Google Search'},
  {'productName': 'YouTube'},
  {'productName': 'Android'},
  {'productName': 'Google Maps'},
  {'productName': 'Gmail'}
];

5. Отправьте запрос к API PaLM и расшифруйте ответ.

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

Context: You are an awesome haiku writer. 
Message content: Write a cool haiku about {product name}.

Чтобы отправить этот запрос на конечную точку API PaLM для генерации хайку, выполните следующие шаги:

1. В VS Code перейдите к файлу step2/lib/data/repositories/poem_repository_impl.dart .
2. В тело функции getPoems() добавьте следующий код:

poem_repository_impl.dart

// TODO: Replace YOUR_API_KEY with your API key.
var apiKey = 'YOUR_API_KEY';
const haikuCount = 5;

final url = Uri.parse(
   'https://generativelanguage.googleapis.com/v1beta2/models/chat-bison-001:generateMessage?key=$apiKey');
final headers = {'Content-Type': 'application/json'};
final body = jsonEncode({
 "prompt": {
   "context": "You are an awesome haiku writer.",
   "examples": [
     {
       "input": {"content": "Write a haiku about Google Photos."},
       "output": {
         "content":
             "Google Photos, my friend\nA journey of a lifetime\nCaptured in pixels"
       }
     }
   ],
   "messages": [
     {"content": "Write a cool haiku for $productName"}
   ]
 },
 "candidate_count": haikuCount,
 "temperature": 1,
});

try {
 final response = await http.post(url, headers: headers, body: body);
 if (response.statusCode == 200) {
   final decodedResponse = json.decode(response.body);
   String haikus = 'Here are $haikuCount haikus about $productName:\n\n';
   for (var i = 0; i < haikuCount; i++) {
     haikus += '${i + 1}.\n';
     haikus += decodedResponse['candidates'][i]['content'] + '\n\n';
   }
   return haikus;
 } else {
   return 'Request failed with status: ${response.statusCode}.\n\n${response.body}';
 }
} catch (error) {
 throw Exception('Error sending POST request: $error');
}

Замените строку YOUR_API_KEY на ваш API-ключ, полученный ранее.

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

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

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

6. Запустите приложение на мобильных платформах.

1. В VS Code установите целевое устройство на Android или iOS.
2. Нажмите Начните отладку , а затем дождитесь загрузки приложения.
3. Выберите товар из выпадающего меню, а затем нажмите «Создать хайку!» . Приложение отобразит хайку о выбранном товаре.

7. Запустите приложение на настольных платформах.

Помимо Android и iOS, Flutter также поддерживает настольные платформы, включая Linux, macOS и Windows.

Запустите приложение на Linux

1. В VS Code установите целевое устройство на Linux (linux-x64) .
2. Нажмите Начните отладку , а затем дождитесь загрузки приложения.
3. Выберите продукт из выпадающего меню, а затем нажмите «Создать хайку!» .

Запустите приложение на macOS

Для macOS необходимо настроить соответствующие права доступа, поскольку приложение отправляет HTTP-запросы на серверную часть. Дополнительную информацию см. в разделе «Права доступа и песочница приложений» .

Чтобы запустить приложение на macOS, выполните следующие действия:

1. В файлы step3/macos/Runner/DebugProfile.entitlements и step3/macos/Runner/Release.entitlements добавьте следующий код:

DebugProfile.entitlements | Release.entitlements

<key>com.apple.security.network.client</key>
<true/>

2. В VS Code установите целевое устройство на macOS (darwin) .
3. Нажмите Начните отладку , а затем дождитесь загрузки приложения.
4. Выберите продукт из выпадающего меню, а затем нажмите «Создать хайку!» .

Запустите приложение в Windows

1. В VS Code установите целевое устройство на Windows (windows-x64) .
2. Нажмите Начните отладку , а затем дождитесь загрузки приложения.
3. Выберите продукт из выпадающего меню, а затем нажмите «Создать хайку!» .

8. Запустите приложение на веб-платформе.

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

Для запуска приложения на веб-платформе выполните следующие действия:

1. В VS Code установите целевое устройство на Chrome (web-javascript) .
2. Нажмите Начните отладку , а затем дождитесь загрузки приложения в Google Chrome.
3. Выберите продукт из выпадающего меню, а затем нажмите «Создать хайку!» .

9. Поздравляем!

Вы создали полнофункциональное приложение, генерирующее хайку о продуктах Google! Хотя приложение генерирует хайку только для некоторых продуктов Google, вы можете легко изменить подсказку и сгенерировать нужный текст. Теперь, когда вы знаете, как использовать API PaLM, вы можете создавать потрясающие приложения, используя невероятные возможности LLM!

Узнать больше

• PaLM API и MakerSuite: доступный способ начать прототипирование и создание приложений с генеративным искусственным интеллектом.
• Google Generation AI
• Порхание