Jet Stream
Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
Disfruta de acceso sin interrupciones a tus películas, programas de TV y música favoritos, y mucho más en la pantalla grande cuando quieras en casa.
Recursos
Tema
Tema de color
Se genera un tema de color con el generador de temas de Material Design 3.
Tipografía
La escala de tipos de JetStream usa el tipo de letra Inter para crear una apariencia simple y clara de las pantallas de TV.
Forma
Se aplica un radio sutil a las tarjetas y los botones para crear bordes amigables y accesibles.
Enfoque
En JetStream, se usa un contorno de 3 dp con un color de contorno.
Principal
Principal
Página de destino de la app de JetStream.
Carrusel destacado
Un carrusel con un diseño en forma de tarjeta.
Fila de contenido
JetStream usa un diseño de tarjeta estándar con una relación de aspecto de 2:3 en un diseño de 5 columnas.
Lista envolvente
Destaca el contenido especial en la app con el componente de lista envolvente, como las 10 películas del momento.
Categorías
Categorías
En la página Categorías, se muestran los géneros en formato de cuadrícula para facilitar la navegación y el acceso.
Detalles de la categoría
Se usa una cuadrícula de tarjetas de 2:3 con un encabezado para crear la página Detalles de la categoría.
Películas
Una pestaña de películas estándar con tarjetas de contenido destacado de 16:9 en la parte superior y cuadrícula de contenido en la parte inferior
Biblioteca
Favoritos
En la pestaña Favoritos, se incluyen chips de filtro en la parte superior de la pantalla para permitir la búsqueda rápida de contenido.
Buscar
Destino de la búsqueda
Una página de búsqueda incluye una barra con búsquedas sugeridas basadas en búsquedas recientes.
Búsqueda activa
Cuando el usuario se enfoque en la barra de búsqueda, aparece el teclado y los resultados que se muestran a continuación se actualizan de forma dinámica a medida que el usuario escribe.
Detalles de la entidad
Detalles de la página de destino
La página de detalles presenta una vista cinemática con un breve resumen de la trama y un botón de llamado a la acción destacado para mirar la película.
Reparto y equipo
La sección Cast and Crew incluye una fila de tarjetas clásicas con títulos y descripciones, cada una acompañada de un recurso de imagen de 2:3.
Calificaciones
La sección de calificaciones incluye una tarjeta ancha y clásica personalizada que incluye información adicional.
Reproducción
Reproductor de video
Un reproductor de video estándar con prácticas recomendadas.
Configuración del reproductor de video
Una ventana emergente de subtítulos en el reproductor de video
Configuración
Configuración de la cuenta
El diseño de la página Cuentas presenta un diseño de dos columnas con un componente de lista a la izquierda y componentes de tarjetas personalizadas a la derecha, organizados en formato de cuadrícula.
Diálogo para borrar la cuenta
El cuadro de diálogo está diseñado con un fondo que contrasta para que se destaque del resto de la pantalla. Los dos botones del diálogo están alineados a la izquierda para ofrecer una apariencia prolija y organizada.
Acerca de
La sección Acerca de cuenta con un panel derecho con una vista de texto desplazable.
Configuración de subtítulos
Un componente de lista se usa para mostrar varias opciones de configuración bajo subtítulos y utiliza acciones como un interruptor o una etiqueta.
Historia
El historial de búsqueda tiene un diseño que muestra una lista de búsquedas anteriores, junto con una opción para borrar todo el historial de búsqueda.
Ayuda
La sección Ayuda y asistencia utiliza un componente de lista personalizada para mostrar varias opciones, incluida la información de contacto y las Preguntas frecuentes.
El contenido y las muestras de código que aparecen en esta página están sujetas a las licencias que se describen en la Licencia de Contenido. Java y OpenJDK son marcas registradas de Oracle o sus afiliados.
Última actualización: 2025-07-27 (UTC)
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Falta la información que necesito","missingTheInformationINeed","thumb-down"],["Muy complicado o demasiados pasos","tooComplicatedTooManySteps","thumb-down"],["Desactualizado","outOfDate","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Problema con las muestras o los códigos","samplesCodeIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 2025-07-27 (UTC)"],[],[],null,["# Jet Stream\n\nEnjoy seamless access to your favorite movies, TV shows, music, and more on\nthe big screen, anytime at home.\n\nResources\n---------\n\n| Type | Link | Status |\n|----------------|---------------------------------------------------------------|-----------|\n| Design | [Design source (Figma)](https://goo.gle/jet-stream-figma) | Available |\n| Design | [Inter (Google Fonts)](https://goo.gle/jet-stream-fonts) | Available |\n| Implementation | [Jetpack Compose (Github)](https://goo.gle/jet-stream-github) | Available |\n\nTheme\n-----\n\n\u003cbr /\u003e\n\n**Color theme**\nA color theme is generated using the Material Design 3 theme generator. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Typography**\nJetStream's type scale uses the Inter typeface to create a simple and clear look for TV screens. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Shape**\nA subtle radius is applied to the cards and buttons to create friendly and approachable edges. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Focus**\nA 3dp outline with an outline color is used in JetStream. \n\n\u003cbr /\u003e\n\nHome\n----\n\n\u003cbr /\u003e\n\n**Home**\nLanding page of JetStream app. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Featured carousel**\nA carousel with a card-style layout. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Content row**\nJetStream utilizes a standard card style with a 2:3 aspect ratio in a 5-column layout. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Immersive list**\nHighlight special content in the app using the Immersive list component, such as top 10 trending movies. \n\n\u003cbr /\u003e\n\nCategories\n----------\n\n\u003cbr /\u003e\n\n**Categories**\nThe Categories page displays genres in a grid format for easy navigation and access. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Category cards** \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Category details**\nA 2:3 card grid with a header is used to create the Category details page. \n\n\u003cbr /\u003e\n\nMedia\n-----\n\n\u003cbr /\u003e\n\n**Movies**\nA standard movies tab with a 16:9 featured cards on the top with content grid on the bottom. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Shows** \n\n\u003cbr /\u003e\n\nLibrary\n-------\n\n\u003cbr /\u003e\n\n**Favorites**\nThe Favorites tab includes filter chips at the top of the screen to allow for quick content searching. \n\n\u003cbr /\u003e\n\nSearch\n------\n\n\u003cbr /\u003e\n\n**Search landing**\nA search page features a search bar with suggested search queries based on recent searches. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Active search**\nWhen the user focuses on the search bar, the keyboard pops up, and the results below dynamically update as the user types. \n\n\u003cbr /\u003e\n\nEntity details\n--------------\n\n\u003cbr /\u003e\n\n**Details landing**\nThe details page presents a cinematic view with a brief plot summary and a prominent call-to-action button to watch the movie. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Cast and crew**\nThe Cast and Crew section features a row of classic cards with titles and descriptions, each accompanied by a 2:3 image asset. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Ratings**\nThe ratings section features a custom classic wide card that includes additional information. \n\n\u003cbr /\u003e\n\nPlayback\n--------\n\n\u003cbr /\u003e\n\n**Video player**\nA standard video player with best practices. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Video player settings**\nA close caption popover on the video player. \n\n\u003cbr /\u003e\n\nSettings\n--------\n\n\u003cbr /\u003e\n\n**Account settings**\nThe accounts page layout features a two-column design with a list component on the left and custom card components on the right, arranged in a grid format. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Delete account dialog**\nThe dialog box is designed with a contrasting background to make it stand out from the rest of the screen. The two buttons in the dialog are aligned to the left for a clean and organized look. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**About**\nThe About section features a right-hand panel with a scrollable text view. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Subtitle settings**\nA list component is used to display various settings under subtitle, and uses actions such as a switch or a label. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**History**\nThe search history uses a layout that displays a list of previously searched queries, along with an option to clear all the search history. \n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Help**\nThe Help and Support section uses a custom list component to display various options, including contact information and FAQs. \n\n\u003cbr /\u003e"]]