Archive for mayo, 2010

Generador de botones CSS

Este link proviene de un tweet pero me pareció útil, simpre tengo problemas cuando quiero implementar botones simples en algún sitio. Utilizando éste generador se puede crear botones sólo utilizando CSS. el generador es visual, donde eliges los colores, la tipografias,etc y te devuelve el css listo para impletar.

El CSS es algo como lo siguiente:

.button { border-top: 1px solid #96d1f8; background: #d66565; background: -webkit-gradient(linear, left top, left bottom, from(#7d3e9c), to(#d66565)); background: -moz-linear-gradient(top, #7d3e9c, #d66565); padding: 8.5px 17px; -webkit-border-radius: 32px; -moz-border-radius: 32px; border-radius: 32px; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0; -moz-box-shadow: rgba(0,0,0,1) 0 1px 0; box-shadow: rgba(0,0,0,1) 0 1px 0; text-shadow: rgba(0,0,0,.4) 0 1px 0; color: #cdf227; font-size: 13px; font-family: Helvetica, Arial, Sans-Serif; text-decoration: none; vertical-align: middle; } .button:hover { border-top-color: #28597a; background: #28597a; color: #c400c4; } .button:active { border-top-color: #030303; background: #030303; }

acá dejo el link: http://css-tricks.com/examples/ButtonMaker/#

Acerca del HTML5 Video debacle

La verdad que si estoy sorprendido con los reproductores de video para HTML5 y como va ganando terreno rápidamente. Pero también me parece que para que la etiqueta video de html5 reemplace a Flash tiene que terminar de especificarse. ¿A qué me refiero? Bueno por ejemplo en html5 no está especificado como hacer streaming, lo que significa que no podemos mostrar algo en vivo, grabar, etc.
Segundo: se necesita definir un codec, en éste momento se debate sobre si usar h264 o OGG. Ambos son excelente codecs pero Firefox y Opera se juegan por OGG cuando Safari y IE van por H264. Google es el abogado del diablo y utiliza ambos. Entiendo la razón por la cual FF y Opera, que viniendo del purismo del open source) utilicen OGG, pero ésta opción no es muy práctica hoy en día cuando la mayoría de los contenidos online están codificados utilizando h264. Y esto no quiere decir que la opción de IE y Safari es la acertada, en cualquier momento puede pasar que H264 haga lo mismo que hizo Unisys a principios de los 90 con el formato Gif y todo tengamos que empezar a pagar derechos por utilizar ese codec.
Lo último que veo que falla en la especificaciones de html5 es el fullscreen. Si bien hay formas de buscarle la vuelta no es algo que éste especificado en el estándar con acceso desde la API. Tener acceso al video fullscreen es algo vital en ésta era de miles de distintos tipos y tamaños de displays que van desde minúsculos a LCD de decenas de pulgadas.

Realmente espero que esto se vaya solucionando de a poco y que como usuarios no tengamos que preocuparnos que explorador o dispositivo tengamos que usar para entrar a determinado sitio. Como desarrolladores también estaría bueno saber que pase lo que pase decidamos lo que decidamos nuestros usuarios puedan acceder a nuestros contenidos y tengamos acceso a una tecnología, y sin necesidad de hacer ningún artilugio, podamos publicar fácilmente nuestro contenido.

Probando !

Uds. sabrán que están aparecionedo las primeras demos de reproductores de video para html5 lo cual es muy interesante, se me ocurrió chequear el uso de recursos de CPU de dos ejemplos, y compararlo con el uso de recursos utilizados en una pagina de nuestro desarrollo en donde tenemos reproductores Flash.

Descripción del equipo de prueba:
AMD Athlon 64 x2 Dual Core Processor 3600+ 2.01 Ghz
Ram 2.00 GB
Sistema OP Win 7 64bit
Uso CPU estado de reposo: de 0% a 12%

Ejemplo 1 – Video reproducido con HTML5
URL:  http://people.mozilla.com/~prouget/demos/DynamicContentInjection/play.xhtml
Duración video: 10 seg
Uso CPU: 53 % constantes.

Ejemplo 2 – Video reproducido con HTML 5
URL: http://videojs.com/
Duración: 47 seg
Uso CPU: entre 35 – 40 % constantes y si se hace rollover para ver el reproductos salta a 60 %

Ejemplo 3 – Video reproducido con Flash
URL: http://www.budokansports.com.ar/
Esta página tiene un banner animado swf loopeado y un video de reproductor
Duración video reproductor: 50 seg
Uso CPU: sin dar play al reproductor solo banner swf:  cuando se realizan las transiciones tiene picos de no menos de un seg de 25 %, cuando le damos play el uso del cpu no es constante y tiene picos 25% a 60%. Hay que tener en cuanta que hay dos videos por asi decirlo.

Ejemplo 4 – Video reproducido con Flash
URL: http://www.starbene.com/home.php?seccion=novedades
Video inmerso en una interfaz completamente hecha en Flash sistema de carga streaming !
Duración video: mas de 50 seg
Uso CPU: Constante 25%

Creo que estas pruebas son bastante positivas ya que el hecho de que se quiera descartar a Flash como plataforma no es del todo un problema de recursos, para lo que es reproducción de video.
Creo que el problema va a radicar en la frma en que los desarrolladores programen, ya que en javascript que va a ser la base de la interactividad que se le va a otorgar a HTML5 se pueden cometer errores muy grabes que van a lleva a un exceso del uso del CPU a igual que flash.

Seguiremos probando.
La próxima mediremos alguna aplicación mas compleja con mayor niver de interactividad.

InAppSettingsKit panel de seteos para iPhone

Encontré un framework para crea una pagina de settings dentro de nuestra aplicación para iPhone muy fácil de usar la app  debe incluir Settings.bundle por lo menos con un Root.plist para especificar la conexión de seteos y los elementos interfaz de usuario con los NSUserDefaults.

Más info en: http://www.inappsettingskit.com/

Una cosa que venimos ofreciendo a nuestros clientes de Grupo Quantum es la posibilidad de portar sus actuales website a webapps para distintos dispositivos móviles como ser el iPhone, Android, RIM, Window Mobile o Symbian. Dentro de estas tecnologías y al haber tantos dispositivos surge el problema que tecnología utilizar, por ejemplo si hacer una aplicación para iphone o para Android. Con ésto en mente hemos encontrado un framework llamado Rhodes que es open source y sirve para crear aplicaciones nativas en Ruby para la mayoria de los smartphones. Lo mejor de todo es que tiene acesso a la capacidades nativas del dispositivo como ser el GPS, los contactos o la cámara.

Más información en el sitio de Rhodes: http://rhomobile.com/products/rhodes/