Merlos.org Inicio | Mi Blog | Mis documentos | Mis Programas | Mis Páginas | Miscelánea

Archive for the 'Desarrollo Web' Category

calltube se presenta en la Barcamp 3

Wednesday, October 29th, 2008

Seguimos en modo promoción de calltube. Ya dimos una charla en TheCocktail el Jueves pasado y  ahora toca en la Barcamp 3 en la Escuela de Teleco de Madrid.

La ponencia será mañana Jueves 30 de Octubre a las 18:30. Intentaremos que sea amena, contando anécdotas y no muy larga. Así que, si puedes ¡¡¡acércate!!!

La Barcamp 3 es una jornada que organiza Open Movilforum y que está compuesta por micro-ponencias donde distintos invitados expondrán su visión sobre temas relacionados con el desarrollo en móviles y el mundo móvil en general. Tras cada ponencia  se abre un turno de preguntas, respuestas, aportaciones y donde seguro que de esto surge algún intercambio de código o ideas sobre las que seguir trabajando.

Además, se entregarán los premios del 3º Concurso Mashups, en el que calltube fue el ganador y se presentarán los proyectos finalistas.

calltube, tus videollamadas en Youtube

Tuesday, September 23rd, 2008

calltube

Bueno, habréis notado que llevo unos días sin escribir en mi blog, cuando parece que lo había retomado con fuerza. La última entrada fue el día 20 de Agosto en el que explicaba cómo se hace una captura de pantalla con el iPhone, casi un mes después vuelvo a escribir.

Este mes de silencio, además de unirse con las vacaciones, veranito y demás ha coincidido con el desarrollo de un nuevo proyecto que ayer vio la luz por primera vez.

El 18 de julio salieron las bases del III concurso de mashups de movilidad de Open Movilforum, además, un tiempo antes habían publicado una API de Recepción de videollamada. Entonces, yo me pregunté, qué puedo hacer con el vídeo grabado de una videollamada… y la respuesta era bastante obvia… SUBIRLA A YOUTUBE.

Dejé la idea aparcada porque en verano me dediqué a juguetear con el Google App Engine.

Ya era 29 de agosto y volví a echar un ojo al concurso, ya no recordaba las fechas y tal, y le comenté a un amigo la idea: “Venga vah, anímate, el premio está guay y el proyecto mola”. Le convencí, así que ese día hicimos algunas búsquedas para ver la viabilidad del proyecto, resolver las dudas de implementación y demás, así como evolucionar un poco la idea, fijar objetivos,  algunas prioridades de las cosas que tenía que tener y cosas que molaría que tuviera, descartar aquello que fuera muy costoso desde el punto de vista de la implementación, etc.

El concurso terminaba el día 18 de Septiembre, teníamos 20 días… y ninguno de los dos estaba de vacaciones. Un desarrollo ágil y rápido iba a ser fundamental.

Unos días después, tras algunos problemas con la API de recepción de videollamadas, éramos capaces de unir el stream de audio y vídeo (en las videollamadas vienen como flujos separados) y subir los vídeos a youtube.

También, habíamos pensado, que vale, subir un vídeo a youtube está chulo, pero lo que estaría genial sería poder decírselo a tus amigos.  Así que, ya habíamos estado mirando las APIs de las redes sociales que conocíamos para ver cuáles eran viables de usar en los pocos días que teníamos.

Finalmente, tras descartar Facebook por temas de tiempo, nos quedamos con la propia de youtube,  twitter (microblogging), delicious (social bookmarking) e ipoki (red social de geolocalización).

Por otro lado, una de las APIs del Open.mofilforum, es la de Localízame, que nos permitía geolocalizar al usuario en el momento en el que generaba el vídeo.  Aunque, la API original de Localízame devuelve un texto en parecido a “el usuario se encuetra entre la calle tal y la calle tal, cerca del recinto ferial fulanito con un radio de 1 km”, de la respuesta se pueden extraer las coordenadas UTM y de ahí convertirlas a Latitud y Longitud, que son las que usa Youtube, Ipoki y Google Maps. Haciendo estos malabarismos consigues geolocalizar el vídeo automáticamente, sin que el usuario necesite tener GPS en el móvil. La verdad es que esto mola un montón… aunque el servicio localízame de movistar es muy caro.

