#51: GlideApps – Creando aplicaciones móvil sin código
May 5, 2020
En este episodio pasaremos rápidamente por nuestras semanas para centrarnos en el valor al grano: Cómo crear aplicaciones móvil a partir de una hoja de cálculo de Google Sheets con GlideApps.
En este episodio pasaremos rápidamente por nuestras semanas para centrarnos en el valor al grano: Cómo crear aplicaciones móvil a partir de una hoja de cálculo de Google Sheets con GlideApps.
La semana del vecino Enric Cortiñas
Esta semana he estado muy centrado en la digitalización de un congreso, formó parte del equipo organizador y he estado haciendo 12 horas al día para que la semana siguiente este todo listo.
Me han entrado un par de leads, por un lado una Fundación que quiere que gestione sus campañas de publicidad digital y por otro lado los organizadores de un evento presencial que lo iban a hacer en junio y lo van a pasar a setiembre.
He hecho algunas reuniones para dar a conocer cat-commerce en algunas administraciones y asociaciones de comerciantes, tengo que mandar propuesta a una de ellas.
Nos hemos comprado un Monopoly Juego de Tronos para pasar estos días de confinamiento.
Locas historias de Antonio Sánchez
Mi gran punto de esta semana es que se me ha caído el socio de la tienda online de TPV’s – Ha sido una gran putada porque ya lo teníamos todo montado.
Tenemos un nuevo vecino en la comunidad de Telegram, Miki de Alcantarilla (Murcia).
Luismi compartió un documental de media hora sobre la realidad de una pequeña zona en Cajamarca, Perú. Muy emocionante sobre la llegada de Internet a las escuelas dándoles acceso a información y la posibilidad de comunicarse. https://www.youtube.com/watch?v=3TzoY99oNKI
Valor al grano: aplicaciones sin código a partir de un Google Sheets con GlideApp.
Se trata de un SAAS que permite crear PWA compatibles con Android y con iOS, y necesitan tener acceso a internet en todo momento para poder mostrar la información.
En un principio puede parecer que la app es muy limitada, pero tras ver las plantillas y los ejemplos que hay la verdadera limitación es la imaginación.
Las propias limitaciones de GlideApp lo puedes sobrellevar con las capacidades de Google Sheets, la conexión a Zapier y Google Script para enlazar aplicaciones dentro de GSuite.
Mejor aún, puedes conectar Google Sheets con otras apps y bases de datos para traerte toda la información, y con la versión PRO de Glideapps puedes estar sincronizando todos estos datos de forma fluida con KPIBees o con Database Browser.
Pero antes de seguir poniéndoos los dientes largos voy a comentar por encima cómo se estructura una GlideApp y qué componentes podemos añadir:
Una GlideApp se estructura mediante Tabs o pestañas, que corresponderían a una tabla de Google Sheets. No todas las tablas tienen por qué tener pestaña, pero sí al contrario.
Las pestañas pueden estar en la barra inferior como un acceso directo o en el menú lateral.
Las tablas de Google Sheets obligatoriamente tienen que tener cabecera, como si fuera una tabla de una base de datos. Encima, puedes enlazar una tabla con otra con campos relacionales.
Dentro de cada pestaña tenemos que seleccionar de qué forma se va a mostrar esta información:
En formato lista o lista compacta. La diferencia entre estas dos es que la primera puede mostrar una fila más de información.
Después tenemos “Tiles” que permite una disposición en fichas de 1 a 4 columnas, con la imagen en formatos:
Cuadrado 1:1
Apaisado en proporciones 3:1, 3:2 y 4:3
Vertical en proporciones 2:3 y 3:4
Y por último, redondo
Depende de los ajustes se podrá mostrar más información o menos, hasta se puede añadir un botón de “Favorito” sobre la ficha.
La siguiente disposición es de calendario, para ello necesitamos que una columna sea en formato fecha.
La vista de mapa te permite pinear direcciones. Truco: en la versión gratuita está limitada a 10 direcciones, pero si en lugar de poner una dirección pones las coordenadas este límite se esfuma:
Vista de checklist, útil para hacer aplicaciones tipo TODO List
Vista de “Cards” muy chula para hacer maquetaciones de publicaciones
Y por último layout de detalle, que muestra únicamente la información de una fila, útil para páginas de aterrizaje o de perfil. Dentro de este layout podemos añadir componentes para hacerlo todavía más versátil.
Los componentes disponibles son un poco limitados, pero con imaginación se vuelven muy potentes. Los voy comentando en orden:
Texto en tres formatos: Básico, que lee el texto de una celda; enriquecido, que te permite usando Markdown Syntax para crear textos con jerarquía, y el último que solo pone “Texto” puedes añadir texto a mano sin tener que leer de una celda, puedes darle estilo y alinearlo.
Vista de tabla, mostrar los datos directamente como una tabla de dos columnas, útil para mostrar características o para maquetar.
El típico separador o <HR> en HTML, yo lo combino con dos campos de texto vacío para darles un poco de padding por encima y por abajo.
El componente de título se estructura en una imagen, un título y un subtítulo:
En la sección de multimedia podemos publicar audios, imágenes, mapa o video. Todos beben de una URL, por lo que podemos almacenarlos en Google Drive y mostrarlos ahí.
En el componente de imagen podemos superponer información o recortar la imagen de forma inteligente con detección de caras y objetos.
Llegaron los botones y con ellos podemos hacer muchas acciones:
Copiar algún contenido al portapapeles
Llamar a un número de teléfono
Abrir un enlace
Enviar un email
Mostrar un formulario
Mostrar una dirección en Google Maps
O hacer una acción de Zapier
Aparte tenemos el botón de comprar, el de checkbox o switch, el de enviar un email, añadir a favoritos, y por último el de relación, que nos permite conectar con otro campo del Google Sheets para mostrarlo directamente.
El maravilloso componente del “Inline list” te permite mostrar layouts dentro de otro layout, de tal forma que podemos tener una ficha única y dentro tener dentro otros artículos de otra tabla.
El listado relacional funciona de la misma forma que el inline list pero muestra los artículos o campos que mantienen una relación con el principal. La relación la establecemos desde el
Los “pickers” permiten al usuario interactuar con el contenido:
Pueden elegir un valor de una lista con “Choice”
Elegir una fecha con “Date” o fecha y hora con “Datetime”
Subir un archivo con “File Picker”
Subir una imagen con “Image Picker”
O simplemente darle a Like o Dislike
GlideApps también tiene componentes de gráficos y barras de progresión para poder mostrar analítica.
Y por último los campos de formulario que permiten a los usuarios añadir información a las tablas, estos campos son:
Comentarios
Email
Notas
Un número
Un número de teléfono
Un texto plano.
Combinando las vistas o layouts con los componentes con opciones de filtrado y visibilidad condicional podemos hacer maravillas.
A Antonio lo podéis encontrar en Twitter como @archtkt, o en su blog personal antoniosanchez.pro (en el que escribo muy from grapes to pears).
¿Dónde podéis comentar el episodio?
Nos podéis dejar vuestros comentarios, sugerencias y dudas en los comentarios de aquí abajo. También podéis buscar nuestro grupo de Telegram en el que vamos definiendo entre todos los vecinos el futuro de este podcast.
Para entrar en la comunidad sólo tenéis que busca el grupo de “La Escalera Podcast” en el buscador de Telegram: