驴Tienes una Pantalla t谩ctil, Kiosco o Dispositivo m贸vil en el que deseas crear contenidos que permita a tus usuarios interactuar de manera aut贸noma con lo que puedes brindarles?

隆Nosotros te podemos ayudar con esta iniciativa! 馃槑

Veamos鈥

  1. Debes acceder a tu respectiva cuenta e iniciar sesi贸n como de costumbre.
    Ten en cuenta que actualmente tenemos 3 productos para nuestros clientes: Pantallas, Kioscos y Mensajer铆a. Si cuentas con m谩s de un producto con nosotros te invitamos a que leas el art铆culo 馃馃徎鈥嶁檧锔 隆Nuestra plataforma ha cambiado! 馃馃徎鈥嶁檪锔

  2. Estando en la secci贸n de Pantallas debes seleccionar Dise帽os personalizados en el men煤 lateral y luego Crear dise帽o.

  3. En el panel inferior, debes dirigirte a Propiedades del canvas > asignar un nombre a tu plantilla

  4. Ahora debes definir las dimensiones de tu mesa de trabajo seg煤n tu pantalla.
    Para esto en Propiedades del canvas debes modificar el Ancho y Alto basado en la informaci贸n a continuaci贸n.
    Si tu pantalla es vertical puedes usar ancho 1080 x 1920 alto o ancho 720 x 1280 alto
    Si tu pantalla es horizontal puedes usar ancho 1920 x 1080 alto o ancho 1280 x 720 alto

  5. Una vez hayas definido la orientaci贸n vamos a comenzar con el dise帽o de tu contenido interactivo, por lo que es importante que hayas subido la multimedia que vas a usar (la imagen que pondr谩s de fondo, una imagen transparente en .png para los botones, o la imagen respectiva de cada bot贸n, etc). Esto lo puedes hacer desde Utilidades > Subir media.


    隆Ahora est谩 todo listo para comenzar a editar!

    A continuaci贸n te vamos a explicar las dos maneras en las que puedes personalizar y editar tu contenido interactivo:

1. Dise帽o de fondo con botones incluidos

Dise帽o de fondo con botones incluidos

  1. En el ejemplo en el que vamos a basar esta gu铆a, vamos a trabajar con la imagen a continuaci贸n que muestra un bot贸n negro que dice Ingresar:


  2. Debes definir el fondo.
    En Propiedades del canvas debes seleccionar el 铆cono de imagen ubicado al lado derecho de Fondo > y seleccionar la imagen que deseas.


    Tambi茅n puedes definir un fondo con un control de imagen, asignando el mismo Ancho y Alto que la mesa de trabajo, y la ubicaci贸n Arriba e Izquierda en 0.

  3. Ahora que tu mesa de trabajo tiene fondo, debes seleccionar un control de bot贸n y arrastrarlo para ubicarlo sobre el espacio que ya tengas definido como tu bot贸n.
    Continuando con el ejemplo anterior que escogimos, el bot贸n corresponde al t铆tulo Ingresar que est谩 en un recuadro negro.

  4. A continuaci贸n, debes asignar la imagen transparente al bot贸n que acabas de a帽adir.
    Para esto debes seleccionar el bot贸n que acabas de a帽adir > en el men煤 lateral derecho en Propiedades, debes seleccionar el 铆cono de Media > seleccionar la imagen transparente > y de nuevo en el men煤 Propiedades, en Color de fondo debes bajar la barra lateral derecha o escribir rgba(255,255,255,0) y presionar Enter > y finalizar haciendo clic en Guardar.

  5. Ahora que tienes tu dise帽o inicial casi listo, debes proceder con la creaci贸n de la lista de reproducci贸n que vas a usar para mostrar el contenido en tu dispositivo y en 茅l a帽adir la plantilla o dise帽o personalizado que acabas de guardar en el paso anterior y dem谩s multimedia.


    (Si no sabes c贸mo crear tu lista de reproducci贸n haz clic aqu铆)

  6. Luego debes volver a la plantilla en Dise帽os personalizados del men煤 izquierdo y seleccionar la plantilla respectiva para acceder de nuevo al editor.

  7. Ahora, debes asignar una acci贸n a tu bot贸n de Ingresar. En nuestro caso el bot贸n nos va a redireccionar a una imagen de Tekus.
    Para esto, en el men煤 Propiedades, en Acci贸n debes elegir la opci贸n Ir a > luego debes hacer clic sobre el recuadro derecho > hacer clic sobre el Seleccionar que corresponda a la lista de reproducci贸n creada en el paso 5 > seleccionar la imagen a la que deseas acceder al tocar el bot贸n Ingresar en tu pantalla > y hacer clic en Guardar.


    隆Ahora tienes tu dise帽o listo y con el bot贸n interactivo funcional! 馃コ

  8. Por 煤ltimo debes vincular la lista de reproducci贸n a tu pantalla y 隆Voil脿!
    Si no sabes c贸mo, haz clic aqu铆.

2. Dise帽o de fondo sin botones

Dise帽o de fondo sin botones

  1. En el ejemplo en el que vamos a basar esta gu铆a, vamos a trabajar con la imagen a continuaci贸n, la cual no muestra ning煤n bot贸n en su dise帽o, por lo que los botones se deben a帽adir desde el editor de plantillas:


  2. Debes definir la imagen que deseas mostrar en tu dise帽o.
    En Propiedades del canvas debes seleccionar el 铆cono de imagen ubicado al lado derecho de Fondo > y seleccionar la imagen que deseas.


    Tambi茅n puedes definir un fondo con un control de imagen, asignando el mismo Ancho y Alto que la mesa de trabajo, y la ubicaci贸n Arriba e Izquierda en 0.

  3. Ahora que tu mesa de trabajo tiene fondo, debes seleccionar un control de Bot贸n y arrastrarlo para ubicarlo sobre el espacio en el que deseas que se muestre y seleccionarle una imagen.
    Continuando con el ejemplo anterior que escogimos, vamos a crear un bot贸n que me lleve atr谩s y otro que me permita volver al men煤 inicial.

  4. A continuaci贸n debes asignar la acci贸n que deseas que haga cada bot贸n, y hacer clic en Guardar.

  5. Ahora que tienes tu dise帽o inicial casi listo, debes proceder con la creaci贸n de la lista de reproducci贸n que vas a usar para mostrar el contenido en tu dispositivo y en 茅l a帽adir la plantilla o dise帽o personalizado que acabas de guardar en el paso anterior y dem谩s multimedia. (Si no sabes c贸mo crear tu lista de reproducci贸n haz clic aqu铆).

    Tambi茅n debes definir en el 铆tem de la plantilla que lleva el bot贸n de inicio cu谩l es el 铆tem al que ser谩s redireccionado al presionar el bot贸n.

    En nuestro ejemplo el 铆tem Tekus interactivo lleva el bot贸n inicio, por lo que dfinimos en ese 铆tem que queremos ser redireccionados a Men煤 interactivo al presionar ese bot贸n.


    隆Ahora tu dise帽o nuevo tiene botones completamente funcionales! 馃コ

  6. Por 煤ltimo debes vincular la lista de reproducci贸n a tu pantalla y 隆Voil脿!
    Si no sabes c贸mo, haz clic aqu铆.

A continuaci贸n te brindamos una gu铆a breve de opciones adicionales que puedes usar con arkbox para mejorar la experiencia de tus usuarios: