Construyendo FLIP
Cómo lo construimos
I/O FLIP es un ejemplo de integración perfecta entre las nuevas herramientas de inteligencia artificial de Google y las herramientas que ya conoce y ama. Las imágenes de personajes se generan con DreamBooth en Muse y las descripciones se generan utilizando la API PaLM. La interfaz de usuario del juego y las animaciones se crean en Flutter y el backend está escrito en Dart. Utiliza un conjunto de herramientas de Firebase y Google Cloud para alojar y compartir.
Aprende másEl código
Entra en el código
Accede al código que compone I/O FLIP y deja que te inspire a usar todas las herramientas de I/O FLIP y más para crear tus propias innovaciones aún más divertidas y encantadoras.
Ver códigoPreguntas frecuentes
Preguntas frecuentes
¿Qué es esto?
I/O FLIP es un juego de cartas diseñado por IA impulsado por Google, creado para Google I/O 2023.
¿Cómo se crearon las imágenes y descripciones?
Las imágenes se generaron utilizando Muse, un modelo que transforma de texto a imagen desarrollado por Google Research, y se entrenaron utilizando el arte que creamos. El texto se generó utilizando la API PaLM basada en entradas de texto creadas por Google. Para garantizar una experiencia positiva para todos los usuarios, las imágenes y el texto se generaron fuera de línea para que revisores humanos pudieran examinarlos y garantizar que cumplieran con los principios de IA de Google.
¿Cómo se utilizó la IA?
Se utilizó IA para crear las imágenes y descripciones de cada tarjeta.
¿Hay premios para los ganadores?
No hay premios como parte del juego.
¿Qué datos se almacenan y están disponibles públicamente cuando se comparten?
Si elige compartir, sus iniciales, tarjetas y puntaje estarán disponibles en una URL única durante 30 días y luego se eliminarán automáticamente.
Design with Flutter
Translating Design to Code with Material 3
Learn how to build the basil material study in Flutter with advanced theming techniques and how to build for multiple device contexts.
Prototyping beautiful designs with Flutter
We'll show why Flutter is a great choice for building ambitious designs, as we start prototyping a puzzle app with custom animations, variable fonts, and shaders.
Using FlutterFlow to create engaging experiences lightning fast
Learn how to create beautiful and responsive UI, add animations, create custom widgets, generate clean code, and deploy to the app stores & web in one click using FlutterFlow.
Build RPG Games in Flutter with Bonfire
Learn how to build RPG games in Flutter with Bonfire, a package built on the Flame game engine.
Full Stack Development
Top Cloud Development Tips for Flutter Developers
Complement your Flutter apps with Dart on the server in these ten steps that run from initial project development all the way through deployment and QA automation.
Real-Time Games with Dart
Learn how to run Dart on the backend to drive a simple real-time multi-player game across multiple platforms. We’re going to play with the flame game engine and try to reuse some code between client and server.
Control your Flutter app on the fly with Firebase Remote Config
Real-time updates, feature flagging, A/B testing - what if I told you that you could enable these powerful features in your Flutter application with minimal development effort and without any costs? Firebase Remote Config is a free service that enables changing the behavior of an app remotely without publishing an app update. In this video, I will cover multiple real-world use cases where Firebase Remote Config could help you while building Flutter apps.
The future of Dart and Flutter
Bringing pattern matching to Dart
Records and pattern matching are two of the largest features coming in Dart 3.0. I'll talk about what they are, what they're useful for, and how they harmonize with the rest of the Dart language.
Impeller
Everything you need to know about Impeller, a new rendering runtime solution for Flutter to resolve early-onset jank issues. Impeller precompiles a smaller, simpler set of shaders at Engine build time so that they will not be compiled while an app is running.
Introducing screenshots on pub.dev
A short talk about why and how we are introducing screenshots on pub.dev.
Two-dimensional scrolling
A preview of upcoming scrolling features - in two dimensions!
Preview multiple windows on desktop
In this talk you'll get an early preview of what it will look like to render content into multiple windows from a single Flutter app.
Engineer with Flutter
Canvas.draw Vertices
In this talk, Filip will explain the API of Canvas.drawVertices() and the Vertices.raw() constructor — both are obscure, very low-level, and hard to explain in documentation alone. But they are worth it when you need to squeeze the last bit of performance out of Flutter.
Making UI animation easy and fun
This talk for Flutter Forward 2023 dives into the Flutter Animate library, exploring how easy it is to create beautiful UI animations with just a few lines of code. It covers how to apply and adjust the wide variety of included effects, how to create totally custom effects, how to control animation playback, and shares tips to reduce the performance impact of animation.
Navigation with Go Router 6
Learn how to manage navigation in your Flutter app with the new Go Router 6 package.
How to write effective Flutter and Dart tests
Learn more on software testing, why we write tests, the kinds of tests you can and should write, and how to write the most effective tests for Flutter apps.
Migrate your native apps to Flutter
Learn the essential aspects of converting an existing app to Flutter, taken from learnings from ZestMoney. We will dive deep into understanding how much time and resources we will require to do this conversion.
Platform-specific touches
Adaptive UI for a multiplatform world
An in-depth look at application adaptivity and practical ways to add adaptivity to your Flutter applications.
Flutter on Desktop
This talk begins with giving a brief discussion explaining the benefit of cross-platform project on multiple screens (i.e desktop), then it dives into building a desktop application using Flutter on macOS, Linux and Windows. Then it goes on to talk about desktop application distributions on these three platforms, giving you an overview of an end to end solution to craft your own very first desktop application.
How to integrate Payment gateway in a Flutter web app
Flutter web is stable now and getting matured. Most of the time we consider Flutter web for to build portfolio or any one page application.If you want to develop any application which need some basic and important functionality like payment gateway then what are the options available in Flutter web and how easily you can integrate payment gateway. Let’s go over this more in detail in this talk.
7 ways to speed up your flutter webapps
Learn 7 steps that you can take to speed up the loading of your Flutter Webapps.
Dart
Dart language evolution since 2.15
Take a dive into the evolution of the Dart language starting from Dart 2.15 to Dart 2.18, covering features such as contructor tearoffs, enhanced enums, super initializer parameters, improved named arguments.
Software supply chain security for Flutter and its ecosystem
Dart and Flutter are investing heavily in tools and services to protect their software supply chain. In this talk we will share our progress improving Flutter’s software supply chain security and the tools created to help the Flutter Ecosystem to improve their security posture.
Securing Flutter apps
Reviewing OWASP's top 10 for mobile, reporting vulnerabilities, best practices to minimize risk, preventing reverse engineering, staying up to date, and identifying and blocking attacks in real-time with technology such as RASP (Runtime Application Self-Protection) are the topics you will take away from this talk.
Private Dart and Flutter Packages
In this video, we show how private packages may be referenced and what is the most convenient way of working when you need to keep packages secret and safe.
Tiny Flutter
Dart recently added experimental support for the new RISC-V CPU architecture and the first boards with these new chips are now starting to be available. One of them being the Sipeed Lichee D1. Learn how to get Dart running on one of these boards with a tiny screen and how Flutter can help.
Community
Flutter in Africa
Learn about Flutter communities in Africa and the exciting things Flutter developers all over the continent are building!
Flutter Demo
Learn how we built the Holobooth Machine Learning demo, a Flutter Web app that uses TensorFlowJS with the MediaPipe FaceMesh model to detect 3D face landmarks real-time in a browser!
Learn MoreFollow the latest on Flutter Forward
Creating home and lock screen widgets for your Flutter app
In this workshop, we'll walk through the steps needed to add Home Screen widgets and Lock Screen widgets to your Flutter app in iOS and Android.
Before you arrive
This workshop will walk through both native Android and native iOS development. In addition to having the Flutter SDK installed and a development environment, you’ll need certain software to follow each portion. To follow along with the Android portion, you’ll only need Android Studio. To follow along with the iOS portion, you’ll need a MacOS computer with Xcode installed, and an Apple Developer account. More information can be found in this Github repository’s README.
Hands-on with multi-factor authentication and Firestore count queries
Get the latest Firebase features for your Flutter app. We'll start with a basic app, and then add multi-factor phone authentication to ensure more secure sign-in.Then we'll use the new COUNT() operator in Firestore to include counts in the app at just a fraction of the cost and complexity.
Before you arrive
In order to follow along with this workshop, you’ll need a Flutter and Firebase development environment set up. You can follow the setup instructions at the Get to know Firebase for Flutter codelab. It is important that you complete step one through four of the codelab, to have your environment set up. If you have no Firebase experience, you are encouraged to complete the entire codelab before the workshop.
How to build the Basil Material 3 study
Learn how to use advanced theming features and the Material hct color system with the Basil Material 3 study. The Basil app also showcases how to build for ambient and smart displays.
Before you arrive
This workshop includes steps of the design process, which will help developers learn how to turn design into code. In order to follow along with the design process portion of the workshop, you should install Figma, or plan on using the Web Client for Figma. (If you plan on using the web client, you should test Figma beforehand, as it’s less reliable than the desktop client if the internet connection isn’t fast enough.) Other than Figma, this workshop will only use the standard Flutter development environment.
Community
Community Guidelines
Google Community Guidelines and Anti-Harassment Policy for In-Person and Virtual Events
Google is dedicated to providing a harassment-free and inclusive event experience for everyone regardless of gender identity and expression, sexual orientation, disabilities, neurodiversity, physical appearance, body size, ethnicity, nationality, race, age, religion, or other protected category. We do not tolerate harassment of event participants in any form. Google takes violations of our policy seriously and will respond appropriately.
All participants of Google events, including in-person and online attendees, event staff, speakers, and Googlers, must abide by the following policy:
Be respectful to each other.
Treat everyone with respect. Participate while acknowledging that everyone deserves to be here — and each of us has the right to enjoy our experience without fear of harassment, discrimination, or condescension, whether blatant or via microaggressions. All forms of communication should not demean others. Consider what you are saying and how it would feel if it were said to you, or about you.
Speak up if you see or hear something.
Harassment is not tolerated, and you are empowered to politely engage when you or others are disrespected. The person making you feel uncomfortable may not be aware of what they are doing, and politely bringing their behavior to their attention is encouraged.
- Stalking/following
- Deliberate intimidation
- Harassing photography or recording
- Sustained disruption of talks or other events
- Offensive verbal language
- Verbal language that reinforces social structures of domination
- Sexual imagery and language in public spaces
- Inappropriate physical contact
- Unwelcome sexual or physical attention
- Physical or cyber threats
In relation, but not limited to:
- Neurodiversity
- Race
- Color
- National origin
- Gender identity
- Gender expression
- Sexual orientation
- Age
- Body size
- Disabilities
- Appearance
- Religion
- Pregnancy
- Military status
- Social demographic
Participants asked to stop any harassing behavior are expected to comply immediately. Our zero-tolerance policy means that we will look into and review every allegation of violation of our Event Community Guidelines and Anti-Harassment Policy and respond appropriately. To report any behavior that makes you or others feel uncomfortable, send us a note at flutter-engage-community@google.com.
This policy extends to talks, forums, workshops, codelabs, social media, all attendees, partners, sponsors, volunteers, staff, etc. You catch our drift. Google reserves the right to refuse admittance to, or remove any person from, any Google- hosted event (including future Google events) at any time in its sole discretion. This includes, but is not limited to, attendees behaving in a disorderly manner or failing to comply with this policy, and the terms and conditions herein. If a participant engages in harassing or uncomfortable behavior, the conference organizers may take any action they deem appropriate, including warning or expelling the offender from the conference with no refund or blocking the offender’s account from participating online.