Blog personal de Sergio Madrigal donde encontrar textos sobre ciencia y tecnología, psicología, cine y literatura y quizá alguna cosita más.

Categoría: Diseño (página 1 de 2)

Fotografia digital

Encontrando el tema adecuado

Cuando iniciamos un nuevo proyecto y una vez hemos decidido emplear una plataforma de gestión de contenidos (CMS), el siguiente paso tras la instalación de la plataforma va a ser el de seleccionar qué tema vamos a usar para nuestro front-end.

Aunque parezca a primera vista una tarea trivial (a priori se trata de buscar un diseño que nos guste y su proceso de instalación resulta más que sencillo), en realidad se trata de un paso clave que va a influir de manera determinante en el éxito de nuestro proyecto por varios motivos.

La importancia del diseño. 

Imagen

Está claro que para los seres humanos, en su inmensa mayoría, la primera toma de contacto con cualquier producto se realiza a través del sentido de la vista. En el mundo de Internet esta situación se produce de forma más notable puesto que hasta que no se desarrollen tecnologías del futuro, nuestra interacción con las páginas web se reduce a la vista y el oído.

Por ello es fundamental decidir qué queremos que transmita nuestro diseño en relación al producto que vamos a tratar de vender. ¿Buscamos sencillez para transmitir que lo importante ese el servicio que proporcionamos? ¿Nuestro producto debe mostrar creatividad y resultar atractivo para el usuario?

Interactividad

Muchos de los productos o servicios que desarrollamos requieren una interactividad por parte del usuario: ya sea una tienda online o una página de juegos al final el usuario va a tener que interactuar con ella. Por muy genial que sea nuestro entorno, por muy cuidado que sea el diseño gráfico, si olvidamos por un sólo instante que el usuario tiene que estar cómodo, tiene que entender lo que está sucediendo y sobretodo, tenemos que responder ante lo que él espera, estaremos completamente perdidos. Un usuario descontento raramente suele volver a visitarte.

En una mundo tan salvaje como el de Internet en el que cada día surgen nuevas ideas muy similares, cometer este tipo de errores es, sencillamente, letal.

Rapidez

Que sí, que jQuery es una maravilla, que cuando se empezó a pensar en que el navegador hiciera el trabajo sucio alguien llegó a la conclusión de que había cuadrado el círculo. Pero parece que nadie se paró por un momento a imaginar que no todos tendrán un Core i7 con 16 GB de memoria RAM.

Una página lenta es una muy mala página. Los efectos javascript están geniales para un nicho de negocio específico, no para todos. Si eres un gabinete psicológico lo que interesa es que tus futuros clientes vean qué servicios ofreces, tus tarifas, la forma de ponerse en contacto contigo y no que se pierdan entre movimientos alucinantes de fondos e imágenes de resoluciones imposibles.

La rapidez es una virtud indispensable para una página web. Hay estudios que han valorado el tiempo de atención medio de un usuario en una página y, creedme, es más bien escaso.

Tras algunos años de experiencia jugueteando con este tipo de problemas, mis consejos se reducen a tres:

Se simple, se directo. Busca ante todo que lo que sea relevante sea lo que vendes. Está claro que hay temas preciosos y llenos de extensiones maravillosas que hacen cabriolas en el aire. Pero al final tu objetivo, y eso no se te debe escapar, es vender tu servicio/producto. Enfoca todos tus esfuerzos en esa dirección.

Domina el terreno de juego.  Hay temas geniales, muy profesionales, con un panel de configuración más propio de un Boeing que de una plataforma web. Hay que tener mucho cuidado con esto y ser sinceros con uno mismo: ¿Hasta dónde llegan mis conocimientos? ¿Voy a pasar más tiempo customizando y adaptando mi tema para que funcione que desarrollando mi idea de negocio? Los errores más comunes que he visto cuando se elige un tema profesional son precisamente los relacionados con la incapacidad de los administradores del CMS de gestionarlos correctamente.

No pierdas el tiempo. Es una decisión importante ya que se trata de la imagen que va a tener tu producto o servicio para el resto del mundo pero mucho ojo con eternizar el proceso. Al final tu objetivo es vender un producto, un buen producto, un producto genial. Dedícale el tiempo justo al envoltorio y lánzate a lo que de verdad importa: tu idea de negocio.

Crea tu firma para cualquier foro en Photoshop.

Os traigo hoy un mini-tutorial de cómo realizar rápidamente una firma para cualquier foro de discusión online usando Adobe Photoshop.

En este caso he utilizado Adobe Photoshop CS5.

1. En primer lugar lo que tenéis que cercioraros es de la normativa de cada foro puesto que dependiendo de ésta las dimensiones de vuestra firma pueden variar. Creamos un nuevo documento con esas dimensiones:

IF

2. Creamos una selección sobre el lienzo y con ella creamos una nueva capa a la que llamaremos fondo. La rellenamos con la herramienta «bote de pintura» de blanco.

IF

3. Elegimos dos colores con cierto contraste: rojo – blanco por ejemplo.

IF

4. Aquí empezamos con la magia. Vamos a Filtro > Interpretar > Nubes de diferencia. Con esto generamos un fondo bastante mono que nos servirá de soporte para nuestra firma.

IF

