#JUVECYL | ALOJAMIENTOS JUVENILES DE CASTILLA Y LEÓN

##Enlaces

• Proyecto juveCyL: http://juvecyl.es/
• Proyecto en GitHub: https://github.com/berikin/JuveCyL
• Página de información http://berikin.github.io/JuveCyL/
• Twitter: https://twitter.com/@juvecyl
• Blog desarrollo y noticias: http://desarrollo.juvecyl.es/
• Página de facebook: https://www.facebook.com/pages/Juvecyl/176063525902980 

##Descripción

juveCyL es un buscador de alojamientos juveniles de la comunidad de Castilla y León que toma los datos del Portal de Datos Abiertos de la Junta.

Cuando el usuario accede a la página web verá un buscador que permite encontrar un alojamiento en concreto introduciendo su nombre completo o parte de él, ver los que hay por tipo (albergue, campamento o residencia) o listar los de cada provincia. Cuando se teclea el tercer carácter la búsqueda comienza, aunque si se prefiere se puede realizar haciendo clic en el icono dispuesto a tal efecto.

###Funcionamiento básico

Si el usuario realiza una búsqueda con éxito, los resultados se mostrarán bajo la caja de texto del buscador. Cada uno aparecerá resaltado con un color de fondo en función de la provincia en la que se encuentre. Esta función permite al usuario reconocer a simple vista los alojamientos de una provincia determinada.

Cada uno de los resultados estará formado por el nombre del alojamiento y la provincia correspondiente. Haciendo clic sobre esta última se efectúa una nueva búsqueda mostrando únicamente los alojamientos disponibles en dicha provincia.

Tras hacer clic sobre el nombre del alojamiento aparecerá la información más importante del mismo. En la parte superior figurará el nombre, dirección, datos de contacto e imagen del alojamiento. Bajo dicha imagen aparecerán una serie de iconos de consulta: servicios, equipamiento, descripción, cómo llegar y actividades.

En la parte inferior del buscador se ubica el botón buscar en mapa, gracias a él tendremos la posibilidad de ver un mapa con la localización de todos los alojamientos disponibles en el fichero. Este mapa muestra su ubicación mediante un icono diseñado expresamente para el proyecto y haciendo clic sobre él veremos el nombre y la dirección del mismo. Otra de las funcionalidades de dicho mapa es la de cálculo de rutas. Haciendo clic con el botón derecho en cualquier parte del mapa se desplegará un menú contextual para definir origen y destino de la ruta.

Los iconos, logotipos y el pie de página han sido diseñados específicamente para el proyecto aportándole un extra de personalización, creatividad y originalidad.

##Objetivos

A continuación describiremos los objetivos y motivaciones que han llevado a nuestro equipo de trabajo a realizar este proyecto.

###Aplicación de los conocimientos adquiridos en la Formación Profesional

La motivación principal que nos llevó a presentarnos al concurso fue la de poner en práctica los conocimientos recibidos durante el curso académico realizando un trabajo completo en equipo.

Enfrentarse a un problema real en grupo poniendo en práctica estos conocimientos es altamente recomendable para mejorar tanto profesional como personalmente y hacer más llevadero el salto entre el mundo lectivo y el profesional.

###Proyecto de la vida real

Acometer un proyecto orientado al uso general exige tener en cuenta determinados factores como el diseño o la usabilidad, por lo que en la fase de diseño se planteó realizar un buscador sencillo con el objetivo de que cualquiera que accediera a la web fuera capaz de poderlo utilizar.

Un reto para nosotros fue el hecho de conjugar la sencillez con la realización de algo llamativo, original y de utilidad para los usuarios. Reto personal

Es innegable que la ambición y el esfuerzo son necesarios para la realización de cualquier proyecto profesional.

En nuestro caso hemos tratado este concurso como un auténtico reto personal en el que demostrar nuestros conocimientos, habilidades y trabajo en grupo y de esta manera incidir en nuestros aciertos y aprender de nuestros errores con vistas a un futuro profesional en este sector.

###Trabajo en grupo

El haber realizado un trabajo en conjunto entre personas que al principio de curso eran unas completas desconocidas ha supuesto una satisfacción extra.

