17 dic. 2010

Blogger en dispositivos móviles (Diseño)

De tantas idas y venidas con el diseño de este blog, y hasta buscar las mil y un maneras de darle estilo para que se vea lo mas aceptable posible en un dispositivo móvil, la solución que llega a lo último siempre es la más fácil, pero no justamente en el momento indicado. He probado los tips de JMiur de Vagabundia pero no me han dejado del todo satisfecho (probé con este | y con este otro). El blog en si no queda bien, se deforma, no carga todos los scripts, o quizás el navegador de mi celular sea una farsa de entrada.

Ahora las cosas son más sencillas. Blogger pretende competir con sus actualizaciones, pero el problema es que las actualizaciones las hace MUY TARDE. Ahora salió una actualización en la que mediante unos pocos clicks nuestro blog se muestra de manera perfectamente ordenada en diseño y organización en un dispositivo móvil.

Lo único que hay que hacer es: desde nuestro panel de control ir a Configuración > Correo electrónico y móvil  y marcar la Primera Opción que vemos en el panel. Guardamos los cambios y listo. Nuestro blog ahora puede verse en cualquier tipo de dispositivo móvil (que tenga conexion y navegador, obviamente)

7 dic. 2010

Siete Pisos

"El Radcliffe Hospital puede ser un poco deprimente. Tiene siete pisos. Quizás conozca a un escritor italiano, Dino Bunzzati; tiene un cuento en algo que le ocurrió aquí, cuando vino a Oxford a dar una conferencia: lo cuenta en uno de sus diarios de viaje.

Era un día de mucho calor y tuvo un ligero desmayo poco después de salir de la sala. Los organizadores, por precaución, insistieron en que lo revisaran en el Radcliffe Hospital. Lo llevaron al último piso, que es el piso reservado para los casos más leves y los estudios generales. Le hicieron allí los primeros análisis y exámenes. Todo iba bien, le dijeron, pero sólo para quedarse definitivamente tranquilos le harían unos estudios algo más especializados. Debían para eso descenderlo un piso, sus anfitriones lo esperarían arriba hasta que todo terminara. Lo llevaron en silla de ruedas, lo que le pareció a él un poco excesivo, pero prefirió atribuirlo al celo británico.

En el sexto piso empezó a ver por los pasillos, y en los bancos de las salas de espera, gente con cara quemada, vendajes, camillas con cuerpos horizontales, ciegos, mutilados. A él mismo lo hicieron recostar en una camilla para hacerle los estudios con rayos. Cuando quiso incorporarse otra vez, el radiólogo le dijo que habían detectado una pequeña anomalía, que posiblemente no fuera nada serio, pero que era preferible, hasta tanto tuvieran el resultado de todos los demás estudios, que se mantuviera en posición horizontal. Le dijeron también que tendrían que retenerlo en observación unas horas más y que preferían bajarlo al quinto piso, donde podrían estar a solas en un cuarto.

En el quinto piso ya no había gente en los pasillos, pero algunas puertas estaban entreabiertas. Pudo ver el interior de una de las habitaciones: sólo se veían frascos de suero, gente postrada, brazos conectados. Quedó solo en un cuarto, sobre la camilla, bastante alarmado, durante un par de horas. Una enfermera entró finalmente, con una tijera sobre una bandejita. La enviaba uno de los doctores del cuarto piso, el doctor X, que haría la evaluación final, para que le hicieran una pequeña tonsura en la nuca antes de la revisación. Mientras los mechones caían sobre la bandejita Buzzati preguntó si el doctor subiría a verlo. La enfermera se sonrió, como si aquello fuera algo que sólo a un extranjero podía ocurrírsele, y le dijo que los doctores preferían mantenerse cada uno en su piso. Pero ella misma, le dijo, lo bajaría por una de las rampas y lo dejaría mientras durara la espera junto a una ventana.

El edificio tiene una planta en U y desde la ventana del cuarto piso Bunzzati entrevió, al mirar hacia abajo, las persianas corredizas del primer piso que describe en el cuento. Había unas pocas abiertas, casi todas estaban cerradas. Le preguntó a la enfermera quiénes estaban en aquel primer piso y recibió la respuesta que consigna en el cuento: allí abajo sólo el cura trabajaba. Bunzzati escribe que en esa hora terrible, mientras esperaba al médico, lo obsesionaba sobre todo una idea matemática. Se daba cuenta de que el cuarto piso era exactamente la mitad de la cuenta regresiva y un terror supersticioso le decía que si descendía un solo piso más, todo estaría perdido. Escuchaba que cada tanto llegaban desde el piso inferior, con intermitencias, como si reptaran por el hueco del ascensor, lo que le parecían gritos desesperados de alguien sumido en un delirio de dolor y llanto.

