Tienes una cita con Affinity Photo

affinity-photo

Desde que allá por Agosto tuviera mi primera cita con Affinity Designer supe que volvería a verme con algún pretendiente más de la familia Serif. Y ese momento ha llegado.

Hoy, meses después de hacerse un huequecito en el mundillo maquero del diseño, han decidido lanzar la beta pública de Affinity Photo, el programa con el que pretenden comerle un poco la orejilla a Photoshop y de paso quedarse un trocito del pastel que somos nosotros los usuarios.

Lo que aquí escribo no es una review ni un análisis en profundidad. No he catado Affinity Photo lo suficiente como para poder emitir un veredicto bien fundamentado. Pero teniendo la beta tan calentita recién salida del horno, pensé que podría ser buena idea usarla para poder hacer un par de tareas del día a día.

affinity-photo-2

¿Qué puedo decir sin extenderme demasiado? Pues que probéis la beta [en] si cumplís los requisitos necesarios. Que el programa a pesar de estar en beta va fino fino y que es un gozo cacharrear con él. Supongo que no es casualidad su excelente rendimiento y es que debe estar muy bien pensado para aprovechar las tripas de los sistemas manzaneros. Y sutilmente ya lo he dicho. Affinity Photo es, de momento, only for Mac. Se suma a la lista de otros programas como Sketch o Pixelmator que gustan sólo de fruta para su dieta habitual. Una lástima sinceramente.

affinity-photo-3

Cuando te acostumbras a una forma de trabajar (Fireworks, Photoshop, Sketch…) un nuevo programa te lo pone todo un poquito cuesta arriba. Pero es cuestión de tocar botones y ver qué pasa. Es un juguete nuevo con el que “volver a empezar”. Y entrecomillo lo de volver a empezar porque reconoceremos elementos muy familiares a nivel de herramientas, funcionalidades y organización. De no ser así sería muy complicada la nueva incursión de Serif en nuestros sistemas. Podrá tener un precio atractivo pero si eso supone tener que romper con años de metodología quizá la comunidad no le pondría esos ojitos tan tiernos a Affinity Photo.

Lo que quiero decir es que la curva de aprendizaje con esta beta ha sido muy suave. He podido trabajar con máscaras y pinceles sencillitos sin mucha complicación. Quizá el retoque de máscaras me ha resultado algo más complicado, al igual que el ajuste de capas de curvas, porque no terminaba de entender si tenía que funcionar exactamente igual que en Photoshop o el método era diferente. Cuestión de prueba y error hasta dar con la solución. Lo del libro de instrucciones no va conmigo salvo que se trate de un electrodoméstico que necesita algo más que un enchufe para funcionar. Prefiero tocar aquí, ahí y allí para ver que pasa.

affinity-photo-5

Al igual que en Affinity Designer, hay muchos recovecos en los que meter la narizota para curiosear: pinceles (no hay soporte para .abr aún pero exportando PNGs con Brush pilot [en] se podría hacer un apaño), degradados (muchísimo mejor que en Photoshop), capas de ajuste, perfiles de color, acciones (con sus presets a lo Instagram), etc. En la web oficial tenéis un vídeo bien majo con más sorpresas y que fue lo que me convenció para probar la beta. También en los foros [en] empieza a verse movimiento generado por otros usuarios que han invertido algo de tiempo en trastear con Affinity Photo para empezar a encariñarse con él o notificar errores.

affinity-photo-6

Porque como buena beta que es no todo son alabanzas. Se me ha colgado en una ocasión con cierre incluído y también me he encontrado con algún fallo con ventanas flotantes y menús desplegables que se quedaban un poco tontorrones. No obstante al volver a abrir contaba con el trabajo recuperado (auto-guardado inside) y los otros errores mencionados entiendo que son algo achacable al estado preliminar del retoño y que serán imperfecciones que probablemente no nos encontremos en el producto final. Producto final que nos encontraremos, una vez más, a un precio bastante ajustado en su lanzamiento oficial.

Echadle un ojo al vídeo porque deja ver que Affinity Photo tiene miga y si os pica la curiosidad, a probar la beta que ofrece 10 días de uso sin limitaciones y me contáis qué tal 😉

Affinity Photo [en]

COMPD, design tips you can use

compd

Conozco el trabajo de Claudio Guglieri de rebote y gracias a míster David Navarro. Recuerdo que la primera vez que ví sus cositas en Dribbble se me cayeron los ojos, los dientes, las orejas… hasta el alma. Increíble. Soy un fan más.

No sé muy bien cómo (quizá después de cruzar algún mail con David) pero un buen día terminé visionando esta charla a duo de Claudio y David en el festival de La Lluna 2012 [youtube]. De entre todo lo visto, me guardé el enlace hasta COMPD, un pequeño rinconcito en el que Claudio desnuda alguno de sus experimentos gráficos y nos cuenta cómo los hizo.