Finalmente, presentamos calltube al concurso y hoy día 23 de septiembre han anunciado los ganadoresY hemos quedado primeros oe, oe, oe, oeeeeeeee, oeeeeeeee, oeeeeeeeee!!!

Un par de capturas:

[caption id="" align="alignnone" width="574" caption="CalltubeIndex"]CalltubeIndex[/caption]

Mi primera aplicación Google App Engine

Monday, July 21st, 2008

@jipipayo me comentó el viernes pasado que el Google App Engine tenía muy buena pinta. Pues el muy condenado hizo que me picara la curiosidad. Hoy lunes, 4 días después he terminado de probar la primera aplicación usando Google App Engine.

He de reconocer que no es una aplicación original, sino que sólo he seguido un fantástico Screencast de los developers de Google.

Mi Google App Engined

Google App engine es un framework que te permite crear aplicaciones web de una forma relativamente sencilla. De momento sólo funciona si picas código en Python. Yo no sé programar en Python y en 15 minutillos puedes aprender la sintaxis si ya sabes otro lenguaje orientado a objetos. Hay mucha documentación por la red.

Pencil Project - Prototipado con Firefox

Wednesday, July 9th, 2008

Pencil project es una herramienta de prototipado de webs que usa como motor de rendering el Firefox 3.  Parece una herramienta sencilla suficiente para hacer prototipados básicos, aunque cuando la use un poco más podré comentar qué tal me ha parecido.

Captura de Pencil

Control JS Slider al estilo iPhone

Tuesday, June 10th, 2008

Alex Boone, se ha currado un control hecho en Javascript usando jQuery simula el desbloquear el iPhone.

Hasta ahí bien, el caso está en que en tanto el autor como en algún blog se ha comentado la posibilidad de usarlo como CAPTCHA. Los CAPTCHA se utilizan en los formularios para evitar que de forma un programa maligno (o bot) rellene el formulario de forma automática. Los captchas suelen ser imágenes de letras un tanto deformadas o con elementos que no permiten visualizarlas con total claridad

Con esto se evita, por ejemplo, crear miles de cuentas o enviar cientos de comentarios a una entrada de un blog con publicidad.

En este caso, el CAPTCHA simula la acción de desbloquear un iPhone:

Captcha iphone

Por desgracia, de color bien, pero no flota. Si vemos cómo funciona, cuando mueves la flecha a la derecha, lo que hace el JS es llamar a una funcion handler.

En el siguiente trozo de código puedes ver como se crea el CAPTCHA en JS:


var s2 = new Slider("slider2",{
 message: "turn off the lights!",
 color: "red",
 handler: function(){
  $("body").css("backgroundColor", "black");
 }
});

Cuando se mueve la flecha a la derecha, se llama a la función que hay después de handler. El programador tendría que idear alguna forma para saber que no ha sido un bot el que ha enviado el formulario ¿pero cómo?

Los CAPTCHA generalmente son imágenes porque cualquier acción escrita en texto puede leída, parseada y emulada por un bot, sin embargo, las imágenes requieren un procesado digital de la susodicha imagen, una tarea no tan trivial.

En resumen, por sí sólo el control no es un CAPTCHA y dudo mucho de que sirva para tal fin, pero como control sí que está chulo.

Ya llevo 9 años de webmaster

Saturday, May 31st, 2008

Parece que fue ayer cuando en mayo del 1999 publicaba la primera versión de mi página personal. Ya han pasado 9 años desde entonces y la página ha evolucionado mucho.

Tercera versiónLa primera versión estaba hecha con el Frontpage 2.0 que por entonces se distribuía de forma gratuíta. Recuerdo que mi primer hosting fue Fortunecity.com, gratuíto y que permitía subir HTML. Yo no tenía conexión a internet desde casa y lo subía usando unos ordenadores súper pochos con Linux que habían preparado la asociación de alumnos en la Universidad.