Se propuso resistir con su vida si con cualquier otra excusa querían volver a bajarlo. Llegó finalmente el médico. No era el doctor X, sino el doctor Y, el médico principal a cargo. Hablaba algunas palabras en italiano y conocía su obra. Dio una mirada rápida a los análisis y a la radiografía y se sorprendió de que su joven colega, el doctor X, hubiera ordenado la tonsura; tal vez, dijo, había pensado en una punción preventiva, en cualquier caso nada de eso era necesario. Todo estaba perfectamente bien. Le pidió disculpas y esperaba, le dijo, que no lo hubieran perturbado demasiado los gritos que se escuchaban desde el piso de abajo. Era el único sobreviviente de un accidente de tránsito. El tercer piso podía ser muy ruidoso, le dijo, muchas enfermeras usaban allí algodones.

Pero posiblemente pronto bajarían al pobre hombre al segundo y volvería a la paz. La anotación en el diario corresponde al 27 de junio del '67, dos días después del choque en el que perdí a mi esposa, el choque en el que murieron también John y Sarah. El hombre que agonizaba en el tercer piso era yo."

Si llegaron hasta acá podrán saber de dónde salió esto: es un fragmento de un capitulo del libro "Crímenes Imperceptibles" de Guillermo Martínez. Por primera vez en mucho tiempo estoy leyendo un libro que no sea Harry Potter. :P

17 oct. 2010

Logos del Barcamp Uruguay

La movida del Barcamp llegó a Uruguay y el grupo uruguayo del BarcampUy ha decidido poner un concurso abierto para que diseñadores uruguayos dejen su propuesta y así elegir el logo que lo represente. Yo aproveché la oportunidad para participar e hice dos logos para el concurso. Para el primero no tuve mucha inspiración, pero luego hice otro más sencillo, pero sin embargo no hubo suerte. Aquí mis logos:



Como no logré captar la atención del Jurado (?) mi logo no fué elegido. Además el segundo tiene el solcito de la Presidencia de la República (dificil que nos banquen la movida). Ganó el de Karina:

10 oct. 2010

Agosto



En Agosto realicé mi primer trabajo 2.0 con la gente de Xarup.com

7 oct. 2010

El producto de las Redes Sociales

6 oct. 2010

Logos para Mirá Mamá blog

Estos Logos los hice para el blog de diseñadores uruguayos llamado Mirá Mamá








ACTUALIZACIÓN:

Pueden descargar un pack completo en este enlace

3 oct. 2010

Agosto: Mi 1er trabajo 2.0

Mi primer trabajo comenzó en octubre del año pasado, casi un año. Fue en un supermercado. Entré como reponedor y allí estuve 9 meses. Dentro de esos nueve meses estuve varias veces intentando solicitar un puesto en administración, haciendo lo que sea, llenando formularios o lo que fuere. Tenían que darse cuenta que tenía más estudios como para ser un simple reponedor.

El tema es que cuando entrás a ese tipo de trabajos, los encargados o quienes te hacen la entrevista lo único que toman en cuenta es si sabes leer y escribir, nada más. Porque... ¿Para qué querés a un reponedor que sepa Operador PC, Diseño Grafico / Retoque fotográfico y Reparación de PC? No les sirve de nada! si lo único que necesitan es que el empleado reponga los artículos en la góndola. Sin embargo mi solicitud fue rechazada 3 veces, o quizás más, no lo recuerdo. Simplemente quería un trabajo en el cual me sintiese cómodo haciendo las tareas que siempre me gustaban hacer con la herramienta que más manejaba. Además, a veces parecía que no me creían que yo era estudiante de Abogacía. Todo eso les chocaba también al saber que vivía en el barrio Marconi.

En el último mes dije "Basta!" y me busqué otro trabajo. Había visto algo sobre diseño gráfico y me llamaron para una entrevista. La entrevista fue rara. Era mi segunda entrevista y estaba nervioso. No tenía aspiraciones salariales para esta tarea, asique acepté lo que ellos ofrecían para el puesto. Después de varias llamadas logré que me tomaran y dejé el super. La primera prueba fue dura, pero más duro fue que, con esa prueba me tomasen para el cargo, porque era dificil. Y ahora les digo porqué (Programadores: Atentos!)

