Transiberiano

Proyecto final Divino

Como proyecto final nuestro objetivo era crear una aplicación para una vinoteca. El objetivo de esta aplicación es que los clientes puedan aprender sobre la existencia de diferentes vinos, ya sea por regiones o diferentes cosechas. También recomendamos vinos para diferentes tipos de comida.

Por último, hemos desarrollado un juego dinámico que aportará tanto entretenimiento como aprendizaje a nuestros clientes. Además, dará la posibilidad de poder obtener un descuento en sus compras en caso de haberlo realizado correctamente.

Antes de nada, nada mas ejecutar la aplicación se abrirá un breve video hecho en cinelerra que nos situe en el entorno de la vinoteca y nos lleve al menú.

El menú nos ofrece las distintas opciones que podemos hacer con nuestra aplicación. El objetivo de esta aplicación era ofrecer un tono amigable y cercano, que lleve a la gente que no tiene un gran conocimiento sobre vinos a sentirse cómodo al manejarla. Tanto esta interfaz como el resto están hechos con photoshop.

Si por ejemplo clicamos en el bocadillo de buscar vino para determinadas comidas nos llevará a esta nueva interfaz:

En esta podremos elegir el diferente tipo de comida con la que queramos acompañar nuestro vino. Al pulsar alguna de las opciones (carne, por decir una), nos mostrará el siguiente listado de vinos.

En todas las pantallas tendremos la opción de volver tanto a la pantalla anterior como al menú principal.

Al igual que podemos elegir el tipo de comida para el que queremos destinar el vino, de una misma manera podremos elegir que nos ofrezca una distinta variedad de vinos dependiendo de la región o cosecha a la que pertenezca.

Cada botón que pulsemos nos llevará a un listado de nuestros vinos seleccionados.

Finalmente tendremos el juego con el que los clientes podrán obtener un descuento en caso de acertar todas las preguntas. Cada vez que dejemos a medias la ejecución del juego el contador de aciertos y fallos volverá a inicializarse.

Utilizamos photoshop, director y cinelerra para realizar el proyecto. Hicimos todo conjuntamente, y conforme realizábamos algo nuevo lo implementábamos en la versión conjunta.

Tuvimos problemas para realizar un video, ya que en nuestros propios ordenadores no nos funcionaba correctamente el cinelerra, por lo que tuvimos que hacerlo el último día de clase. Debido a ello (y que durante el mismo día de clase también tuvimos problemas con este programa) terminamos sacando un video peor del que esperábamos.

Por otro lado, estuvimos pensándo en diferentes maneras para que al pulsar los botones de la aplicación estos se oscureciesen o cambiasen de color. Al final nos decidimos por hacer diferentes imágenes y que cuando se pulsase el botón la primera imagen se borrase completamente y la nueva tuviera una opacidad del 100%.

Finalmente, teníamos idea de que los usuarios guardasen los resultados de las partidas que realizasen con el juego, y que si se salían del juego en mitad que tuvieran la posibilidad de retomar la partida desde el mismo punto. Esto estuvimos buscando maneras de llevarlo a cabo, pero al final no supimos realizarlo.

vacunación para safari

Hemos simulado mediante adobe director una web explicativa para la empresa Class&Food. Ésta es una cadena de comida rápida de muy alta gama que está buscando franquiciadores para extender su negocio. Para ello hemos creado varios apartados en la “web” en los cuales se explica las siguientes características de la empresa:

•    Nuestras señas: Aquí explicaremos mediante un pequeño texto descriptivo, el estilo del local así como el del personal que atiende el mismo. Además, en este apartado se dispondrá de dos galerías de imágenes para ejemplificar lo antes expuesto

•    Nuestros platos: El funcionamiento de este apartado es muy similar al anterior, pero esta vez centrado en los platos ofrecidos por el restaurante. Al igual que antes, incluimos una pequeña descripción escrita y una galería de fotos.

 

 •    Clientes: En esta sección tendremos una breve descripción de los clientes que frecuentan Class&Food, así como una pequeña muestra de fotos de los mismos.

•    Socios: Un breve repaso de las marcas que colaboran con nosotros.

 •    Datos económicos: Aquí mostraremos la evolución económica de nuestra empresa. Incluye gráficas sobre ingresos y beneficios, cuota de mercado y evolución financiera.

•    Simulador: Debido a que está es una “web” para la captación de franquiciados dispones de un simulador para estimar el rendimiento económico de una futura franquicia. En el introduciremos los parámetros de habitantes de la zona, renta media e inversión inicial para obtener una gráfica explicativa.

Esta sección ha sido la que más tiempo y esfuerzo nos ha costado. Para empezar, los desplegables para las variables de renta per cápita, habitantes de la zona e inversión. Estos constan de varias imágenes, simulando un desplegable, y al pasar sobre una de las opciones ésta se resalta cambiando la transparencia de una imagen por otra. Una vez seleccionadas las tres variables en los desplegables aparecerá la gráfica correspondiente, hecha con el programa Matlab. Al cambiar los parámetros la transparencia de esta imagen la ponemos a 0 y a 100 la de la gráfica nueva.

 Además de estos apartados, disponemos de un pequeño video introductorio con el logo de la empresa, así como un apartado de inicio con un video que muestra un popurrí de imágenes diversas de la empresa.

E4C

Durante estos meses hemos estado trabajando duro para poder ofrecer una experiencia totalmente interactiva a la par que ilustrativa sobre las energías renovables y el modelo energético que ha desarrollado la empresa E4C. Se ha explotado al máximo la estrategia de gamificación para que el usuario se sienta más cercano y amenizado a través de la interacción.

Estas son las pantallas de nuestra aplicación:

- Pantalla principal en la que tenemos un vídeo de promoción y un guia pájaro que indica a donde lleva cada una de las opciones que el usuario puede escoger.

- Pantalla en la que podrás ver que es E4C centrados en el medio ambiente. 

Dentro  de cada clase de fuente de energía, el usuario puede escoger entre diferentes medio ambientes y comprobar el impacto beneficioso de las propuestas sobre las existentes no renovables.

- En la otra pantalla podrá ver la posible planificación para llevar a cabo una instalación de sistemas de explotación renovables. El usuario puede utilizar la paleta de símbolos para realizar una simulación del coste que supondría la instalación  y el impacto que generaría al medio.

Y en los ejemplos un vídeo sobre nuestras instalaciones... Una experiencia Turing-completa en la que se invita al espectador a visitar las oficinas e instalaciones de la compañía.

El desarrollo ha sido intenso y cada una de las fases y pantallas ha requerido de nuestros más grandes esfuerzos, tanto para idear el concepto como para llevarlo a cabo en Adobe Director ®.

En un principio teníamos pensado crear una infografía interactiva para la pantalla final ejemplos. Sin embargo, llegamos a la conclusión de que sería mucho más ameno para el usuario poder ver un vídeo en el que aparecieran los responsables de la empresa explicando la misma. Dentro vídeo...

Producto extra

El equipo de diseño Class&Food también ha desarrollado por petición de su cliente Fruxotic, una papeleta informativa con la que potenciar en mayor medida la fidelización de clientes.

Dicho panfleto contiene el nombre de la comparía "Fruxotic", un eslogan "Disfruta nuestra exótica fruta" y un código QR con el que descargar la aplicación.

El resultado final se puede apreciar en la siguiente imagen.

Producto final: La careta

Somos los desarrolladores contratados por "La careta" y este es el resultado de nuestro trabajo.

Durante este tiempo hemos desarrollado una aplicación interactiva que permite confeccionar disfraces personalizados, basados en la superposición de complementos sobre un maniquí. Esta aplicación debe interpretarse como una primera versión del producto para la empresa, dado que todavía no disponemos de todo su catálogo y únicamente se han incluido unos pocos modelos de disfraces.

La función principal de la aplicación pretende ser la de un catálogo online en la que además de poderse ver los disfraces, se pueda hacer una solicitud de presupuesto del disfraz confeccionado a la tienda.

La primera vista de la aplicación muestra una escena cuidadosamente tratada, en la que puede verse el logo de la empresa en los pliegues de un telón la siguiente forma:

En esta escena deberá pulsarse en la cuerda del telón, que tras esto, elegantemente se desplazará hacia abajo mostrando el cartel con el menú principal:

Volver a pulsar sobre la cuerda hará desaparecer de la misma manera el menú.

En este punto puede quererse una breve explicación de como funciona la aplicación. Para esto se ha diseñado el botón tutorial, que mostrará un nuevo cartel con este contenido.

Una vez leído puede cerrarse dándole al botón de aceptar.

Para crear un nuevo disfraz basta con, desde el menú principal pulsar el botón "Nuevo". Esto abrirá progresivamente el telón dejando ver el maniquí con la ropa estándar.

En esta vista pueden editarse cada una de las partes del maniquí haciendo click en las flechas correspondientes, dando lugar a los más estrambóticos disfraces. Además, para tratar de hacer sonreír al posible usuario, dado que un disfraz es un complemento de ocio y diversión, sonará de fondo durante esta escena el ya clasico "Awesome song" de Barney Stinson.

Desde este momento, en cualquier instante puede volver a desplegarse el menú principal haciendo click en el menú principal, ya sea para reiniciar el modelo, para volver a ver el tutorial, para cerrar la aplicación o para enviar el disfraz a la tienda y solicitar un presupuesto desinteresado.

Al pulsar este último botón se abrirá un formulario estándar de envío de correo con la información del disfraz actual, ya automáticamente introducida. En este correo puede introducirse toda la información que se desee, pero es importante para mantener la veracidad del presupuesto, que no se modifique la linea con las partes de los disfraces.

Por último puede cerrarse el telón y la aplicación con el botón de salir.

 

 

Los problemas principales encontrados durante la realización del proyecto han tenido que ver con la edición y tratamiento de las imágenes. Ha sido bastante costoso encontrar imágenes que cuadren adecuadamente con el modelo elegido. Además ha habido que recortarlas teniendo en cuenta las proporciones del modelo.

 

Otro punto bastante problemático ha sido trabajar con todas las imágenes superpuestas en director. Al basarse en opacidad de capas,  todas las imágenes ocupan el mismo espacio en el lienzo de director, con lo que al tratar de ajustarlas siempre se selecciona la que ocupa la primera posición en esa coordenada.

 

 

Como otros problemas, cabe añadir que al trabajar en diferentes ordenadores con diferentes resoluciones y tipos de letra, ha habido ciertos problemas con la compatibilidad en este sentido. De la misma forma, y en este problema se ha caído en el último momento, en los ordenadores que no tienen un cliente de correo por defecto, no se abre el formulario de correo para enviar a los desarrolladores la configuración elegida.

 

 

Por último, hay que comentar que al trabajar con diferentes programas de edición de imagen, sobre distintas plataformas y al trabajar con distintas versiones de director ha habido temas de compatiblidad que solucionar durante las importaciones.

 

 

Los scripts más problemáticos han sido los de cerrar la aplicación y envío de correos. Para el cierre de la aplicación no se consiguió encontrar fácilmente el método, y se decidió un método estándar de cierre de aplicación lingo, que incluso cierra director si se pasa por el frame. Para el envío de correos se estudiaron varios métodos, basados en capturas de pantalla, pero finalmente se decidió enviar los códigos de cada uno de los complementos elegidos.