lens-icon

Viniendo de alguien a quien admiro y respeto, me ha parecido información realmente valiosa. Es de obligado cumplimiento el hacerle una reseña aquí y eso que la web tiene sus telarañas y te la terminas entera en una tarde 😛 ¡Me he quedado con ganas de más!

COMPD, design tips you can use [en]

Lo que no te puede faltar si usas Photoshop para diseño web

photoshop-diseno-web

Actualización Febrero 2016: Añadido Duplicator

Cuando hablaba de Project Parfait dejaba claro que a día de hoy y para un nutrido grupo de profesionales, Photoshop sigue siendo una herramienta imprescindible a la hora de plantear un diseño web.

Llevo unos cuantos años en el mundillo y por mis “manos” han pasado archivos PSD que daban miedo. Y en algunas ocasiones puedo entender que la falta de organización o la realización de algunas “trampas” sean consecuencia de la falta de tiempo disponible. No obstante no deberíamos dejarnos llevar por el caos porque tampoco es tan costoso marcar una serie de pautas a la hora de preparar contenido web con Photoshop con el que luego terminas recibiendo felicitaciones (literalmente).

Con ese objetivo en mente, he preparado un curso llamado Buenas prácticas y ayudas al diseño web con Photoshop. Es un curso cortito, de nivel básico y muy sencillo de seguir, donde hablo de aspectos básicos que no cuesta nada tener en cuenta y que ayudan mucho en el trabajo de equipo. Creedme que es algo que agradecen los que tienen que coger tus archivos y luego continuar el diseño o extraer assets para su exportación. Aquí hablo en detalle sobre mis cursos y doy acceso a ellos.

Dentro del curso, menciono algunas características como Adobe Generator [en] (joyaza!) y otros “añadidos” imprescindibles si estamos usando Photoshop para diseño web. Me he propuesto ampliar la lista de añadidos y dejaros justo aquí, esos extras que considero MUY recomendables que os pueden ahorrar muchísimo tiempo en determinadas tareas. Y recordad que cuando hablamos de tiempo…hablamos de dinero 🙂

guideguide

GuideGuide [en] es un plugin gratuito para crear sistemas de rejilla / retículas personalizadas. Realmente es de los que no pueden faltar si queréis que equilibrar pesos visuales y acomodar vuestros diseños a una estructura sea coser y cantar. Ojito a Griddify [en] que es una alternativa gratuita también bastante destacable o Gridulator [en] en forma de herramienta online y no de plugin.

renamy

Renamy [en] es un extra para hacer renombrados múltiples sin esfuerzo. Una joyita con una versión pro sin límites [en]. Pensad en combinarlo con Adobe Generator para añadir extensiones y crear imágenes al vuelo para exportar. Ideaca 😀

png-hat

De hecho hablando sobre exportación automática o semi-automatizada hay unas cuantas opciones bien buenas. Por ejemplo PNG Hat [en] es de las que más me gusta y los chicos de Source están muy activos en el desarrollo de este tipo de extras como Avocode [en], iOS Hat [en], Social Kit [en], …

Además de PNG Hat, tenemos Cut&Slice me [en], PNG Express [en], Render.ly [en] o Slicy [en] (sólo para Mac). La idea es que la exportación de gráficos sea un proceso donde podamos ahorrar mucho más tiempo con alguno de estos añadidos.

Personalmente no veo que la comunidad se termine de poner de acuerdo sobre cuál es el mejor método para optimizar el flujo de exportación de archivos. Lo que más he probado ha sido usar directamente las opciones incluídas dentro de Photoshop (Generator) y no funcionan nada mal. Todo dependerá del uso que le demos al programa. Mi consejo es probar alguna de las alternativas.

ditto-photoshop

Con Ditto [en] podemos ir un paso más allá y emplear variables dentro de Photoshop con las que poder, por ejemplo, modificar rápidamente contenidos de capas de texto o colores. Merece la pena echarle un ojo.

flaticon

Ahorrar tiempo buscando material también sería posible con extras como Flaticon [en] y BlendMe.in [en] que nos permiten encontrar iconos fácilmente directamente desde Photoshop. En 40 de Fiebre nos recomiendan instalar los dos. Yo personalmente sólo he recurrido a Flaticon en alguna ocasión. Ya he comentado más de una vez que teniendo 2 o 3 kits premium de iconos, tengo más que suficiente. Véase Icons Solid [en], Webalys [en] o Streamline icons [en] por ejemplo.

glyfo

Glifo [en] para mí concretamente no es un imprescindible aunque puedo entender que a más de uno le venga bien un añadido que permita crear webfonts de forma directa dentro de Photoshop. Tiene pinta de ser bastante cómodo. Yo particularmente he usado un servicio llamado Fontastic [en] hasta ahora y no me ha ido mal.