La idea era que, yo como diseñador, tenía que trabajar sobre el CSS de una página sin forma. Por ende, tenía que darle forma. Hasta ahí todo bien.

El problema que tuve al principio era que tenia que trabajar sobre la hoja de estilo, pero a ciegas. Es decir, que tenia que hacer los cambios en la hoja de estilo, pero nada más, cambiar y guardar, y era difícil ver si lo que había cambiado estaba bien. Era como trabajar con Photoshop con los ojos cerrados!

Así que hablé con quien se suponía ser el jefe en la oficina y le dije que no podía hacerlo así, que tenía que ver los cambios. Así que después de intentos y de hablar por teléfono con el programador me dieron la hoja de estilo original y así podía ver los cambios. Ahora otro problema. Tablas. Si, tablas. Unas etiquetas html que son muy útiles, pero que no me llevo bien con ellas a menos que arme una lista, únicamente.

Su forma:


<table border="1" summary="Ejemplo de tabla simple.">
<tr>
<td>Celda 1</td>
<td>Celda 2</td>
<td>Celda 3</td>
</tr>
<tr>
<td>Celda 4>
<td>Celda 5>
<td>Celda 6>
</tr>
</table>


Estuve viendo el código fuente y parecía algo sencillo y por lo que vi en la "vista real" lo que tenía que modificar era una especie de panel de administración tipo Wordpress. Hasta ahí todo bien. Pero aparecían más problemas...

Las tablas contenían únicamente el atributo "class" pero no contenían ningún "ID" como para identificar cada bloque y poder moverlo, poco pude hacer en los archivos php porque no se casi nada de php. Apenas algún ID pude poner por lo menos para identificar los bloques principales como para poder separar el encabezado (head) del cuerpo o el pie de página (body y footer, respectivamente). Para colmo, el sub-elemento de cada etiqueta tenía el mismo estilo de la etiqueta principal, aún más difícil de darle estilos diferentes!

Ejemplo:


<tr class="laclase" >
<td class="laclase" >Celda 1</td>
<td class="laclase" >Celda 2</td>
<td class="laclase" >Celda 3</td>
</tr>


Lo único que pude hacer fue nada más que centrarlo un poco y poner una imagen de fondo para ver que estaba bien centrado, y separar head, body y footer. Deprimente!

Luego de esa prueba, como una semana después, me llamaron de nuevo y era para decirme que el puesto de diseñador no iba a ser posible, pero que me podían dar otro puesto, que era armar las publicaciones (post) para una página de descargas de juegos. Pero es una historia larga y son más detalles y más problemas. Muchos...

2 oct. 2010

Real Adobe Photo-Shop

25 sept. 2010

Meta 1: Llenar el calendario.

Hace tiempo no escribía en el blog. Lo tenía abandonado como algunos de ustedes, seguro. He pasado por muchas cosas que han cambiado por completo mi vida. Quizás de a poco las vaya enumerando una por una y se van a dar cuenta de porqué no tengo tiempo de escribir en mi blog. No recuerdo porqué lo abrí. Será por envidia a que otras personas se vuelvan famosas por escribir estupideces en Internet.... ¡Quién sabe!
Ni siquiera se porqué escribo como si estuviese hablando con alguien. Puede que lo lea una persona y a penas comience a leer cierre la ventana o quizás se vaya al Facebook o a Twitter, o a hacer algo productivo. Precisamente de eso se trata esta entrada: Productividad y progreso.

El titulo de esta entrada tiene como referencia un calendario. Uno muy especial. Es ese que ven en la barra lateral y el cual me costo horrores modificar a mi gusto. Tengo pensado volver a escribir mis estupideces en este blog, pero con más frecuencia, o mejor dicho: con la frecuencia normal en la cual una persona poseedora de un blog hace lo suyo al momento, escribir, sin importar la cantidad de palabras utilizadas en cada entrada, sin importar si hay imagenes, videos, música, sin importar si alguien lee o no, sin importar si dejan comentarios... solo voy a limitarme a abrir la estupida ventana y a escribir mi estupido post en mi estupido blog.

La meta es clara: "Llenar el calendario". Estoy planeando llenar un mes. El mes de octubre o quizás lo que queda de setiembre y el mes de octubre completo. Al finalizar, lo voy a quitar. Ya no lo necesito. Luego de eso, veremos.

