RUDEWORKS / El blog-portfolio de RUDE

02/06¿Por qué uso Fireworks?

31

why-fireworks.pngMe gusta pensar que, con el paso de los años, mis métodos de trabajo han evolucionado y mejorado. Cuando comencé a diseñar para web, la herramienta que escogí fue Photoshop, imagino que por aquella época era la que mejor dominaba y me pareció lo más lógico para empezar. Más tarde me decidí a probar Illustrator, el experimento fue satisfactorio, el tamaño de los archivos generados era mucho menor, podía reaprovechar elementos, moverlos y editarlos con mayor facilidad, etc.

Hace cerca de un año comencé a interesarme por Fireworks, la herramienta de gráfica para web de Adobe, parecía tener sentido darle una oportunidad. Al principio echaba de menos algunas herramientas muy potentes que encontraba en Illustrator, las paletas de texto y color me parecían muy pobres (heredadas de Flash) y desde luego no era el software más estable que había probado (el resto tampoco es que sean bloques de hormigón). Aun así decidí seguir adelante y exprimirlo al máximo.

Tal decisión no podía haber sido más acertada, descubrí un sistema de organización infinitamente más lógico al que usaba en Illustrator o Photoshop; gracias al uso de estados, grupos de capas compartidas y símbolos (sobre todo los dotados de 9-slice scaling), no sólo reducía el tiempo que dedicaba a la creación de layouts, también el tamaño de los archivos se minimizaba drásticamente.

FW me ofrecía otra serie de características que hacían más que definitiva mi decisión, quizá las más importantes son…

  • … la estupendísima paleta PATH, con la que el dominio de los trazados vectoriales se convierte en un juego de niños. Se puede hacer prácticamente de todo con ella.
  • … el comando ‘Paste Attributes’. Copia un elemento, selecciona otro, ejecuta dicho comando e instantáneamente pasa a tener aplicados los mismos efectos, borde y relleno de color que el original (también funciona con tipografía), así de fácil.
  • … la herramienta de exportación de areas, con la que se pueden exportar áreas concretas sin necesidad de modificar la imagen en absoluto.
  • … la paleta FIND, con la que podrás reemplazar texto, colores, efectos, enlaces, etc. dentro de un rango de posibilidades, desde una sección del documento actual a varios archivos.
  • … algo que quizá infravaloréis ahora, pero que después de trabajar con él durante un tiempo veréis realmente útil, que es la independencia del tamaño del lienzo en cada página. Os aseguro que es completamente innecesario utilizar más de un archivo para contener un layout completo (incluyendo hovers, versiones alternativas, lightboxes, etc.).

Seguro que olvido otras cosas que utilizo tan a menudo que olvido el lugar tan importante que ocupan en mi workflow, pero la conclusión definitiva es que FW aporta sencillez y velocidad en la creación de layouts de cualquier tamaño.

Espero que este artículo sirva a algunos para animarse a dar el primer paso, si es así, espero que me relatéis vuestras experiencias en los comentarios (así como aportar otras mejoras que haya podido olvidar).

Edit: Los iconos usados en este artículo pertenecen a la colección Refined Creative Suite 4 de Jesse Dodds.

28/10Matthew Buchanan

1

matthew_buchanan.jpgYa estamos bastante acostumbrados a ver las maravillas que se nos muestran de vez en cuando en la Smashing Magazine (por cierto, desde que ponen uno o dos artículos al día les he cogido un poco de manía, antes molaba más), una de las últimas que me han descubierto es el blog de Matthew Buchanan. Es, cuanto menos, inspirador.

Además el amigo se ha currado un theme para Tumblr basado en la gráfica de Saul Bass y es para quedarse con la boca abierta.

20/10designedmemory

0

designedmemory.jpgVía Web Creme me encuentro con una web tan simplona que hasta me da rabia dedicarle un post, pero es que me han encantado los colores, el atrevimiento, el toque ‘saulbassiano’. Lo dicho, designedmemory me han conquistado, y me revienta.

18/03Credit Card pixel icons

3

Credit Card IconsDe parte de los Zeusbox Studio, unos iconos de tarjetas de crédito para web. Muy bonitos.

17/03Starry Night, un ejemplo en CSS

3

Starry NightEl efecto de fondo de la misteriosa web de Silverback a causado estragos. Ahora desde CSS-Tricks, una pequeña demostración de lo que podemos hacer con esa misma filosofía y unos cuantos PNGs.