En la captura de la izquierda puedes ver ya la tercera versión. Todavía usaba frames :D, y no había coherencia en el interfaz entre las diferentes páginas,.

Poco a poco fui aprendiendo algunas cosillas y empecé a probar el Dreamweaver que andaba por la versión 3, creo, y por entonces, era de Macromedia. Era el programa para diseñas páginas más avanzado de la época y tenía la ventaja sobre los demás de tener Templates o Plantillas. Hacías un esqueleto de la página y ya sólo te tenías que preocupar del contnido.

Por aquella época, lo que tenía en la página era casi todo recopilaciones de chistes, leyes de murphy, algo de música en MOD/S3M (¡hablo de cuando no había mp3 o apenas se conocía!), las poesías de mi abuelo, algunas imágenes. Muy poco contenido original mío.

Merlos Network V5

Llegó un momento en el ya controlaba HTML y en el Dreamweaver ya me resultaba incómodo de usar porque tenía que andar limpiando el código fuente que generaba, muy pesado y basado en tablas.

En Julio del 2002 puse en producción la versión 5.0. La que ves en la captura de la derecha. Todavía con colores negros, aunque ya el HTML es validado. Me empiezo a volver un poco purista con el HTML y quito contenido que no era mío y a generar contenido propio (tutoriales, programillas, etc.)

Es en la versión 6.0, mayo del 2003 es donde introduzco por primera vez el color blanco, abandonando el estilo underground que había mantenido hasta entonces. Ahora uso un simple editor de texto y elementos DIV y hojas de estilo CSS para la maquetación del interfaz.

Pasan 3 años y en agosto del 2006 publico la versión 6.5, que, sobre todo, introduce novedades técnicas como smarty, mod_rewrite y MySQL.

Hoy he actualizado la página, versión 6.6, 9 años después de que viera por primera vez la luz esta página personal y la he convertido un tanto más dos-punto-cero. Ya que he añadido JS de los contenidos que genero en redes sociales como twitter, flickr o unvlog.
Además, el blog es el único protagonista de la portada.

Entrega de premios Barcamp2

Friday, May 30th, 2008

Entrega del tercer premio de la barcamp2

En la foto me puedes ver en la entrega del 3er premio por twittsms. De Izquierda a derecha, Santiago Gala (Apache Software Foundation), Juan Manuel Merlos (yo mismo, premiado por twittsms), Concepción  San Antonio (Open Movilforum).

Me dieron un cheque gigante, ¡¡Cómo los de la tele!!

Barcamp2, Jornada sobre movilidad y Web 2.0

Friday, May 30th, 2008

La Barcamp2 se celebró el pasado martes 27 de Mayo en la Escuela de Telecomunicaciones de la Universidad Politécnica de Madrid. Yo estuve allí, aunque no en todas las ponencias, ya que por motivos de trabajo tuve que ausentarme una parte del día.

En esta entrada tienes mi visión de la Jornada.

Antes de nada, para el que no sepa qué es la Barcamp, comentar que trata de una jornada para poder compartir opiniones y experiencias sobre el mundo móvil y la Web 2.0. Está organizada por Open Movilforum junto con TheCocktail, y forma parte de una iniciativa que pretende abrir a desarrolladores independientese y del mundo de código abierto los servicios de Telefónica Móviles de España. Tienes un artículo del periódico El País en el que sus responsables comentan el objetivo de este proyecto.

Durante la jornada se han realizado diferentes micro-ponencias (de unos 20-30 minutos), en las que se han tratado temas como el presente y futuro del desarrollo de aplicaciones para móviles, análisis del SDK del iPhone o android, Modelos de negocio Open, Autenticación móvil usando OpenId, la iniciativa open de Telefónica I+D Mobile Manager, la red social móvil Festuc y, por supuesto, hubo una ponencia sobre twittsms.

Una ponencia muy interesante fue la de Miguel Lizondo, de deimos-space.com, titulada “Desarrollo para móviles Presente y futuro“, en el que comentó las diferentes plataformas actuales de desarrollo analizando los pros y los contras, así como una visión de cómo sería el desarrollo en el futuro para él.

Resumo brevemente esta ponencia. Las plataformas actuales:

JME (antes J2Me)

  • A favor:
    • Muy documentado y soportado, con lo cual los desarrollos pueden ser más rápidos.
    • Lenguaje fácil
    • Es perfecto para videojuegos.
  • En contra:
    • Fragmentación (incluso dentro de un fabricante) debido a que las JSR tienen muchos requisitos como opcionales, por tanto, un desarrollador puede encontrarse con que alguna funcionalidad que necesita no está implementada.
    • Basado en un modelo software Sandbox, por lo que no se tiene acceso a recursos como contactos, sms, sistema de ficheros, etc.
    • Una anécdota que comentó es que dado que está tan orientado a juegos, aplicaciones profesionales al instalarlas aparecen en la carpeta de Juegos en algunos terminales.

Symbian

  • A favor:
    • Acceso completo a recursos (contactos, sms, ficheros)
    • 25% más rápido que JME,
    • Buena documentación y soporte.
  • En contra:
    • Se programa en un C++ no estándar
    • Binarios incompatibles entre diferentes versiones del sistema operativo Symbian
    • El desarrollo del sistema operativo en sí está monopolizado por Nokia.

Windows Mobile

  • A favor:
    • También acceso completo a recursos (contactos, sms, ficheros)
    • Cada vez más extendido
    • Buena documentación.
  • En contra:
    • Fragmentación
    • No existen entornos de desarrollo gratuítos, hay que pasar por el Visual Studio o similar.

Blackberry (RIM)

  • A favor:
    • Muy extendido en entornos empresariales, ideal para aplicaciones de este sector
    • IDE gratuito
    • Acceso a recursos de sistema.
  • En contra:
    • También, al ser un dispositivo muy segmentado, no permite desarrollar aplicaciones más generalistas
    • JAVA pero con API a acceso a recursos y propietaria.

Por otro lado, Miguel dió una versión personal del futuro del desarrollo para móviles. Los puntos que destacó fueron:

  • En los móviles no se navega por la web, entendiendo por navegar que se a partir de una información vayas navegando por los enlaces (al no estar preparadas todas las webs para móviles).
  • Los usuarios no quieren instalar aplicaciones, quieren usarlas. Al ser un proceso de descubrimiento de aplicaciones relativamente complicado, la mayor parte de los usuarios no instalan aplicaciones que no les vengan por defecto en este.
  • Hay que atraer a los desarrolladores de la web 2.0, para ello se está implementando AJAX que permite que el interfaz web sea parecido al nativo así como los motores de Widgets. En el momento en el que haya posibilidad de realmente crear comunidades
  • Además, en un futuro se espera tener una conexión permanente a Internet (Sólo apuntar un pequeño detalle, y del que mucha gente no es consciente, pero una conexión 3G permanente se come la batería del terminal en pocas horas)

Otra charla interesante fue la de Francisco Javier Toribio en la que presentaba un análisis de lo que supone la SDK desde el punto de vista estratégico. En ella habló de cómo iba a afrontar Apple su estrategia con el iPhone.

Desde Apple se han dado cuenta de que un alto porcentaje de sus usuarios iPhone son pertenecen al segmento profesional, a pesar de que, inicialmente, el iPhone estuviera destinado al mercado residencial. Esto ha motivado que Apple se plantee un cambio de estrategia. Inicialmente tenía modelo sandbox basado en que las aplicaciones fueran Web 2.0, AJAX, etc. Pronto rectificó y se ha dedicado a crear un SDK para desarrolladores de Aplicaciones, así como de servicios específicos para usuarios profesionales.

Por otro lado, Apple necesita crear un ecosistema de desarrolladores, para ello ofrece una SDK y un IDE gratuitos (todavía en beta). Este ide sólo está para los sistemas operativos de Mac, eso implica que no se puede desarrrolar usando Windows o GNU/Linux. Este hecho puede ser un handicap en Europa donde no hay tanto equipo Mac como en EEUU.

Algo a reseñar, es que han hecho un importante esfuerzo en ofrecer una buena documentación, muy importante ya que el iPhone se programa en Objective C y, en Europa, no hay mucho desarrollador que ya utilice este lenguaje.