Como sucede en cualquier trabajo en equipo, no siempre se está de acuerdo en todos los aspectos y de ahí surgen debates que hacen mejorar el trabajo y permiten aprender de tu compañero, tal y como ocurre en el mundo profesional.

###Utilización de las últimas tecnologías en el diseño web

El mundo del desarrollo web está en constante cambio y las continuas innovaciones y nuevas plataformas suponen un extra de esfuerzo y dedicación en la realización de cualquier desarrollo.

En nuestro proyecto hemos intentado conjugar el uso de las últimas tecnologías con los conocimientos adquiridos en nuestro centro de estudios. Además, hemos hecho hincapié en la utilización de herramientas de desarrollo profesional con el fin de conocer sus entresijos y que su uso nos facilite el desarrollo.

Tecnologías como HTML5, CSS3, AJAX o jQuery, así como herramientas como GitHub o Sublime Text 2 se han convertido en compañeras de trabajo y desarrollo casi inseparables. Distinción de roles de trabajo

Teniendo en cuenta las habilidades individuales que cada integrante del grupo poseía tomamos la decisión parcelar el trabajo con el fin de agilizar el desarrollo.

En líneas generales cada cual se ha ocupado de su cometido aunque todos hemos tenido voz y voto en el conjunto del proyecto y en último término cada uno de nosotros hemos colaborado con nuestros compañeros en las distintas fases del desarrollo.

Esto ha sido posible gracias al uso de algunas de las herramientas online como las anteriormente mencionadas.

###Potenciación del Turismo Regional, Nacional e Internacional.

Castilla y León ofrece una gran variedad de instalaciones en unos parajes formidables por descubrir. Las ventajas del turismo rural son muchas, como poner en valor lo que se tiene más cerca y que muchas veces se pasa por alto, potenciar la economía interna o entrar en contacto con la naturaleza.

Con nuestro trabajo pretendemos ayudar a potenciar el turismo regional y acercar a los más jóvenes castellano-leoneses a lugares donde puedan conjugar el ocio al aire libre con la cultura, pero también atraer a grupos de otras comunidades.

En los últimos años, nuestra comunidad ha comenzado a ser explotada como destino de aprendizaje de la lengua española para extranjeros y creemos que nuestro proyecto puede ayudar al conocimiento de las instalaciones juveniles por parte de grupos de extranjeros interesados en aprender nuestra lengua o conocer nuestro patrimonio artístico y medioambiental.

###A quién va dirigido

Se optó por el conjunto de datos de alojamientos juveniles porque consideramos que es de gran utilidad tanto para los posibles hospedantes como para los responsables de tales instalaciones disponer de un lugar común tanto para buscar información como para promocionarse.

Con el buscador diseñado pretendemos que los jóvenes puedan encontrar de una manera sencilla el alojamiento que más se adapte a sus necesidades. Las empresas relacionadas con ocio y tiempo libre, la concienciación medioambiental o el turismo rural encontrarán un espacio para consultar toda la red de alojamientos de la comunidad, sus servicios e instalaciones. Para los responsables de los alojamientos es un escaparate para mostrar lo que ofrecen, todo ello, utilizando las últimas tecnologías y aprovechando los datos que pone la Junta a disposición de los ciudadanos.

###Flexibilidad

Nuestra aplicación web ha sido diseñada de tal modo que posibilita la incorporación de otros alojamientos, actividades y organismos. Pensamos en un portal de estas características es indispensable contar con información actualizada y que ello no dificulte sobremanera la labor del desarrollador o administrador.

Dentro del proyecto que nos ocupa la estructura interna podría enriquecerse con nuevas búsquedas, comentarios de los usuarios sobre las instalaciones, valoraciones, nuevas secciones, etc sin necesidad de grandes modificaciones y, dado que utilizamos los estándares más comunes, estos cambios podrían ser llevados a cabo por cualquier programador con los conocimientos suficientes. Del mismo modo, la apariencia puede ser cambiada en fechas señaladas y hacer referencia a festividades o eventos. El aprovechamiento del diseño en este sentido es un atractivo extra del proyecto.

###Dinamismo y concepción social