velositey

Velositey [en] (gratuito) y WebZap [en] (de pago) sirven para que no partamos de cero en la fase de prototipado y sketching inicial ofreciéndonos una serie de elementos y bloques prediseñados. Reconozco que dentro de los “imprescindibles” son de los más prescindibles. Por lo menos bajo mi punto de vista.

ink

Ink [en] es un plugin que ayuda a documentar nuestros contenidos, extrayendo propiedades de tipo de letra, tamaños, color, distancias, etc… ¿Alternativas? Pues tenemos SpecKing [en] que hemos usado en el estudio en más de una ocasión o Specctr [en] que también compré y he terminado usando muy poco la verdad.

psd-cleaner

PSD-Cleaner [en] es una ayuda semiautomatizada para “limpiar” y organizar mejor el contenido de nuestros archivos PSD siguiendo algunas pautas marcadas en el excelente sitio web Photoshopetiquette [en]. Nos informa de capas que estén vacías, con nombres estandarizados y poco descriptivos, etc… Tiene buena pinta sin duda. Yo estas cosas las hago manualmente peeeeero si son un problema para vosotros, dadle una oportunidad 🙂

duplllicator

Duplllicator es la última extensión o añadido que he encontrado para Photoshop y que me ha parecido realmente destacable. Facilita enormemente el trabajo de copiado y duplicación de elementos 🙂

A partir de aquí, cada uno puede seguir personalizando su instalación de Photoshop al gusto. No hay que perder de vista Photoshoplr [en] ni Pspanels [en] porque revisando de vez en cuando ambas webs, estaréis bien nutridos de novedades con las que “supervitaminar” Photoshop. Son dos sitios excelentes y muy específicos sobre este tema. Sólo por estos links, ya merece la pena que hayas llegado hasta aquí 🙂

Os recuerdo que actualmente hay un buen puñado de cursos disponibles hechos por mí en video2brain, una de las formas con las que me gano el pan. En mi página sobre cursos y formación online hablo un poco más sobre video2brain. Así uno puede seguir formándose encajándolo de la mejor forma en su día a día. Yo me he visto ya un buen surtido de cursos también y es la mejor forma de poder compaginar el trabajo y las ganas de seguir aprendiendo. Además se pueden probar gratis 🙂

Project Parfait ¿Adobe enseña la patita del próximo Photoshop?

project-parfait

Bajo el nombre en clave Project Parfait, Adobe se está poniendo las pilas y ya nos está enseñando alguna de las próximas mejoras que tienen toda la pinta de acabar en futuras versiones de Photoshop y/o en ese supuesto sucesor de Adobe Fireworks que puede que aparezca el día menos pensado. Aunque teniendo en cuenta que podemos juguetear con el experimento usando archivos PSD, la cosa deja poco márgen a la imaginación

Estaba cantado que algo tenían que hacer. Sea o no sea la mejor elección, Adobe Photoshop es un entorno que a día de hoy se usa enormemente como herramienta de diseño web. Y no hay discusión ante esto. Son quizás los pequeños detalles los que hasta hace no demasiado conseguían que más de uno se tirase de los pelos al meterle mano a un PSD. Otros sin embargo se las ingeniaban para lanzar añadidos tan útiles como CSS Hat o specKing [en] por citar un par.

Total, que es ahora Adobe la que nos deja ver algunas de las mejoras “obvias” y “necesarias” en un programa de retoque y edición de imágenes (nótese el sarcasmo): medición de distancias entre objetos, extracción y mejor copia de propiedades CSS, etc… En el apartado de preguntas frecuentes indican además que el objetivo es ir mejorándolo junto a una mejor integración con Adobe Generator (que un servidor piensa que es un puntazo).

¿El objetivo? Que la obtención de imágenes y recursos y que en general el flujo de trabajo entre diseño y desarrollo sea cada vez menos “duro”. Siendo así, sólo puede ser algo bueno.

Project Parfait [en]

21 estilos de texto con Photoshop y Smart Objects

21-efectos-texto-photoshop

Dicen que segundas partes nunca fueron buenas, pero espero que el dicho no se cumpla en esta ocasión. Porque si buscas un pack de efectos de texto para Photoshop que sean mínimamente decentes, toca echarle un vistazo al freebie que he preparado para la ocasión, celebrando las más de 11.000 descargas que lleva el primer set hasta el momento.

Le he cogido el gustillo a cacharrear con los estilos de capa y objetos inteligentes en Photoshop y pensé que podía preparar un segundo pack y liberarlo nuevamente. No sé si llegaremos a las mismas cifras de descarga pero hay que intentarlo!

Hasta 21 efectos en total, repartidos en 12 archivos PSD. Tenéis toda la chicha y más información en el linkito que sigue. Espero que os gusten!

