Integrando Google Maps con nuestro HTML

6 Comentarios | Escrito por Cristian el 6 de Febrero de 2008

En el post anterior contábamos cómo habíamos resuelto la ubicación de sucursales del Banco Edwards Citi con Google Maps y un poco de AJAX. Dicha integración a pesar de lo simple que resulta para el usuario, fue nuestra primera experiencia utilizando Google Maps para un proyecto coorporativo.

Creemos firmemente que la integración de los servicios Web marca las pautas del desarrollo Web actual, y éste resultó un claro ejemplo de cómo integrar un servicio gratuito, disponible para todo el mundo adaptándolo a las necesidades del cliente dentro de nuestro propio desarrollo.

Técnicamente lo único que necesitamos fue una cuenta de Gmail para personalizar los mapas y guardarlos en nuestras preferencias de Google Maps.

Luego se realizó un minucioso proceso de buscar cada sucursal dentro de Google Maps, y comparar su ubicación con MapCity que es un referente local. Cada una de estas búsquedas se guardaban y se agrupaban por comunas. Una vez definidos los mapas dentro de Google Maps éstos se hacen públicos para que cualquier persona que entre directamente al sitio de Google Maps y busque por Banco Edwards se desplieguen las sucursales con los mapas previamente creados y guardados.

La inteligencia de la integración fue disponer las sucursales dentro de tablas, que ocupando una librería javascript despliega cada uno de los mapas en un iframe. Estos mapas son llamados mediante id’s a un javascript que contiene las ubicaciones guardadas y personalizadas en Google Maps.

A esto hay que sumar que en AyerViernes trabajamos con HIJAX, que es la denominación que distingue al AJAX accesible. Por ende si el navegador no dispone de javaScript, o lo tiene desactivado, el contenido se despliega en una página independiente de cada sucursal, con una imagen del mapa en ella.

Como dato aparte, las librerias de javascript que usamos en AyerViernes suelen ser las ya clásicas Prototype, Scriptaculous. Pero en el caso del sitio del Banco Edwards Citi una vez que el sitio estaba prácticamente terminado tuvimos que cambiar todo a jQuery porque, para este efecto, era sólo eso lo que necesitábamos y el cambio reducia considerablemente el peso del sitio.

Sin embargo, este cambio fue transparente y no afectó en nada al desarrollo anterior, ya que nuestro XHTML no tiene nada de javascript, sólo usamos id’s para conectar con las librerias.

Archivado en: Investigación y Desarrollo, Accesibilidad, Ajax

Ajax en el Banco Edwards Citi para una buena Experiencia de Usuarios

3 Comentarios | Escrito por Jorge el 31 de Enero de 2008

Cuando empezamos a sumar habilidades Ajax a nuestras interfaces siempre sentimos lo útil que sería en sistemas de banca online. La abreviación que inventara Garret para una conferencia hoy es constantemente usada en sitios enormes como Yahoo, Gmail y lo que busca es hacer la vida de los usuarios más fácil con interfaces eficientes y naturales en sistemas online.

Hay detalles que hacen la diferencia y hacen la interfaz de usuario más elegante y efectiva, ahorrándole tiempo y que al final crean confianza y aprecio de los clientes al ver que las cosas fueron hechas pensando en ellos.

Pero usar Ajax no es un recurso para impresionar al Cliente. Debe ser parte de la Diseño de la Inteligencia del Negocio online y convocar otros recursos, todos en beneficio de dar más por lo mismo y una Experiencia de los Usuarios  positiva para cosntruir fidelidad con la marca.

Un Usuario no viene a buscar Ajax ni términos raros, viene a hacer cosas en la web. Lo que importa siempre es el valor agregado que entregamos a nuestros clientes online para que hagan cosas y éstas le sean útiles y a sus vez efectivas.

Un buen ejemplo de lo anterior es la solución que dimos al Banco Edwards Citi para mostrar sus sucursales a nivel nacional. Es una excelente muestra de inteligencia de negocio, Ajax, código puro (gracias Basilio+Tri!) y Google Maps.

Está lleno de pequeños pero importantes detalles, como el uso de los colores (verde para activar, rojo activado), el despliegue y tamaño de los mapas, el uso del código en el Ajax, la fineza de la entrega de la información, la relación de la sucrusal buscada con otras en el mismo sector, etc.

Nada de esto se logra si nuestro Cliente, el Banco de Chile no creyera en que es posible entregar mejores experiencias a los sus clientes online.

Archivado en: Ayerviernes, Accesibilidad, Ajax

Chao 2007, hola 2008!

Sé el primero en comentar | Escrito por Jorge el 31 de Diciembre de 2007

Archivado en: Investigación y Desarrollo, EyeTracking, Ayerviernes, Usabilidad, Accesibilidad, Seminarios, Ayerblogs, Xplica, AyerLab, Beca Alzado

Banco de Chile lanza ChilePyme 100% accesible

Sé el primero en comentar | Escrito por Jorge el 16 de Octubre de 2007

Nuestro Cliente, Banco de Chile lanzó el pasado 14 de octubre su nuevo Portal dirigido exclusivamente al mundo Pyme, ChilePyme.

Cabe destacar que éste es el primer y único sitio web de la banca chilena que cumple con los estándares y la accecibilidad nivel A.

El sitio completo está desarrollado bajo estándares W3C, navegación por teclas y CSS2.

El proyecto liderado por los profesionales de Banca Electrónica es parte de un proceso integral de rediseño que nos ha encargado para varios proyectos en distintas áreas del banco y que ha sabido detectar, estudiar y asumir las normas de accesibilidad, estándares y calidad en los procesos en sus sitios web tanto en niveles públicos y transaccional.

Archivado en: Ayerviernes, Usabilidad, Accesibilidad