Hoy en día las redes sociales son una herramienta fundamental para interactuar entre las personas. Desde juveCyL no concebimos el hecho de no tener canales de comunicación entre los visitantes de nuestra página y nosotros para recibir sugerencias, críticas, errores o lo que quisieran decirnos.

Además de establecer un canal de comunicación para fomentar la interactividad entre los usuarios y nosotros, con las redes sociales y el blog pretendemos informar eventos que puedan producirse en nuestra Comunidad y que sean de interés general relacionados con el tema de la página o posibles mejoras realizadas en la web.

##Tecnología utilizada

###Máximo respeto a los estándares

Tal y como se ha mencionado en la sección de objetivos, uno de los principales ha sido construir nuestra aplicación web en base a los conocimientos adquiridos y utilizando los últimos estándares. Por ello nuestro sitio web hace uso de los lenguajes HTML5 y CSS3.

Como es bien sabido, HTML5 es la última revisión del lenguaje de marcado por excelencia en la web y pese a estar aún en fase experimental es ampliamente utilizado en todo el mundo y a la larga supondrá una revolución en la red en cuanto a nuevas posibilidades.

En este caso hemos partido de la base de la plantilla HTML5 Boilerplate la cual permite la construcción de páginas y aplicaciones web rápidas, robustas y adaptables. Dicha plantilla para front-end es utilizada en grandes multinacionales e instituciones como Google, Microsoft o la NASA.

CSS3 por su parte es la última iteración en cuanto a la definición de estilos se refiere, aportando nuevos métodos para dotar a nuestras páginas web de un aspecto único en cualquiera de los navegadores disponibles en el mercado.

###Una web rápida y dinámica

Desde el principio buscábamos una aplicación web dinámica, en la que no hubiera que perder tiempo en refrescos y cambios de página, y esa es la razón por la que se optó por utilizar Ajax.

Por otra parte durante el desarrollo nos dimos cuenta de que las solicitudes al fichero XML de la junta ralentizaban mucho el uso de la aplicación. Por ello se implementaron un par de scripts PHP que se ejecutan automáticamente en el servidor para crear copias locales periódicamente mejorando sustancialmente el rendimiento de la aplicación.

###Ecosistema móvil

En estos tiempos la mayoría de las personas utilizan sus dispositivos móviles para acceder a internet. Por ello hemos intentado que la web se adaptase lo mejor posible a ellos. Como es sabido, la dificultad de conseguirlo es grande y aunque en la mayoría de los casos hemos logrado unos resultados destacables, para aquellos dispositivos o navegadores en los que no se visualice correctamente se ha desarrollado una pequeña aplicación para su correcto visionado. Dicha aplicación puede descargarse pulsando en el enlace que aparecerá al abrir la web en un dispositivo móvil.

###Un estilo propio como valor añadido

Creemos que una web debe estar dotada de un diseño que, por un lado, facilite la navegación y el acceso a contenidos y por otro le aporte una personalidad propia coherente con el fin para el que ha sido diseñada. Las aplicaciones web deben ser espacios en los que el usuario se sienta a gusto y por tanto desee volver a utilizar. En nuestro caso, hemos partido de dos conceptos esenciales a la hora de afrontar la parte gráfica: el concepto de buscador y el de albergue juvenil.

Para el uso del buscador se ha decidido utilizar un color azul que identifique toda la información, que sea vivo pero agradable y permita la legibilidad. Utilizamos formas simples, círculos y rectángulos, sobre un fondo blanco que ocupe toda la página y de una impresión de amplitud. Como el objetivo es la facilidad de navegación, los iconos en común con otros buscadores han mantenido las figuras habituales -buscar es una lupa o el icono de cerrar una x- mientras que en los botones propios de información nos hemos permitido mayor libertad a la hora de crear imágenes.

Dado que la web está enfocada a un público juvenil, se ha optado por decorarla con un pie de página ilustrado y colorista. En él se aprovecha para mostrar algunos iconos de la flora y fauna castellano leonesa, apoyando la identificación de la web con el espacio territorial al que nos remite la web y afirmando el carácter educativo en cuestiones de medio ambiente que desempeñan muchos de los alojamientos juveniles en nuestra comunidad.