21 estilos de texto con Photoshop y Smart Objects

Digital Brushes, pinceles profesionales para Photoshop

Digital brushes

De pinceles se ha hablado mucho por aquí ya (echa un vistazo a los resultados de la búsqueda) y era un tema que tenía apartado porque en el día a día no he necesitado demasiado seguir buscando nuevo material. Pero hace no mucho me pasaron el link hasta Digital Brushes y creo que es un recurso que merece mucho la pena comentar y que hará las delicias de todos lo que practiquéis el noble arte de la ilustración digital.

Y es que si pasamos por el enlace que dejo más abajo, nos encontramos una más que selecta recopilación de pinceles a medida creados por artistas del trazo digital, muchos de ellos ya mencionados por aquí como por ejemplo Goro Fujita o Thierry Doizon. Una labor de selección que agradezco desde ya.

digital-brushes-02

Digital Brushes [en]

14 estilos de texto con Photoshop y Smart Objects

14-estilos-texto-photoshop

Hace unos días terminé un pequeño pack de estilos de texto con Photoshop y lo compartía en el blog del estudio.

Hacía bastante que no “liberaba” ningún freebie en condiciones y me ha parecido una buena oportunidad. Por un lado he aprendido alguna cosa más a la hora de trabajar con Smart Objects en Photoshop y por otro consigo un surtido de estilos bien majetes para compartir con vosotros.

Mi idea será seguir refinando y conseguir hacer más sets. Con un poco de suerte me anime a ofrecerlos en algún marketplace pero de momento este primer pack es completamente gratuito.

Tenéis más información y el enlace al pack justo aquí:

14 estilos de texto con Photoshop y Smart Objects

UPDATE! Consigue el segundo pack de estilos de texto. 21 efectos más!

The FontShop plugin, prueba las fuentes de FontShop en Photoshop

FontShop plugin

Estupendíiiiiisimo plugin este The FontShop plugin que nos va a permitir previsualizar y comprobar cómo quedarían las diferentes opciones tipográficas que ofrecen en su extenso catálogo, directamente en Photoshop sin necesidad de pasar por caja. Estamos hablando de poder probar cualquier fuente de sus más de 150.000 opciones disponibles :_)

Hasta ahora servidor tiraba de capturas de pantalla en algunas ocasiones mediante el simulador de la web, pero esto es un gran paso adelante. Y aunque tiene alguna limitación, la emoción me embarga.

El plugin es compatible con Photoshop 5 o 5.5 de momento. En el link a continuación viene todo explicado de manera sencilla, con vídeo tutorial incluído.

The FontShop plugin [en]

The ustwo™ Pixel Perfect Precision Handbook

Pixel Perfect Precision HandBook

¿Cuántas veces hemos oído que la diferencia está en los pequeños detalles? Muchas, ¿verdad? Pues con la vida en píxels pasa igual. Y no estoy hablando de la perfect people create perfect designs [en] 😛

Os traigo un recurso cortesía de mi señor jefe en [Q]. Se trata de un pequeño PDF (también disponible como app gratuita para iPad con algún extra) en el que el estudio ustwo™ [en] ofrece una serie de consejos y pistas para trabajar correctamente en Photoshop e Illustrator con precisión milimétrica y una organización más que correcta.

Es ideal para principiantes que quieren mantener una metodología manejable en lo que a organización y creación de objetos en Photoshop se refiere por ejemplo. A usuarios más avanzados muchas de ellas ya se las tendrán más que “requetesabidas”. Pero ya seas novato o usuario avanzado, la verdad es que siempre se agradecen estas cosas, ¿verdad?

The ustwo™ Pixel Perfect Precision Handbook [en]

Filter Forge 3

Filter Forge 3

Me confieso fan de Filter Forge y es que ya he hablado más de una vez sobre este maravilloso añadido para Photoshop que permite crear patrones y texturas de una calidad majestuosa. Que digo majestuosa… tremebunda. Si no lo habéis probado hasta ahora, echarle un vistazo. De verdad que merece la pena. Quizá no para el día a día (aunque todo dependerá de nuestro trabajo) pero puede ayudar a la hora de crear imágenes de la nada y efectos muy muy resultones.

Pues bien, ha llegado a la tercera versión con un buen puñado de novedades entre las que destacar la mejoría en los tiempos de preview y render. Y es que todo tiene que tener un precio (además del económico) y es la lentitud con la que se generan las previsualizaciones y los posteriores renders finales de los filtros. Más aún teniendo en cuenta que la única versión que soporta multihilo es la más cara de todas.

En cualquier caso, ya digo que deberíais pegarle un vistazo a la demo y juguetear un poco con ella. Tras el extinto imageSynth, este plugin me parece un imprescindible para los que gusten de trastear con patrones y efectos.

Filter Forge 3 [en]