Crea tu primera App con este asistente

Human body guide

  • icon-videoVideo
  • Quiosco
  • icon_iOsiOS/Android
  • 6 contenidos
  • Smartphone/Tablet

Tutorial para crear esta App

Abre el programa 480interactive en tu ordenador y pulsa sobre el botón “Crear nueva App”.

 

  1. Elige el nombre del proyecto. Por ejemplo “Mi App”.
  2. Elige la ubicación del proyecto. Por defecto el programa elige automáticamente el espacio de trabajo donde guarda todos los proyectos.
  3. Elige el tipo de App. Selecciona “App Quiosco”.
  4. Pulsa sobre el botón “Crear”.

 

Ya tienes la App creada, pero aún no tiene ningún contenido añadido.

Este proyecto cuenta con 6 vídeos básicos sobre las partes y las funciones de los órganos principales del cuerpo humano. Puedes personalizar el proyecto simplemente sustituyendo los contenidos. A continuación te indicamos cómo hemos creado esta App en unos sencillos pasos.

Primero vamos a añadir un video. Para ello, nos dirigimos a la pantalla de “Añadir contenido” en el árbol de la izquierda, buscamos el contenido “Video” y pulsamos en “Añadir”.

 

Se abrirá un asistente para añadir el video mp4. Pulsamos en “Seleccionar” y buscamos la ubicación donde tenemos los contenidos. Dentro de “Libraries“.

 

Hacemos doble clic sobre el video que queramos añadir o pulsamos en “Seleccionar”, por ejemplo sobre el video llamado “Brain.mp4”. En el campo “Título” escribimos el nombre del video, si queremos podemos editarlo más adelante.

Ahora, repetimos este mismo proceso para añadir el resto de videos a la aplicación: “Brain.mp4“, “Heart.mp4“, “Intestines.mp4“, “Kidney.mp4“, “Lungs.mp4” y “Stomach.mp4″.

Añadir los iconos a la App

Hay dos tipos de iconos en esta App: el icono principal de la App, que es el que se verá cuando los usuarios se instalen la App en sus dispositivos y los iconos de cada uno de los contenidos, que son los iconos que verás en el quiosco donde están todos los contenidos que añadas a la aplicación.

El icono principal de la App

Para añadir este icono, hacemos click en “Configuración de la App” en el árbol de la izquierda y pulsamos en la pestaña “Información General”. Una vez ahí, veremos una imagen por defecto, pulsamos sobre ella y se abre el buscador de archivos. Ahora elegimos el icono de la aplicación llamado “ico-App.png”.

 

Los iconos de los videos

  1. Pulsamos sobre el primer video en el árbol de la izquierda.
  2. Pulsamos en la opción “Icono publicación”
  3. Elegimos el icono del video.
  4. Repetimos este mismo proceso con cada uno de los videos restantes y ya tendremos todos los iconos listos.

 

 

Banners del Quiosco

Cuando realizas una aplicación tipo quiosco, lo primero que ves al iniciar la aplicación es el propio “Quiosco” donde se encuentran todos los contenidos y categorías que contiene tu app. En la parte superior del Quiosco podemos colocar un banner, que es una imagen con la que podemos dar un aspecto personalizado a la App. En el siguiente enlace podrás ampliar información sobre los Banners del Quiosco.

 

Para añadir los banners a la app vamos a “Configuración de la app” > “Aspecto visual” y hacemos click en la pestaña “Banners”.

Ahora seleccionamos “Banners verticales” y pulsamos en “Añadir

Se abrirá la carpeta del proyecto, entramos en la carpeta “Libraries” > “Icons&banners“, seleccionamos los banners y pulsamos “Seleccionar”.

Por último configuramos el tiempo de visualización, en segundos, entre un banner y el siguiente en el campo “Tiempo de paso entre banners“. Por ejemplo, 3 segundos.

 

Personalización de los colores del Quiosco

Ahora cambiaremos los colores del tema para personalizar los colores de nuestra App. Para ello nos dirigimos a “Configuración de la App” > “Aspecto visual” > “Colores”. Aquí podemos personalizar los colores del quiosco y de la barra de menú superior para que se adapte a nuestras necesidades.

Antes de nada debes tener instalada la App gratuita «480i Viewer» en tu tablet o smartphone. Esta App es necesaria para poder previsualizar tus proyectos App en tu propio tablet o smartphone. Para ello accede desde tu smartphone o tablet a App Store o Google Play y busca «480i Viewer».

 

    1. En 480interactive, pulsa sobre “Exportar App” en la parte izquierda de la barra de menú superior y después abre la App 480i Viewer en tu dispositivo .
    2. Cuando finalice la exportación se abrirá una ventana con los dispositivos que tienes añadidos para poder enviar la App a cualquiera de ellos.
    3. Selecciona el dispositivo al que vas a enviar la App y pulsa el botón “Enviar” o añade un nuevo dispositivo mediante el código proporcionado desde la aplicación 480i Viewer de tu smartphone o tablet. (Si tienes dudas sobre este paso puedes consultar cómo hacerlo en éste tutorial: Cómo enviar mi App a mi móvil o tablet )
    4. La App se añade automáticamente a 480i Viewer para que puedas probarla.
    5. En 480i Viewer, pulsa el botón “Descargar” de la publicación. Al hacerlo, se convertirá en un botón “Ver/Abrir”.
    6. Pulsa en “Ver/Abrir” para abrir tu aplicación y acceder a sus contenidos.

     

    ¡Enhorabuena! Ya tienes la aplicación en tu dispositivo, ahora ya puedes ver como queda realmente en tu smartphone o tablet.