16 may. 2010

Mejorar el aspecto tipográfico de tu blog

Gracias a un tweet de SpamLoco me enteré que se puede utilizar cualquier tipo de fuente (letra) en nuestro blog. La idea es poder dejar de lado un poco la uniformidad de utilizar las fuentes clásicas, como Arial, Helvética, Verdana, Georgia o Lucida y mostrar el blog con un texto diferente.

En La Brújula Verde postean cómo podemos conseguir que nuestro blog tenga una tipografía original. Aclaro que ésto funciona únicamente en los navegadores actualizados como Firefox, Safari, Opera y Chrome.

El "truco" lo realizamos con la especificación @font-face de CSS de la siguiente manera:

Primero debemos elegir la fuente que queremos mostrar y alojamos el archivo de la fuente en un servidor propio. Luego vamos a la Edición HTML y colocamos el código CSS antes de </b:skin> :

 @font-face {
font-family: Nombre-de-fuente;
src: url("url-de-archivo/blackout.ttf") format("truetype");
}


Después de eso, para utilizarla debemos establecer el tipo de fuente a utilizar en el lugar donde queremos que se vea, por ejemplo en algún título:

h1 { font-family: Quadranta-bold, Helvetica, Arial, sans-serif; }

Dónde: Nombre-de-fuente es el nombre de la fuente.
            url-de-archivo es la dirección del servidor donde alojamos el archivo de la fuente.
            Quadranta-bold es el nombre de la fuente utilizada en el título como ejemplo.

Vemos cómo queda con la Vista Previa y Guardamos los cambios. Ya lo único que quedaría sería cambiar el tamaño a la fuente, pero eso es a gusto personal. Yo estoy utilizando la Quadranta bold en los títulos de los Post.

1 may. 2010

Feliz Día de los Trabajadores!

Ya es hora, y es el primer año que me toca, por fín puedo decir que el feriado me toca por ser trabajador.

A todos... Feliz Día del trabajador!


El Rey del Pop-pop-potterico

Desde hace varios años que soy fan de la Saga de Harry Potter. Culpa de mi hermana. Eso me hizo registrarme en un portal de fans de Harry Potter. Allí conoci mucha gente, de toda latinoamerica. Hay juegos, chats, hasta existe la posibilidad de tener un espacio propio donde puedes escribir lo que se te ocurra, siempre y cuando tenga cierta referencia al mundo Potterico.

Ese portal es nada más ni nada menos que HarryLatino.com. Yo había creado un espacio propio, lo que se llama Club (mas información). En él tenía una sección llamada "Magomontajes" donde publicaba mis creaciones. Una de ellas es esta:

Michael Jackson quería trabajar en Harry Potter!!
Click para ampliar

13 abr. 2010

¿Google Earth o Motherboard?

Click para ampliar las imágenes





10 abr. 2010

Una imagen en la cabecera del blog

Hace unos días, un tweet de mi amiga Un!k me hizo ofrecerle mi ayuda para con su blog. El problema estaba en que no podía colocar una imagen en su blog bien ubicado.

Vía msn me cuenta que tenía como guía una entrada de Rosa sobre el tema, pero no pudo seguir el consejo al pie de la letra, puesto que faltaba un dato para lograrlo. Lo que Rosa propone es colocar manualmente mediante código CSS una imagen en la cabecera o header del blog, también aconsejando jugar con valores para redimensionarlo. El código que tenemos como base en el CSS es este:


#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

Rosa propone el siguiente cambio(cita):

Añades la url tu la imagen para que aparezca como fondo, dentro del bloque “header”, si quieres eliminar los bordes,borra la línea “border”: border:1px solid $bordercolor;Si tu imagen mide 660px de ancho perfecto, sino puedes establecer otro ancho, si lo que quieres cambiar es la altura puedes añadir el valor height, especificando la altura que quieres. Yo hice mi propia imagen, así que le di el tamaño de la cabecera de plantilla.
Quedaría así:



#header-wrapper {
width:660px;
margin:0 auto 10px;
}
#header {
margin: 5px;height:100px;
background-image: url(http://URL DE TU IMAGEN);
text-align: center;
color:$pagetitlecolor;
}

Como verán, se agrega la imagen, quedando centrada. Un!k lo hizo de esta forma, pero la imagen no quedaba justo donde élla quería, entonces yo le corregí el error(en realidad lo hice personalmente, pero eso es otra historia), trabajando directamente en la imagen.

