Lectura obligatoria

octubre 26, 2006

Getting Real
Matias!

Es obligatorio que leas por completo este libro – Getting Real ! Lo empezaste pero nunca lo acabaste.

Que es Getting Real?

Want to build a successful web app? Then it’s time to Get Real. Getting Real is a smaller, faster, better way to build software.

Y ustedes queridos amigos y lectores les ordeno que lo lean también !

Es OBLIGATORIO! y gratis

Gracias 37 signals !

Anuncios

Trabajar con CSS es una maravilla, pero al mismo tiempo puede ser una pesadilla.

Mi pesadilla a sido ser usuario Mac OS y ver las cosas bien en un navegador y fatal en otro, para después darme que al cambiar de plataforma surgen aun mas problemas.  Menos mal siempre llego a una solución, quizás no sea exactamente lo que quería, pero si llego a algo muy similar.

Hoy me encontré con este enlace en A List a Part, que me hizo sonreír y recordar que no estoy solo en esta batalla contra los estándares que deberían de tener cada navegador.

Aquí el enlace:

12 Lessons for Those Afraid of CSS and Standards

960 el numero mágico

septiembre 18, 2006

1024
En nuestro rediseño de eltiempo.com, uno de los temas mas delicados fue el cambio de ancho de pantalla. Pasamos de de una diagramación sobre 800 pixeles de ancho a una diagramación sobre 1024.

Una de las preguntas en mi equipo de diseño era cual era ese numero mágico para nuestro layout? Llegamos a una conclusión de utilizar de 970 pixeles de ancho, centrado en el browser.

Hoy me llego por medio de pe5pe este enlace
http://www.cameronmoll.com/archives/001220.html

Aquí llegan a la conclusión que el numero mágico es de 960 pixeles de ancho. Porque?

Uno de los argumentos que más me convencieron:

¨I’ve been using 960 for some time now, as it’s slightly smaller than full width, and it’s divisible by 1, 2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320, 480, and 960. (imagine the grid possibilities). I’d love to hear what all of you are wrestling with.

Update: Jon (first comment) brings up an interesting point: If your layout includes ads, 960 seems to facilitate IAB widths fairly well.”

Via: cameronmoll.com

El digg gráfico

junio 24, 2006

pixelgroovy
El modelo Digg se esta replicando por todas partes, o por lo menos tratan de recrear esta comunidad.

Hace unos días salió Pixelgroovy, un digg especializado en tutoriales enfocados el diseñador web.

Se me hizo una muy buena fuente de recursos.

Ya que estamos con los digg, recomiendo el digg hispano llamado Meneame

Diseñar un tour guiado

junio 6, 2006

Guided tour example
Hoy una compañera que esta en la tarea de rediseñar un sitio de venta de autos nuevos y usados, me pregunto que le diera mi opinión sobre el trabajo que estaba realizando.

Al ver la propuesta pensé inmediatamente en un articulo escrito por Andy Rutledge titulado: "Designing a Guided Tour".

En este articulo Andy hace una muy buena reflexión y descripción de como un usuario se encuentra con información y llamados de acción.

Pienso que una buena interfaz debe de llevar al ojo y después al cerebro a tomar las acciones previstas por el diseñador, que teóricamente harán que este usuario cumpla con las expectativas de de la pieza o del sitio web.

Ejemplo C.R.A.P
Mike Rundle de 9rules.com nos transmite las reglas C.R.A.P a utilizar cuando se esta diseñando un sitio web.

Estas reglas fueron planteadas por Robin Williams en su libro: "The Non-Designer's Design Book"

Rundle las modifico un poco, y son estas:

Contrast
Elements that aren’t the same should be very different so they stand out, making them “slightly different” confuses the user into seeing a relation that doesn’t exist. Strong contrast between page elements allows the user’s eye to flow from one to another down the page instead of creating a sea of similarity that’s boring and not communicative.

Repetition
Repeat styles down the page for a cohesive feel — if you style related elements the same way in one area, continue that trend for other areas for consistency.

Alignment
Everything on the page needs to be visually connected to something else, nothing should be out of place or distinct from all other design elements.

Proximity
Proximity creates related meaning: elements that are related should be grouped together, whereas separate design elements should have enough space in between to communicate they are different.

Lean su post en Vitamin, para ver ejemplos de cada una de estas reglas en acción.

vitamin
Parece ser que ya tenemos un nuevo punto de encuentro digital.

Vitamin un sitio de recursos (webzine) para desarrolladores, diseñadores y empresarios.

Linda interfaz, columnas de opinión, blogs, entrevistas y tutoriales conforman el contenido de este sitio. Interesante ver un estilo web 2.0 aplicado a este tipo de contenido. (ando re diseñando un gran periódico y ejemplos como este me interesan mucho)

Lo que me hizo analizar con mas atención esta publicación fue la presencia de grandes nombres en la web del día de hoy.

Los temas tocan entre otras cosas el CSS, ajax, desarrollo y el diseño.