5. Buscamos una foto interesante que tenga relación con la temática del foro.

IF

6. La añadimos a nuestra firma. Si al pegarla lo hacemos con «Pegar especial > pegar dentro» estando seleccionado el fondo conseguiremos tener enmarcada la fotografía en el espacio de la firma.

IF

7. Ahora toca ya la parte creativa: buscad pinceles, que hay muchos, poned vuestro nombre, alguna frase que os haga parecer interesantes y… voilá!

IF

Sincronizando proyectos.

Uno de los problemas, desde mi punto de vista, al que se tiene que enfrentar todo desarrollador web es el hecho de que tenemos la necesidad de desarrollar nuestro contenido en distintas ubicaciones y bajo distintos equipos.

Esto nos plantea la obligación de, tarde o temprano, unificar el proyecto para no estar «haciendo por un lado y deshaciendo por otro».

Existen una serie de sanas costumbres a la hora de realizar cualquier proyecto web que nos van a permitir agilizar y simplificar este proceso.

En primer lugar, debemos tratar de separar todo lo posible las distintas fases del desarrollo web: intentemos no mezclar el proceso de obtención de datos o desarrollo de bocetos, con el de diseño final o depuración de detalles. No tiene sentido que en el momento que estamos definiendo la estructura de nuestro proyecto nos centremos en describir un detalle pequeño de una de sus partes.

En segundo lugar, es necesario separar los elementos que componen un proyecto web. Esto es, definir un motor de funciones, un esquema HTML y el diseño gráfico de la forma más independiente posible. De esta forma permitiremos que varias personas trabajen simultáneamente en el proyecto sin que se estorben.

Finalmente, otra buena costumbre es permitir el sincronismo del proyecto. Esto me recuerda a una serie que hace años echaban por TV y en la que sus protagonistas, unos jóvenes aventureros, decían eso de «¡¡Sincronicemos nuestros relojes!!». Aquí pasa algo parecido. Debemos disponer de la información, de forma accesible en un servidor (bien en la intranet o bien en internet) que permita a los usuarios trabajar en distintas partes de un mismo proyecto y que sus modificaciones queden almacenadas de forma inmediata. Aptana, del que hablaremos largo y tendido por aquí, y del que ya comentaba algo bitelemental en su post sobre el mismo, permite sincronizar los proyectos a través de FTP/SFTP.

En definitiva, esto no son más que unos pequeños trucos para que a la hora de ponernos a desarrollar un proyecto no nos encontremos con la desagradable situación de disponer de 15 versiones del mismo y no saber qué partes son las importantes en cada versión.

18 diseños basados en pinceles de Photoshop

Desde esa página web podréis acceder a una lista de 18 diseños que han hecho uso de los pinceles de Adobe Photoshop.

Además de poder ver el diseño realizado, tendréis acceso a tutoriales y descargas para poder llevar a término diseños similares de forma muy intuitva y guiada.

Sin lugar a dudas, Photoshop es una herramienta tremendamente útil para el diseñador web gráfico, puesto que con su potencia y con los complementos que ofrece en forma de plugins, pinceles, acciones, etc. permite realizar trabajos profesionales muy cuidados.

Plantilla HTML para currículum.

Muchos de nosotros disponemos de página web y sería interesante que nos planteásemos el publicar un Currículum Vitae (quizás no completo y exhaustivo pero si con información laboral interesante) para poder direccionar a las personas que estén interesadas en contratarnos a este documento.

En Intenta nos ponen las cosas fáciles y nos muestran una plantilla en HTML realizada con muy buen gusto y que podremos rellenar con nuestros datos para disponer de un CV online sin demasiadas complicaciones.

Enlace | http://sampleresumetemplate.net/

Impresionantes fotografías de ciudades

Muchos conocéis mi creciente interés por el mundo de la fotografía que me está llevando a plantearme seriamente la adquisición de un nuevo capricho en forma de cámara Reflex semiprofesional.

Mientras me decido por cuál de todas las que muchos de vosotros me habéis recomendado, últimamente me ha dado por centrarme en las formas de realizar las fotos. Qué tipo de retoque se suele utilizar, etc.

Navegando he llegado a está increible página web donde se muestras fotografías de grandes ciudades con una calidad digna de mención.

Inmejorables para realizar fondos de pantalla, diseños para webs o incluso pósters motivacionales. Eso ya os lo dejo a vosotros.

Enlace | http://designm.ag/inspiration/cityscape-photos/

Vía | PuntoGeek.com

Fuentes de calidad gratuitas

Uno de los requisitos indispensables a la hora de realizar un diseño correcto y adaptado a las necesidades del usuario final es la selección de los tipos de de letra para los títulos, cabeceras e imágenes que vayan a aparecer en la web.

Desde fontex [fontex.org] tendrás al alcance del ratón una gran cantidad de fuentes gratuitas que podrás previsualizar directamente desde la web para decidir si se corresponden con lo que andas buscando.

free-fonts-to-download-premium-typefaces_1242336522816

Visto en:  wwwhatsnew.com

Porque la belleza está…

…en el Phtosohop!

Aunque suene gracioso es una realidad.

Por desgracia, vivimos en un mundo donde la imagen lo es todo y no nos percatamos de que, al final, lo que verdaderamente importa de un fruto no es su piel sino su sabor.