¡Claro! Una vez ubicada una imagen, o cualquier otro elemento dentro de un bloque DIV, dicho elemento adquiere una etiqueta en la cual se puede trabajar, y en blogger, dicha etiqueta viene en el CSS para ser trabajada, y es ésta:



#header img {
margin-left:auto;
margin-right:auto;
}

Y el cambio que le hice a Un!k fué éste:



#header img {
background:#FFF;
margin:0 -100px 0 4px;
padding:0 217px 0 0;
width:400px;
height:105px;
}

Explicación: Los cambios que hice fueron darle un fondo blanco al bloque de la imagen (img) con background; mover la imagen hacia la derecha con margin (margen); darle un relleno hacia la derecha, para tapar la imagen del fondo mismo del header con padding (relleno); y por ultimo redimensionar la imagen con width (ancho) y height (altura). Los valores de margin y padding son arriba, derecha, abajo, izquierda, y cabe destacar que SÓLO margin puede tener valores negativos.

6 abr. 2010

Cocina Geek... de todo para todos

El mundo geek abunda en Internet, y al parecer el número de "habitantes" es más grande que el de los floggers. Un post de ChicaGeek nos muestra diferentes gadgets geek para la cocina. Un Guante de horno de Pac-Man, Un Set de Química para Cocktails, Posavasos Vinilos 45 rmp, Cubitos de Hielo Space Invaders,Y hasta un Molinillo de pimienta de Rubik.

Para completar las exquisiteces, le ofrecí un pastel... También Rubik:

25 mar. 2010

Adobe CS5: Lo nuevo de la nueva Suite

Según el blog PuntoGeek.com el próximo 12 de Abril saldrá a la venta la nueva Suite de Adobe, Adobe Creative Suite 5, con nuevas mejoras para facilitarnos el trabajo, bastante buenas. Se trata de nuevas herramientas de selección / relleno / borrado, que nos ahorrará muchisimo tiempo al momento de retocar.


John Nack nos deja una pequeña muestra de lo antedicho en éste video-tutorial:





Fuente: Adobe CS5 verá la luz el 12 de abril

1 ene. 2010

Año Nuevo...

Hoy es el primer día del año 2010. Dormí como tronco. Me despertó mi madre, invitandome a almorzar a la casa de las tías. Me levanté, desayuné a la carrera, y cruzamos la calle llevando una fuente con ensalada rusa, una botella de Coca-Cola, cubiertos, una camara digital para recordar el momento, y... mucha hambre jajaja
Estaban todos, aunque faltaba otra parte que no pudo venir, no quiso, estaban ocupados o quien sabe que, y mi padre, que tuvo que trabajar el primer día del año muy temprano.

Hubo risas, fotos, y luego de eso me vine. No se, me aburrí o quizas aún tenía sueño. Pero estuvo bueno.

Hace un rato hubo guerra de agua aquí en el barrio. Me hubiese gustado participar, pero nunca tuve una relación de amistad con nadie del barrio. Y bueno... no todo en la vida es color rosa.

Nueva version del Himno uruguayo

Esta es una entrada que quería publicar hace mucho, y nunca pude hacerlo

El Miercoles 18 de Noviembre se jugó en el Estadio Centernario de Montevideo el partido clave que pondría a Uruguay de cara al Mundial de Sudáfrica 2010.

¿Ganamos?  Si y No. En realidad, hubo empate, pero ese tema no es de importancia en esta entrada, sino lo que hubo previamente al partido.
Como todos sabemos, antes de que el partido comience se cantan los Himnos de cada uno de los paises que se enfrentan en el partido. Este miércoles hubo algo en particular que se destacó y dió que hablar. El Himno Nacional Uruguayo fue interpretado por Freddy Bessio al estilo marcha camión, acompañado por la murga Agarrate Catalina, con Fatorusso, en una version realizada por el gran Jaime Roos.

A la mitad del pais le gusto y el resto solo se limito a criticar y decir que era un insulto al pais... como vamos en general, el pais cada vez es un circo y cada vez hay menos cosas autenticamente nuestras, Punta del Este en vez de ser una ciudad del departamento de Maldonado dentro de La República Oriental del Uruguay parece un pedacito de Argentina, y creo que poner una huella autentica al himno fue lo que se hizo.

Las criticas estan en los comentarios de esta nota en el Diario El Pais, de Uruguay.


Referencias:
El Himno lo canté con total respeto