Add Gemini capabilities to your Android app

1. Before you begin

The Gemini API gives you access to generative AI models from the Gemini family. It will enable you to build new experiences that until now have not been available.

This codelab walks you through the process of adding summarization capabilities to the Jetnews application. Jetnews is a news reading app built with Jetpack compose part of the compose-samples repository.

JetNews application in action

In this Codelab, you will:

  • Craft a prompt to summarize news articles in Vertex AI studio,
  • Integrate the Vertex AI in Firebase SDK to Jetnews,
  • Add a "Gemini summary" section at the top of the article view and a "summarization" button in the bottom bar

7eee9f1dcad682c.png

Jetnews with the summarization feature powered by the Gemini API

Prerequisites

  • Basic Kotlin knowledge.
  • Familiarity with how to use Android Studio and test apps in an emulator or physical device running Android API level 21 or higher.
  • A Google account to access Firebase.

2. Prompt design

The prompt is the message sent by your application to the Gemini model via the Gemini API. It can include text, images, audio and video files.

Crafting the ideal prompt for a specific use-case is more art than science, and it often requires multiple iterations. Vertex AI Studio is a great tool to craft your prompt:

For this example, you'll create a text prompt in Vertex AI Studio. Open Vertex AI Studio, and then click Freeform in the left navigation.

52e11cb6e67d7199.png

In this example, you will summarize the content of a technical article into 4 bullet points. Your goal shall be to make sure that the summary is relevant and in plain text without any Markdown formatting.

After a few iterations, we found a prompt that works particularly well:

Summarize the core findings of the following article in 4 concise bullet points. Ensure each bullet point is specific, informative and relevant. Return just the bullet points as plain text. Don't use markdown.

[article body]

Once you are satisfied with the output, integrate the Gemini API to the Android application.

3. Code checkout

Start by checking out the starter source code from Github:

git clone https://github.com/android/codelab-gemini-summary

The JetNews app is designed from the ground up to follow Android architecture best practices and to scale well across any mobile device big or small.

Read more about Jetnews implementation approach to support large screens.

If the source code of the Jetnews app is overwhelming, don't worry. To add the summarization feature powered by Gemini, you will only modify the code in the GeminiRepositoryImpl class. The code that triggers summarization and surfaces the summary in the app is already implemented for you.

Final implementation

You can directly access the final implementation of the source code by checking out the branch:

git clone https://github.com/android/codelab-gemini-summary
git switch final

You will have to follow the steps detailed in step 4 to set up your Firebase project.

4. Set up your Firebase project

Create a Firebase project

Create a firebase project in the Firebase console. Create a new Firebase project by entering a new project name in the first step of the "Create project" workflow. The underlying Google Cloud project is created automatically.

In your project, go to the Build with Gemini page to do the following:

Connect your app to Firebase

Now that your Firebase project is created, connect your Android application to Firebase. In the Firebase console select your project and click on "Add app" and select "Android" and register the app by providing the app's package.

Then, download the google-services.json file and add it to your application.

Follow the Firebase setup instructions to add the Google Services gradle plugin and the Firebase Bill of Materials (BoM) gradle dependencies.

Alternative: use Firebase Assistant in Android Studio

Alternatively, you can also use Firebase Assistant. It lets you register your app with a Firebase project and adds the necessary Firebase files, plugins, and dependencies to your Android project all from within Android Studio!

5. Update Gradle imports

The Jetpack app uses the Gradle version catalogs feature, which helps centralize versions of the dependencies.

To add the gradle import for the Vertex AI in Firebase, add the following to libs.versions.toml:

[versions]
...
vertexai = "16.0.0-beta04"


[libraries]
...
firebase-vertexai = { module = "com.google.firebase:firebase-vertexai", version.ref = "vertexai"}

Then, update build.gralde.kts:

implementation(libs.firebase.vertexai)

Finally, click on "Sync now" to fetch the gradle artifacts.

If you don't want to use Gradle version catalogs you can directly add the import in build.gradle.kts:

implementation("com.google.firebase:firebase-vertexai:vertexai:16.0.0-beta04")

6. Kotlin integration

Now that the proper dependencies are added, update the Kotlin code.

Open the GeminiRepositoryImpl class. This class will host all the code interacting with the Gemini API.

Gemini model initialization

Instantiate the GenerativeModel:

private val generativeModel = Firebase.vertexAI.generativeModel(
   "gemini-1.5-flash",
   generationConfig = generationConfig {
      temperature = 0f
   },
      safetySettings = listOf(
         SafetySetting(HarmCategory.HARASSMENT, BlockThreshold.LOW_AND_ABOVE),
         SafetySetting(HarmCategory.HATE_SPEECH, BlockThreshold.LOW_AND_ABOVE),
         SafetySetting(HarmCategory.SEXUALLY_EXPLICIT, BlockThreshold.LOW_AND_ABOVE),
         SafetySetting(HarmCategory.DANGEROUS_CONTENT, BlockThreshold.LOW_AND_ABOVE),
       )
    )

In this example, you are picking the gemini-1.5-flash model. This model is able to handle this example's text summarization use-case, and is more cost-effective than Gemini 1.5 Pro.

This example also sets the temperature value to 0, to ensure consistency generating summaries. You can learn more about the generation configuration parameters in the Gemini documentation.

Finally this example defines safety settings to make sure that the model generates appropriate language in its responses. To learn more about the safety features, review the Gemini documentation.

Gemini Summarization

Next, update the summarizePost() function to summarize the post passed as parameter.

First, extract the text from the post to pass it to the model:

val postString = StringBuilder()
for (paragraph in post.paragraphs) {
  postString.append(paragraph.text)
}

Create the prompt based on the prompt designed in step #2 and passing the post:

val prompt =
            "Summarize the following article in 4 concise bullet points. " +
                    "Ensure each bullet point is specific, informative and relevant. " +
                    "Return just the bullet points as plain text. " +
                    "Use plain text, don't use markdown. \n $postString"

Finally, pass the prompt to the model and return the response:

return generativeModel.generateContent(prompt).text

Test the implementation

To test the implementation click on the "Run app" button and install the Jetpack app on your emulator or a physical device.

Open any story from the home page, and click on the summarize button in the bottom bar:

Button triggering the Gemini summarization

Then you'll see a "Gemini summarization" section appearing at the top of the article, under the article illustration.

The Gemini summarization section appearing at the top of the article

JetNews architecture

Jetnews was built to showcase the current UI capabilities of Jetpack Compose and was built using the model-view-viewmodel (MVVM) pattern. It was implemented to support different screen sizes (see blog post for details).

The purpose of this codelab isn't to dive in details in the Jetnews app architecture and the Gemini integration mostly takes place in the GeminiRepositoryImpl class.

But if you want to see how the button triggers the summarization you can take a look at SummaryButton() in JetnewsIcons.kt. You can also review the UI implementation of the summarization UI in the SummarySection() function in PostContent.kt.

7. Conclusion

During this codelab you learned how to:

  • Create and test a prompt in Vertex AI Studio,
  • Setup a project in Firebase to use the Vertex AI SDK,
  • Configure the gradle dependencies use Vertex AI in Firebase in Android app,
  • Call Gemini 1.5 Flash from the Kotlin code

If you want to explore Vertex AI in Firebase you can review the Android code samples and review the documentation.