Y como ya hemos dicho, en Estados Unidos la penetración de los Mac es mayor que en Europa donde sí es cierto que cada vez se ven más Macs (¡increíble la cantidad de macs que vi en la barcamp2!), no obstante, el necesitar equipos de Apple supone un esfuerzo en inversión de infraestructura para las empresas que quieran desarrollar para el iPhone.

Apple ofrece el modelo de tienda única. Sólo desde Apple Store podrán distribuirse aplicaciones y Apple tendrá que certificar estas aplicaciones. Se asegurará así que las aplicaciones no son “malignas”. Apple forzará a los desarrolladores a proporcionarle un 30% del precio de cada venta (revenue sharing). Además, el desarrollador tendrá que pagar 99$ para poder subir Applicaciones a Aple Store. También decir que existe una versión de desarrollador orientado al sector empresarial de 399$. Este revenue sharing puede ser una barrera más de entrada.

Otro aspecto a tener en cuenta, es que el desarrollo de las aplicaciones está bastante limitado, iPhone presenta un entorno monotarea y en el que no puedes acceder a algunos recursos como SMS o llamadas ni a datos de otras aplicaciones (sólo puedes acceder a subdirectorios de la ruta a la aplicación).

Sin embargo, este modelo de tienda única supone para el usuario una forma sencilla de descubrimiento de aplicaciones, se asegura de que las aplicaciones están libres de software malicioso, gracias a la certificación por parte de apple. También puede suponer falta de competencia y, por tanto, precios más altos. Por otro lado, al tener unas APIs un tanto cerradas puede suponer que las aplicaciones no sean tan interesantes para los usuarios ya que no pueden integrarse totalmente en el terminal.

Siguiendo con la Barcamp, una iniciativa de Telefónica I+D que también fue presentada y que está recién salida del horno es el mobile manager (http://mobilemanager.movilforum.com), que ofrece conectividad de dispositivos 3G en plataformas GNU/Linux dando así la funcionalidad de gestionar conexiones. Es la base de bajo nivel que usará próximamente el Escritorio movistar para GNU/Linux.

Más cosas de las que se hablaron: Futuro de las APIs de Open Movilforum:

  • Junio’08 Recepcción de Mensajes de un número particular en un correo electrónico
  • Septiembre 2008, API REST de Autolocalización con coordenadas UTM
  • Septiembre 2008, Videollamada
  • Diciembre 2008, Localización P2P
  • Diciembre 2008, Autenticación OpenId Móvil

Y de los futuros eventos organizados por OpenMovilforum

  • Junio 2008, Jornada técnica Web Run Time, Nokia
  • Junio 2008, 3er Concurso Mashups en movilidad.
  • Septiembre 2008, 3er Barcamp.
  • Octubre 20094º Concurso Mashups en movilidad
  • 4º Barcamp: diciembre

Toni Saltavella habló de Festuc, aunque a esa charla no pude asistir. Viendo la página de Festuc, se observa que es una red social para gente que sale mucho de marcha. Puedes poner subir imágenes y poner tu perfil. Cuando sales de marcha puedes decir dónde estás y festuc decirte dónde están tus amigos, ligar, conocer gente nueva.

Y hasta aquí puedo leer.

Twittsms ha visto la luz

Thursday, May 15th, 2008

Al fin, después de mucho trabajo, ha visto la luz el proyecto Twittsms, un servicio que te permite actualizar tu Twitter enviando un SMS a un número de móvil Español.Twitter es una red social de microblogging muy popular en España que permite enviar posts de hasta 140 caracteres. Los microblogs molan porque no tienes que hacer un mensaje tan elaborado y permite a tus amigo seguir lo que estás haciendo y enterarse de tu vida :).

