Home » Archive

Articles Archive for junio 2011

Diseño, Factorsim, Herramientas, Interfaces, Web 2.0 »

[ | 21 jun 2011 | One Comment | 1.252 views | ]

Hoy he estado creando un sprite para el nuevo curso que estamos desarrollando. Bueno, en realidad yo he hecho un script y el script ha hecho el sprite, porque no tenía yo ganas de crear 100 imágenes a mano. Este es el resultado:


Las imágenes PNG individuales ocupan unos 950 bytes cada una. Parece poco, pero juntando las 100 salen 94.989 bytes. El sprite con las 100 imágenes dispuestas en una cuadrícula de 10×10 ocupa 14.384 bytes: un 15% del tamaño total de las imágenes individuales. Y de cara al navegador, en lugar de ser 100 peticiones es sólo una única carga (evitando latencia de cada imagen, su overhead, el hecho de que ningún navegador en su sano juicio lanzaría 100 peticiones en paralelo contra el mismo servidor, etc, etc…) .

Tal vez este sea un caso un poco extremo y habitualmente no nos encontremos con cosas tan evidentes, pero creo que esto explica por qué todos “los grandes” (google, yahoo, etc…) recomiendan el uso de sprites.

El resultado? Un linda pelotita que rueda y rueda cuando javascript le sopla…
Cómo se hace? En mi caso, con este script tan bonito:

1
2
3
4
5
6
7
8
9
10
11
12
13
#! /bin/sh
 
mkdir -p imgs
for i in `seq 1 100`; do
	sed -e s/##ENDANGLE##/`echo "scale=20; ( $i - 25 ) * 2 * 3.1415926535897932384626433832795 / 100" | bc`/g < drawing.svg > drawing_t.svg
	echo "$i..."
	"/cygdrive/c/Archivos de programa/Inkscape/inkscape.exe" -e 'C:\Documents and Settings\DaniM\Escritorio\sprites\imgs\'$i'.png' 'C:\Documents and Settings\DaniM\Escritorio\sprites\drawing_t.svg'
done
 
echo "Final sprite..."
sq=`seq 1 100`
names=`for i in $sq; do ( echo imgs/$i.png ) done`
/cygdrive/c/Archivos\ de\ programa/ImageMagick-6.4.0-Q8/montage.exe -background transparent -tile 10x10 -geometry +0+0 $names progress_sprite.png

El funcionamiento es sencillo: uso inkscape para crear un archivo vectorial SVG con el gráfico, utilizo sed para modificarle el ángulo final del arco y lo convierto a PNG invocando inkscape desde la linea de comandos. Una vez tengo las 100 imágenes, utilizo montage (parte de ImageMagick) para juntarlas en un sprite.

Como podeis ver, utilicé cygwin. Si hubiera usado un sistema operativo de verdad, no tendría que haber puesto toda esa marabunta de rutas en dos formatos diferentes.

Una opción interesante hubiera sido procesar el fichero SVG mediante xsltproc en lugar de mediante sed. Para casos más complejos seguramente sería una muy buena opción. Pero eso… lo dejo como ejercicio para el lector.

Moodle »

[ | 19 jun 2011 | No Comment | 1.137 views | ]

Moodle es un LMS Open Source muy extendido, sobretodo en el ámbito universitario, por su facilidad de uso y potencia (sobretodo añadiendo funcionalidades con módulos adicionales). Pero tiene algunas desventajas cuando nos dirigimos al entorno coorporativo, siendo la principal de las desventajas, la gestión que realiza de los usuarios y cursos y los informes de actividad y seguimiento que se pueden obtener en Moodle.

Es por ello, que desde hace un año, venimos desarrollando un entorno que se comunica con Moodle como una capa superior y amplía y mejora esta gestión, facilitando el trabajo de los responsables de recursos humanos y administración de cursos.

En la siguiente presentación os introducimos algunas de las características del desarrollo.

Si se precisa más información o acceder a una demo, estaremos encantado de facilitársela. Para ello puede enviarnos un mail a info@factorsim.com, indicando la referencia a este artículo del blog.

Moodle, Vídeos 2.0 »

[ | 3 jun 2011 | One Comment | 1.678 views | ]

No ganará un Grammy, pero creo que merece la pena publicarlo en el blog, aunque sólo sea para constatar que Moodle tiene sus fans y cada vez está más asentado como la alternativa open source a otros LMS propietarios…

¡A bailar que es viernes!

:P