--- title: "TabBar: llega una nueva generación" description: "En una app móvil, la navegación no sirve solo para pasar de una sección a otra. Estructura la experiencia, crea referencias visuales fuertes y contribuye direct" canonical_url: "https://es.goodbarber.com/blog/tabbar-llega-una-nueva-generacion-a1043/" lang: es date: 2026-05-13 last_updated: 2026-08-05 --- # TabBar: llega una nueva generación Con la nueva TabBar, enriquecemos la navegación de tus apps con 3 nuevos layouts, más opciones de personalización, animaciones de selección y un enfoque multidispositivo pensado para cada pantalla. ![](https://blog.goodbarber.com/_public/profile/e1/e1822db470e60d090affd0956d743cb0e7cdf113-default.jpg) [Lesia PIETRI](https://es.goodbarber.com/blog/author/lesia-pietri/)Head of Product Design 13 may 2026 · Actualizado el 5 ago 2026 · 3 min de lectura ![](https://cmsphoto.ww-cdn.com/superstatic/81328/art/grande/96542974-67308763.jpg?v=1778684117.0549726) En una app móvil, la navegación no sirve solo para pasar de una sección a otra. Estructura la experiencia, crea referencias visuales fuertes y contribuye directamente a la percepción global del producto. Con el nuevo componente TabBar, abrimos una nueva etapa en el diseño de la navegación, con más libertad de diseño, más flexibilidad en la personalización y una adaptación más cuidada a cada dispositivo. ## Tres nuevos layouts para marcar el tono ![](https://cmsphoto.ww-cdn.com/superstatic/81328/art/grande/96542974-67308764.jpg?v=1778684118.8989651) Esta nueva generación de TabBar llega con tres layouts disponibles desde el lanzamiento: **Bold TabBar**, **Minimal TabBar** y **Clean TabBar**. - **Bold TabBar** da más presencia a la navegación, con una estructura visual fuerte y rotunda. - **Minimal TabBar** propone un enfoque más moderno y más compacto. - **Clean TabBar** ofrece un equilibrio elegante, con un acabado depurado, polivalente y fácil de integrar en universos gráficos muy variados. Con estas tres direcciones, la barra de navegación se convierte en una auténtica palanca de estilo. Puede alinearse de forma más precisa con la identidad de la app, ya se trate de un proyecto editorial, una app de marca, un servicio, un universo lifestyle o una aplicación de e-commerce. ## Una TabBar más rica para personalizar [blog_post-tabbar-bloc2](https://player.vimeo.com/video/1191923031?badge=0&autopause=0&player_id=0&app_id=58479&autoplay=1&muted=1&loop=1) El nuevo componente no se limita a los nuevos layouts. Se inscribe en la evolución continua del **Design System GoodBarber** y amplía las posibilidades de personalización de la navegación. Fondos, formas, sombras, estructura de los elementos, estados seleccionados, menú "More", variaciones según los dispositivos: cada dimensión se ha pensado para ofrecer más precisión en el resultado, sin perder la coherencia visual de la app. Esta nueva TabBar ilustra plenamente la ambición de nuestro Design System: dar más libertad de creación, sin renunciar nunca a la calidad de ejecución. Las **animaciones de selección** acompañan esta evolución aportando más fluidez a las interacciones, una mejor lectura de los cambios de estado y una sensación de interfaz aún más cuidada. En iOS, Android y PWA, la nueva TabBar también puede aprovechar los **efectos Material Blur**, que aportan profundidad y un toque aún más premium al resultado visual. ## Una navegación pensada para cada pantalla ![](https://cmsphoto.ww-cdn.com/superstatic/81328/art/grande/96542974-67308766.jpg?v=1778684120.6309583) Esta evolución refleja también un enfoque multidispositivo más afirmado. En móvil, la TabBar conserva su posición natural en la parte inferior de la pantalla. En desktop, se vuelve vertical para aprovechar mejor el espacio disponible e integrarse en los usos propios de las interfaces de pantalla grande. Esta decisión prolonga la lógica mobile-first de GoodBarber afirmando al mismo tiempo una verdadera calidad de adaptación en desktop. No se trata simplemente de mostrar la misma navegación en todas partes, sino de ofrecer una experiencia coherente con cada contexto de uso. ## Una nueva etapa para el diseño de las apps en GoodBarber ![](https://cmsphoto.ww-cdn.com/superstatic/81328/art/grande/96542974-67308767.jpg?v=1778684122.4029512) Con este nuevo componente, GoodBarber amplía aún más las posibilidades para quienes quieren crear una app móvil con diseño premium, sin salir de la simplicidad de producción propia del no-code. Más expresiva, más personalizable, más fluida y mejor pensada para cada pantalla, esta nueva TabBar da una nueva dimensión a la navegación en las apps GoodBarber. Una evolución que refuerza tanto la calidad percibida de las interfaces como la libertad creativa que ofrecemos a diseñadores, marcas, medios y a todos los creadores de apps. ![](https://blog.goodbarber.com/_public/profile/e1/e1822db470e60d090affd0956d743cb0e7cdf113-default.jpg) Sobre el autor Lesia PIETRI Head of Product Design Soy Head of Product Design en GoodBarber. Dirijo el diseño del producto: el design system sobre el que se construyen todas las apps, los layouts que sirven de punto de partida y el recorrido que va de una idea a una app publicada. Mi trabajo es que alguien que nunca ha abierto una herramienta de diseño publique igualmente una app cuidada, pantalla tras pantalla. Diseñador de corazón, dedico mis días a los detalles que nadie nombra: los espaciados, los contrastes, el peso de un título. Escribo aquí sobre el diseño de GoodBarber y sobre las novedades del producto: las funcionalidades, los layouts y los temas. [Más de Lesia](https://es.goodbarber.com/blog/author/lesia-pietri/)[LinkedIn](https://www.linkedin.com/in/lesia-pietri-150824116/)