Aun no da signos de vida la nueva versión de WordPress (2.5) y ya hay gente por ahí que quiere cambiarle el interfaz a la parte de administración. Preguntad si no al autor de Fluency Admin.

06/03El icono de Silverback

2

Silverback sketchSeguimos sin tener ni idea de qué pijo es Silverback. Lo que sí que sabemos es cómo fue el proceso de creación del icono, gracias a su autor, Jon Hicks.

03/03jQuery para diseñadores

0

jQuery para diseñadoresEn Web Designer Wall nos proporcionan una serie de minitutoriales sobre jQuery útiles para diseñadores web. Ejemplos claros, simples y enfocados sobre un tema.

21/02Newspond

6

NewspondNewspond es una especie de agregador de noticias automático, algo así como un Digg autómata. Realiza un seguimiento de cientos de sitios diferentes y lista las noticias más populares. El usuario puede añadir comentarios y guardar las noticias en su cuenta.

Realmente este sitio me gusta por otra cosa. Skeku, que es el que me pasó el enlace, sabía perfectamente que al ver este site se me iba a dar la vuelta la cabeza, y es que no es para menos. ¿Os habéis fijado en la perfección de la ejecución? ¿En el altísimo nivel de detalle gráfico? Mientras navego por Newspond, modifico mi perfil, realizo búsquedas, me siento como si estuviera delante de una aplicación de escritorio de Mac OS X.

Me interesé por conocer al autor y el resto de su trabajo es igualmente impresionante. Chan Karunamuni, que así se llama el autor, trabaja bajo el nombre de Injection Design y está metido hasta el cuello en la cultura de la web más vanguardista y los gráficos de nueva generación. Se ha ganado definitivamente aparecer en mi próxima envídia.

Putos cracks…

21/0245 blogs con diseños excelentes

0

45 More Excellent Blog DesignsEsta vez sí que me parece digna de reseña la compilación de diseños excelentes de la Smashing Magazine. He podido encontrar algunos realmente interesantes como Design*Sponge o toggle design.

19/02Typesites

0

TypesitesEn typesites se muestran y analizan sites con un interesante tratado tipográfico con una periodicidad semanal. La idea me encanta y seguro que se pueden descubrir sitios estupendos gracias a este descubrimiento.

18/02¿Qué es Silverback?

13

SilverbackSegún su propio feed RSS:

Clearleft are pleased to announce Silverback - a revolutionary new desktop application for web designers, available in the first half of 2008

De momento solo sabemos eso y que si entráis en silverbackapp.com y redimensionáis lentamente la ventana, vais a fliparlo.

Por cierto, el gorila es de Jon Hicks.

Actualización (1/03/08): Aún no sabemos qué es, pero en Vitamin ya han explicado cómo se hace el efecto del fondo.

Actualización (6/03/08): Jon Hicks nos muestra el proceso de trabajo del logotipo/icono de Silverback a la par que declara no poder decir de qué se trata todavía.

16/01La web de Barack Obama

1

La web de ObamaSi fuera un diseñador o desarrollador web residente en los EEUU, tendría bastante claro que mi voto sería para Barack Obama, ya no sólo por la política de cambio, sino por el pedazo de web por el que han apostado (aunque si no le cortaran el tupé y el formulario de inscripción no fuese tan feo tendría mejor puntuación).

Ojalá los de aquí se preocuparan lo más mínimo por este tema, Zapatero no se salva de la quema y no me hagáis hablar del pseudo-2.0 que se quisieron inventar los esbirros de Rajoy.

08/01Knob Buttons Toolbar icons

1

KnobsA todos nos gustan los iconos gratis, ¿verdad? Pues bien, un tal Cocoa Grove desde su cuenta en deviantART nos obsequia con Knobs, un set de iconos destinados a su uso en aplicaciones y web (dado su reducido tamaño: 32×32 pixels).

20/12iuneWind

0

iuneWindVía WebCreme me encuentro con iuneWind, un portafolio de trabajas bien cargado de gracia y 3D (parece que es lo que se lleva ahora ¿no?). También nos ofrece algún que otro regalito como este tutorial para emular uno de sus trabajos.

Por otro lado, ¿quien le dice que le ponga margin:0; al body en su CSS? Un despiste lo tiene cualquiera.

PromSite