Hasta ahora, para actualizar tu twitter usando el teléfono móvil había tres posibilidades:

  1. Envío de un SMS a un número de Reino Unido. Un usuario minimizará el uso de este método debido al alto coste de un mensaje internacional
  2. Instalar una aplicación en tu terminal. Requiere por parte del usuario buscar, instalar y ejecutar una aplicación (nivel medio/alto de usuario). Además, estas aplicaciones emplean conexiones de datos, que todavía son percibidas como conexiones caras o son desconocidas las tarifas. Por último, existe el problema de la fragmentación del mercado, no todos los terminales son compatibles con las aplicaciones.
  3. Usar el navegador web del terminal. Tiene el problema de que no todos los terminales poseen un navegador web HTML, además, si el teléfono no es 3G la navegación se hace lenta y deseperante. Por último, también, al igual que en el caso anterior, requiere una conexión de datos (sensación de caro y tarifas desconocidas).

Sin embargo, twittsms ofrece la posibilidad de que puedas actualizar twitter simplemente enviando un SMS a un número local de España.

Para poder usar twittsms:

  • Sólo necesitas un móvil que soporte envío de SMS (99,99999%) del parque actual en España
  • Al ser un SMS a un número local, es barato, por lo que puedes usarlo sin pensar en la factura a final de mes.
  • Además, no necesitas ningún aprendizaje adicional ni instalar nada. Sólo hace falta saber enviar SMS.

Por tanto, las ventajas para un usuario de twitter son:

  • Es económico
  • Vale cualquier móvil
  • Es fácil de usar

Desde el punto de vista técnico, twittsms se ha intentado diseñar con dos objetivos:

  1. Diseño centrado en el usuario. El diseño de la interacción con el interfaz web, sus textos, la ayuda, los mensajes de error se ha intentado que cumplan con los principios básicos de la usabilidad.
  2. Calidad desde el punto de vista técnico.
    1. Empleando estándares de la W3C (xHTML strict validado, CSS…)
    2. usando herramientas y tecnologías libres PHP/MySQL/Apache.
    3. Creando una arquitectura software de tres capas (DAL,BLL y Presentación)
    4. Uso de bibliotecas de terceros bien conocidas:
      1. jQuery
      2. Extensiones PEAR PHPPlantillas Smarty 
      3. Código fuente bien documentado, con tags phpDocumentor

Resumiendo, twittsms es:

  • Sencillo de usar, no necesitas instalar nada, ni aprender nada nuevo
  • Único, no hay ningún servicio similar en España
  • Universal, cualquier usuario de móvil puede emplearlo, no requiere de un terminal con unas capacidades específicas
  • Económico, tanto para el usuario ya que actualizar su estado en twitter sólo le cuesta un SMS, como para el desarrollador, ya que está basado en software libre
  • Extensible, puede usarse en cualquier otro país simplemente cambiando el gateway
  • De calidad, diseño centrado en el usuario, calidad software y bien documentado. 

Twittsms es un proyecto de código abierto publicado en Open.Movilforum. Open.Movilforum es una iniciativa de Telefónica España en la que está publicando interfaces y APIs que permiten a terceros aprovechar sus servicios. Aunque, seguramente trate en otro post esto ya que, bueno, es mejorable.
También decir tengo que decir que Twittsms participa en el segundo concurso de Open movilforum. El ganador se sabrá la semana que viene. En total han participado 16 proyectos y el premio son 6000€ para el primero y 2000€ para el segundo y tercero.

Yo participo con Twittsms y OSAP - Open Movilforum SMS API in PHP.

Los 10 principios de Usabilidad de Jakob Nielsen

Thursday, March 6th, 2008

Jakob Nielsen uno de los gurús de la usabilidad. Hace ya tiempo publicó sus 10 principios, que son:

  1. Visibilidad del estado del sistema
  2. Adecuación entre el sistema y el mundo real
  3. Control y libertad del usuario
  4. Consistencia y uso de estándares/convenciones
  5. Prevención de errores
  6. Reconocer es mejor que recordar
  7. Flexibilidad y eficiencia de uso
  8. Estética y diseño minimalista
  9. Ayudar a los usuarios a reconocer, diagnosticar y solucionar errores.
  10. Ayuda y documentación

Vistos así, no parecen dar mucha información, por eso recomiendo que leas el artículo original Heuristics for User Interface Design. Es más, este post lo voy a usar como referencia personal :D

Y bueno, os comento también el artículo  Blog Usability: Top 10 Weblog Design Mistakes, del mismo autor.