Atrás

Guía paso a paso para crear la app turística de tu ciudad

Escrito por el Jueves, 24 de Marzo 2016

Guía paso a paso para crear la app turística de tu ciudad
Hace ya algún tiempo que dejamos atrás los mapas de papel para explorar las ciudades y lugares de interés a través de nuestros smartphones. Hoy en día, todo tiene cabida dentro de una aplicación, ésta puede proporcionar al usuario un conjunto de información valiosa que este puede configurar según los lugares que quiera visitar, las actividades que quiere hacer y  mucho más. 

Hoy crearemos paso a paso una app para visitar y hacer turismo en una ciudad. En este artículo se tratará Portland, pero los pasos que se indicarán, se pueden extrapolar a muchas de las apps realizadas dentro de la categoría Viajes y Turismo de GoodBarber.  Como bien sabes, en nuestra plataforma todo se puede modificar y adaptar a tus necesidades. 

1. Escoge un Tema

Este es el primer paso para crear tu Beautiful App. En el back office de tu app encontrarás más de 25 temas creados por nuestros diseñadores que pueden servirte de gran ayuda para empezar tu aplicación y poquito a poco ir haciendo tus ajustes. Si quieres puedes escoger el tema "White" y hacer todos los ajustes manualmente.

Para la aplicación que he desarrollado a lo largo del artículo he decidido comenzar con el tema "Budapest", pero como he dicho anteriormente, se puede elegir el tema que mejor encage con el diseño que tienes en mente.
Guía paso a paso para crear la app turística de tu ciudad

2. Construye tu Home

La Home es la primera pantalla que tus usuarios verán cuando abran la app. Es una característica importante tanto en lo visual como en lo práctico. Con GoodBarber 4.0, la Home te permite escoger contenido que resaltar cuando se abre la ap. Además, te permite mostrar enlaces que dirigen a otras destinaciones de tu app. 

La Home modular está creada por 2 tipos de widgets diferentes, los de contenido y los de navegación (enlaces) - hay  66 widgets en total. Las plantillas conectadas con los widgets tienen una declinación para móvil, tablet y escritorio.

Aquí puedes ver que hemos añadido nuestro primer ​widget, para mostrar una sección mCMS de artículos : 
Guía paso a paso para crear la app turística de tu ciudad

*El contenido que se muestra dentro de la app es un ejemplo, puedes cambiar y ajustar todo el contenido a tu manera. 

Después de seleccionar la plantilla (Banner > Minimal) , hemos añadido el widget de contenido con una visualización distinta (Banner > Visual ) para mostrar otra sección de artículos mCMS llamada Shopping
Guía paso a paso para crear la app turística de tu ciudad

Seguidamente hemos añadido 3 widgets similares de contenido para mostrar más secciones de artículos mCMS de nuestra app: Comer fuera, Cultura y Ocio.
Guía paso a paso para crear la app turística de tu ciudad

Ahora, vamos a añadir otro widget de contenido para mostrar los Eventos y, para ello, seleccionamos la plantilla Lista > Classic:
Guía paso a paso para crear la app turística de tu ciudad

Nuestro Home ahora tiene 6 widgets. 

3. Construye tu Menú

Con GoodBarber 4.0 el Menú se utiliza como navegación secundaria dentro de la app. La Home proporciona los principales puntos de entrada a través de las secciones que decidas, del mismo modo que las llamadas a la acción, por eso puedes incluso escoger si mostrar o no este menú. Si decides inhabilitar el Menú (o modo de navegación en tu Back office), podrás escoger entre 7 tipos diferentes de "menús" o modos de navegación, para distribuir el tráfico a tu app.

Independientemente del número de secciones que tenga tu app, puedes construir un menú para controlar toda la navegación de la app.

En este ejemplo hemos seleccionado la plantilla Swipe y hemos añadido nuestro logo en la cabecera del Menú y el Copyright en el pie de página:
Guía paso a paso para crear la app turística de tu ciudad

Tu menú puede destacar enlaces y accesos directos, que apunten a destinaciones, al mismo tiempo que también puedes colocar títulos y separadores para priorizar la información en el menú (estos dos últimos tienen como objetivo resaltar el diseño). 

Asimismo, también puedes personalizar el logo dentro de tu cabecera, en la Home y las secciones, donde cada una de las secciones se puede personalizar independientemente:
Guía paso a paso para crear la app turística de tu ciudad

4. Añade tu contenido

Esta es la parte más importante de tu app, así que vamos a ser muy cuidadosos con ésta. 

Para empezar, he creado un sub-menú dentro de mi app (una sección menú), para organizar mejor el tipo de contenido y actividades que voy a mostrar en cada sub- menú, y otra información relevante para la app (por ejemplo: consejos, locales de moda, favoritos... ), que estarán en el menú original. 
Guía paso a paso para crear la app turística de tu ciudad

