Hace poco tiempo me senté a diseñar una simple aplicación para Facebook para enterarme como era el mundo detrás de todos esos juegos o simples aplicaciones que parecen haber invadido la red social en cuestión, y uno de los detalles a tener en cuenta a la hora de lanzar la propia creación es combinar la misma con el diseño de Facebook… Muchos al utilizar Java deciden no tener en cuenta el diseño de Facebook, no se molestan en combinarlo, pero por otro lado hay quienes lanzan su aplicación con la pretensión de integrarla visualmente al resto del diseño de Facebook para que parezca parte del mismo…

Buscando información al respecto para combinar mi aplicación con el diseño de Facebook, di con el artículo “How to Style an Application Like Facebook” publicado por Bill Konrad en la bitácora Devtacular, en el cual se incluye todo lo necesario para que nuestra aplicación tenga los mismos colores, la misma tipografía, los mismos bordes, dimensiones, iconos y efectos que la red social…

Por un lado, en el caso de los colores, el autor ha especificado el código de cada uno de los colores junto a una muestra de los mismos y el uso que Facebook les da (por ejemplo, el azul del encabezado, el azul de los enlaces, los grises y negros de los textos, los grises de los recuadros y de los bordes de los mismos, y los azules, amarillos y rojos para los mensajes de aviso, notificación y error respectivamente)… Luego tenemos la tipografía utilizada que al parecer es única para todo la red social, y finalmente las dimensiones que Facebook le otorga al recuadro donde nuestra aplicación es insertada, a la columna de nuestro perfil, y a los iconos…

Todo el artículo esta ejemplificado para que sepamos de que se trata cada código y en donde es conveniente utilizarlo… De igual manera, y para los interesados, les recomiendo leer la documentación oficial de Facebook en referencia al diseño de las aplicaciones: Facebook Styles y CSS Tips and Tricks… Saludos…