Proyectos RIA sobre HTML5
Los equipos de trabajo de Software Greenhouse para el desarrollo en este entorno no son de más de cinco personas (está por debajo de lo habitual que son 8 de media). Lo hacemos así porque los grupos más pequeños nos permiten una comunicación fluida y desarrollos eficientes, ya que contamos con personas compenetradas y de alto nivel técnico.
Usamos, en la medida de lo posible, una metodología de organización de equipos de proyectos enfocada a SCRUM (en los productos propios, siempre).
Para modelar y describir los sistemas nos basamos en la metodología UML, pero no en toda su extensión. Nos enfocamos principalmente en diagramas y comportamiento (descripción y gráficos de casos de uso).
Durante el desarrollo usamos habitualmente las siguientes herramientas:
- Hi-Team: Para el control y gestión de proyecto, en cuanto a imputación de esfuerzo, avance y control de tareas. Es nuestra herramienta enfocada a la gestión y control de la actividad
- GDP: Para la gestión de incidencias surgidas del test o reportadas por los usuarios. Es nuestra herramienta de ticketing
- Eclipse o VS 2013: Como entornos de desarrollo (IDE)
- Subversion (svn): Como herramienta de control de versiones y catalogación de fuentes y documentos
- Maven o NuGet como repositorios de librerías Java y .NET.
Veamos algunas aplicaciones RIA realizadas por Software Greenhouse recientemente:
HI-SPINS MOBILE
Hi-Spins Mobile
Hi-Spins es una herramienta de BI desarrollada por Software Greenhouse de la cual podríamos resaltar las siguientes características:
- Es eficiente; las consultas se realizan con mucha rapidez
- Es muy fácil de usar, intuitiva. Los usuarios finales realizan y preparan sus consultas desde la aplicación o por medio de un add-in de Excel. Para ello necesitan muy poca formación.
- Se incorporan los nuevos modelos de datos con mucha facilidad
Hi-Spins Mobile es el módulo de Hi-Spins que hemos escrito en la parte cliente con JavaScript, HTML5 y CSS3, para que pueda funcionar en cualquier dispositivo: en estaciones de trabajo y dispositivos táctiles (tabletas y smartphones) con la garantía que da un solo código. La aplicación, Incluso, puede ser encapsulada para iOS o Android. Por esta razón hemos usado el Framework jQuery Mobile que está enfocado a cubrir este requerimiento. La parte servidora está escrita en C# y basada en webservices bajo ASP .NET que sirven como pasarela para el motor del Data Wwarehouse de Hi-Spins que está escrito en C++.
Hi-Spins Mobile permite presentar, en escritorios definibles por el usuario de una forma muy sencilla, varias consultas a la vez con diferentes formatos de representación: tablas, gráficos de barras, sectores, velocímetros, termómetros, etc. De tal forma que el usuario cuenta con una herramienta útil para hacer cuadros de mando y otros informes ejecutivos. Para la representación gráfica usamos la librería de clases Highcharts JS. Y con ello hemos logrado una amplia variedad de gráficos interactivos.
Cuatro consultas en un escritorio de Hi-Spins Mobile
Hi-Spins Mobile, además, permite la presentación de datos embebidos en mapas: valores, barras, etc. (datos que provienen de los cubos de Hi-Spins) y estos mapas son sensibles al click y al paso del ratón.
Los mapas pueden ser proporcionados localmente o por proveedores externos, libres o de pago. Pueden, por otra parte, ser imágenes fijas (mapas de bits) o con representación vectorial, por ejemplo, planos.
La división geográfica o política de un territorio se describe en un modelo de datos multidimensional, habitualmente, como una jerarquía. Para la representación visual de las jerarquías en mapas usamos capas; cada nivel es una capa y estas se pueden superponer sobre el mapa, de esta forma se establece la correspondencia entre las dos representaciones.
Hi-Spin Mobile, con su facilidad de uso de capas en la presentación gráfica, permite, por ejemplo, a un mapa de España superponerle en otras capas las divisiones territoriales, como podrían ser: zonas, áreas, provincias, distritos postales, etc. Hemos usado GeoJSON porque reconoce, además de la conformación de capas como representación visual de los niveles jerárquicos, la representación vectorial de los objetos geométricos básicos: Puntos, líneas, polígonos, multipuntos, multi - líneas y multi - polígonos. Este formato es ampliamente usado en HTML5. Ahora bien, si el origen proporcionado por el usuario tiene otro formato, como podría ser SVG, hay utilidades de conversión entre los múltiples formatos GIS a GeoJSON.
Para desarrollar la interfaz de usuario con mapas, hemos usado la librería de clases Leaflet JS.
En la figura se representan rangos de importes por colores (en una división territorial de España).
BRICK VIEW
BrickView
Pierre Fabré Ibérica tenía la necesidad de una aplicación que permitiera asignar los territorios de una forma dinámica a los visitadores y vendedores, por esta razón utiliza BrickView, aplicación realizada por Software Greenhouse.
IMS, una compañía que proporciona informes de ventas de productos farmacéuticos, divide el territorio español en lo que ellos han denominado Bricks. Un brick es una unidad geográfica que concentra un grupo de códigos postales. A su vez, el territorio de un visitador para Pierre Fabré está compuesto por un conjunto de Bricks.
Lo que se facilita con esta aplicación es que desde un mapa, en este caso de España, se pueda visualizar el territorio de cada visitador (los Bricks que visita) y reasignar de forma interactiva y visual los Bricks a los visitadores. Una vez reasignado un Brick a un visitador, se muestran con claridad los territorios de los visitadores reconfigurados en el mapa.
Esta necesidad exige, por ejemplo, que si se selecciona un visitador en un desplegable, se centre el mapa en el territorio que le corresponde a dicho visitador (sus Bricks) y se acerque esa zona del mapa (zoom). De la misma forma, cuando se selecciona un Brick, se centra el mapa en ese Brick.
Los mapas, además, son sensibles al ratón; cuando se pasa este por cualquier territorio, se va mostrando en una pequeña ventana el nombre del Brick, del visitador y demás información relevante.
En resumen: los mapas permiten zoom, desplazamiento, se repintan de forma dinámica, son sensibles al ratón, etc. Además, hay capas, porque sobre el mapa de España se pintan los Bricks y los territorios de los visitadores.
Para la representación de los Bricks en el mapa de España, IMS entrega un ShapeFile con el trazado de los Bricks dentro del territorio español. Ese ShapeFile lo hemos convertido a GeoJSON y simplificado para evitar grandes descargas. Se desarrolló la aplicación cliente en HTML5, CSS3, jQuery UI y la librería de clases para mapas Leaflet JS. La parte servidora está formada por un servicio web basado en ASP.NET y escrita en C#.
GMX
GMX
Geimex España S.A. requería una aplicación muy ágil de gestión comercial y enfocada a su tipo de negocio. Geimex es una central de compras para el comercio minorista (supermercados). En Geimex hay un gran trasiego de pedidos, albaranes y facturas. A la vez, un número muy pequeños de trabajadores que realizan esa gestión, tres.
Los pedidos vienen de los clientes por mail, fax o en formato XML; estos últimos son depositados en un repositorio. Con la aplicación GMX se rehacen los pedidos para reenviarlos a los proveedores, para después controlar la recepción de mercancía y realizar las facturas a los clientes y recibir las facturas de los proveedores. Tiene comunicación con un ERP, para que este gestione las carteras de clientes, proveedores y la contabilidad.
GMX es una aplicación compleja, por las múltiples tareas que se desarrollan en un sistema comercial.
Para su realización hicimos una investigación previa sobre qué Frameworks de desarrollo era más conveniente utilizar para el GUI y nos decantamos por las clases de GWT (Google Web Toolkit) dada su potencia y gran difusión en este momento. Pero, además, como queríamos recortar el tiempo de programación con GWT, decidimos usar Vaadin como Framework de desarrollo sobre GWT. Con ello hemos logrado, además de un conjunto amplio de herramientas gráficas, abstraernos de las comunicaciones C/S y darle a la aplicación una experiencia de usuario igual a la que tendría con una aplicación de escritorio, con las ventajas de una aplicación web (0 instalaciones e independiente del SO).
Para la capa de persistencia hemos utilizado la implementación JPA (Java Persistence API) que proporciona Eclipselink abstrayéndonos del gestor de base de datos. En este caso, ha sido SQL Server, pero puede ser sustituido en cualquier momento por la gran variedad de gestores que soporta.
Usamos metodología UML de una forma no rigurosa, hicimos especial hincapié en los casos de uso.
Con todo ello hemos logrado desarrollar una aplicación en entorno WEB HTML5 (escrita en Java y en CSS3) muy ágil, cómoda en su uso y con muchas facilidades: Listas configurables, exportaciones a Excel de cualquier lista, importación y exportación de ficheros XML, automatismos, etc.
Para más información sobre Desarrollo de Proyectos y Servicios a Medida, no dudes en consultarnos