En el pie también integramos los logotipos de HTML5, humans.txt, Junta de Castilla y León y la licencia Creative Commons evitando un bloque independiente que rompa con el estilo general y mantenga la limpieza del conjunto.

En definitiva, se ha creado una combinación de elementos vectoriales e ilustraciones que conforman una imagen singular, simpática y atractiva, en la línea de las compañías más punteras de diseño, pero dándole un toque más artesanal con el uso de texturas y formas en la parte decorativa del proyecto.

Las herramientas utilizadas para el diseño han sido principalmente Adobe Photoshop CS6 y Adobe Illustrator CS6. Para las ilustraciones se ha trabajado sobre soporte físico posteriormente digitalizado.

##Sobre nosotros

###José Antonio Yáñez

Diseñador y programador web, siempre actualizando sus conocimientos a través de múltiples estudios relacionados con la informática. Ha colaborado con entidades como la Confederación Vallisoletana de Empresarios y la Fundación General Universidad de Valladolid. Entre su formación cuenta con el título de técnico en Explotación de Sistemas Informáticos y técnico superior en Administración de Sistemas Informáticos y Redes. Actualmente se encuentra estudiando el segundo curso para la obtención de los títulos de técnico superior en Desarrollo de Aplicaciones Web y técnico superior en Desarrollo de Aplicaciones Multiplataforma. Para más información puede visitar su portfolio personal en http://www.jimenezfrontend.es

Funciones:

• JavaScript (lo que incluye JavaScript puro, jQuery y Ajax)
• PHP
• Búsqueda de alojamiento web

###Enrique Diego Blanco

Es Licenciado en Bellas Artes por la Universidad de Salamanca y se ha especializado en animación y diseño en la ESDIP. Tiene una trayectoria multidisciplinar, que abarca desde el diseño al cine, pasando por la ilustración, los cómics o la animación.

Su último cortometraje de animación, Cara de Luna (2012), ha sido candidato a los premios Goya 2013 y ha sido seleccionado en más de 20 festivales internacionales entre los que destacan el International Film Festival of Hiroshima 2012, el NAFF (Bosnia-Herzegovina, 2012) o el Festival Internacional de Cortometrajes de Uruguay (2013). Por proyectos anteriores ha sido ganador del premio Mejor Guión del XXVI Concurso de Cómic Noble Villa de Portugalete por La Presa (2012), finalista en los Premios INVI 2010, premio Mejor Documental del I Festival de Cortos Rodinia (2009) o premio Mejor Corto de Animación de Euskal Herria Nontzeflash 2008.

Es cofundador del estudio creativo Perruncho Studio, que actualmente realiza trabajos de diseño gráfico y diseño web.

En este proyecto se ha encargado de la parte creativa y gráfica aportando su gran experiencia.

Contacto: alcarabeo@hotmail.com

Web Perruncho Studio: http://perruncho.com

Funciones:

• Diseño gráfico

###Ricardo Rodríguez Vaca

Ingeniero Técnico Forestal por la Universidad de Valladolid (ETSIA Palencia) siente verdadera pasión por el mundo rural. Otra de sus pasiones es la informática, por lo que se ha iniciado en el mundo del desarrollo de aplicaciones Web en este 2012 habiendo cursado satisfactoriamente 1º de DAW en el I.E.S Galileo (Valladolid).

Ha visto con gran ilusión como ambas facetas profesionales se han conjuntado a la perfección en este proyecto.

Contacto: rirova81@gmail.com

Funciones:

• HTML5 y CSS3

###Marcos de la Calle Samaniego

Futuro diseñador y programador web. Apasionado de la lectura, de la informática e Internet y de las nuevas tecnologías en general. No concibe su vida sin un ordenador o un libro a su lado. Ha cursado 1º de DAW en el periodo 2012/2013 en el I.E.S. Galileo (Valladolid).

Contacto: marcos.dlcs@gmail.com

Funciones:

• HTML5 y CSS3

##Agradecimientos

Al Instituto IES Galileo de Valladolid (http://iesgalileo.org), compañeros de clase, profesorado y en especial a José Luis Martín por este curso 2012. A la Junta de Castilla y León por dar la oportunidad de demostrar las habilidades a las gentes de esta región con concursos de este tipo. A familiares y amigos por todo el apoyo recibido.