Una vez establecida la estructura de la aplicación, es hora de empezar a añadir el contenido real dentro de las secciones que has creado. Aquí, para el ejemplo de Portland, he trabajado en la sección "Ocio - Leisure", ingresando a lugares dentro de la ciudad, relevantes para este tipo de actividad.

Antes de empezar a añadir los puntos de interés, es aconsejable crear categorías dentro de esta sección (como sitios históricos, parques ...), lo que facilita a los usuarios navegar dentro de la app y evitar crear una cantidad excesiva de secciones. Este es un paso muy importante porque marcará una gran diferencia en cuanto a la experiencia de usuario. Cuanto más intuitivo y organizado esté el contenido, mejor. Una vez definidas las categorías, puedes empezar a añadir puntos en el mapa, en la pestaña "Contenido" de la sección.
Guía paso a paso para crear la app turística de tu ciudad

Es posible añadir detalles específicos sobre cada ubicación (por ejemplo: información, horario, historia ...), añade imágenes, botones de acción (teléfono y correo electrónico), sitio web, etc. Después, tienes que elegir a qué categoría pertenece cada punto. En el caso de la imagen de muestra, el Victoria Building Museum aparecerá en la categoría Todo (all) y "Leisure- Ocio".

La creación de categorías se puede realizar en diferentes secciones (artículos, videos ...) y es una herramienta muy eficaz para hacer la app más ligera. En la sección "Comer fuera", por ejemplo, podríamos orientar las categorías por cocina (italiano, japonés, mexicano, americano ...) para mantener toda la información dentro de una sola sección, mientras filtramos los resultados.
Guía paso a paso para crear la app turística de tu ciudad

Para crear otras secciones el proceso es muy similar. Si el contenido se crea dentro de una sección CMS, todo puede hacerse desde el back office de GoodBarber, desde escribir artículos hasta crear eventos. Si decides importar el contenido de fuentes externas (Wordpress, Facebook, Flickr ...), sólo tienes que configurar los ajustes de la sección al crearlo. Si necesitas ayuda, puedes consultar las ayudas en línea detalladas o contactar al soporte. 

¡Casi estámos allí! ¡Dos elementos más para añadir antes de que tu app esté lista!
Guía paso a paso para crear la app turística de tu ciudad

5. Pantalla de lanzamiento e icono de la app

Después de dominar el diseño y entrar en su contenido, es el momento para realizar algunos ajustes finales.

En este punto es importante recordar que necesitas cargar imágenes específicas para diferentes tipos de dispositivos y sistemas operativos. Este ajuste se realiza para asegurar una excelente resolución y calidad de imagen en la app.

La pantalla de lanzamiento es la primera cosa que los usuarios verán al abrir su app (antes del inicio). Se mostrará durante unos segundos mientras se carga el contenido de la app (también en un navegador). En nuestro ejemplo, nuestro diseñador gráfico ha creado la pantalla de bienvenida, pero también es posible diseñarla directamente desde el back office usando el Asistente.
Guía paso a paso para crear la app turística de tu ciudad

Para el icono de la app, que se mostrará en la pantalla de inicio de tus usuarios, también tendrás que cumplir con diferentes dimensiones, para los diferentes sistemas operativos y para los detalles de la Web App (como el favicon). Crear el icono de la app es una tarea complicada ya que en muy poco espacio tienes que representar la funcionalidad de la app. Seguramente, tendrás que modificar su logo de alguna manera para que se adapte al formato cuadrado.

Por último, no olvides introducir el nombre de tu app. El campo que aparece debajo de la vista previa del icono es el nombre de la app, tal como aparecerá en la pantalla de inicio del teléfono inteligente del usuario: "Portland".
Guía paso a paso para crear la app turística de tu ciudad

¡Allá vamos! Siguiendo estos pasos para crear la app de tu ciudad o guía de turismo te ayudarán a que tu aplicación sea un éxito. Pero no te olvides de que tus esfuerzos tienen que ir más allá de la creación de tu app. Si necesitas más consejos, visita nuestra Guía para promocionar tu app.
Guía paso a paso para crear la app turística de tu ciudad

Si te gusta lo que ves, no pierdas el tiempo y la oportunidad de crear tu app. Escucha este episodio con un experto de la geolocalización y usuario de GoodBarber ⬇️

Push Your App Podcast

Descubre otras Beautiful Apps creadas para encantar a los viajeros. 

Guía paso a paso para crear la app turística de tu ciudad

Guía paso a paso para crear la app turística de tu ciudad

Guía paso a paso para crear la app turística de tu ciudad



Ingresa tu email