Publicaciones sobre: Diseño

+
Ago 30


Diseño | Comentar »

Si quieres hacer tu Web basada en un esquema de colores o a partir de un color concreto, en el siguiente enlace encontrarás un diseñador online de paletas de esquemas de colores. Muy útil y sencillo de utilizar:

» Color Scheme Designer

Escrito por Janmi el 30/08/2010 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: , , ,
Noticias Posiblemente Relacionadas [Lista automática]:

+
Jul 19


Diseño | Comentar »

A continuación tenéis una galería de diseños de relojes modernos y futuristas, que bien podrían haber salido de una película de ciencia ficción:

» 22 Coolest and Creative Watch designs

Escrito por Janmi el 19/07/2010 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: , ,
Noticias Posiblemente Relacionadas [Lista automática]:

+
Jul 08


Diseño | Comentar »

Aquí tenéis 5 sets de iconos gratuitos sobre el fútbol y el Mundial de Fútbol de Sudáfrica 2010.  En total hay más de 150 iconos, incluyendo iconos de banderas de las selecciones de fútbol, icono de la copa de fútbol de Sudáfrica, iconos de tarjetas de fútbol, iconos de estadios, iconos de jugadores de fútbol, iconos de vuvuzelas, iconos de zapatos de fútbol, iconos del balón de fútbol, etc…

» Football Icons (enlace a los iconos gratuitos de fútbol)

Escrito por Janmi el 08/07/2010 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: , , , , , ,
Noticias Posiblemente Relacionadas [Lista automática]:

+
May 18


Desarrollo, Diseño, No lo Sé | Comentar »

descargar iconos gratis iconfinderDOTcom

¿Te gustaría descargar iconos e imágenes para tu Web, presentaciones power point o documentos? En la siguiente Web tienes un montón de librerías de iconos gratuitas así como un potente buscador para encontrar lo que necesites.

» Iconfinder.com – descargar iconos gratuitos

Escrito por Janmi el 18/05/2010 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: , , , , , ,
Noticias Posiblemente Relacionadas [Lista automática]:

+
Mar 22


Desarrollo, Diseño, Libros | Comentar »

the smashing bookTítulo: The Smashing Book

Idioma: inglés (nivel básico-médico con tecnicismos)

Autores: varios

Fecha de Lectura:  10/03/2010 (gracias a Costi y Joselite por regalármelo!!)

Género: técnico

Puntuación: 4 de 5

¡Imprescindible referencia para desarrolladores Web!

Como usuario asiduo del magnífico portal smashingmagazine.com, este libro supone un compendio de los mejores y más útiles artículos del mismo portal. De hecho, fueron los propios usuarios del Web los que votaron qué contenidos y diseño tenía que aparecer en el libro. ¡Un libro social!

Índice de contenidos:

  • Preface
  • User Interface Design in modern web applications
  • The art and science of CSS-Layouts
  • Typography: rules, guidelines and common mistakes
  • Usability Principles for modern websites
  • The ultimate guide to fantastic color usage
  • Optimization for websites
  • Design to sell –  increasing conversation rates
  • How to turn a site into a remarkable brand
  • Learning from experts – interviews and insights
  • Behind the curtains: the smashing magazine story
  • Authors

¡Libro recomendable!

» Comprar The Smashing Book

Escrito por Janmi el 22/03/2010 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: , , , ,
Noticias Posiblemente Relacionadas [Lista automática]:

+
Ene 29


Diseño | Comentar »

Iconos y dibujos del nuevo iPad de Apple:

» Descargar iconos del iPad (gratis)

Escrito por Janmi el 29/01/2010 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: , ,
Noticias Posiblemente Relacionadas [Lista automática]:

+
Ene 22


Desarrollo, Diseño | Comentar »

menu css

A continuación tenéis un listado de menús CSS gratuitos así como galerías con diversos diseños:

»»» Free CSS Menu (recomendado y enlaces para descargas)

» 30 Free CSS Based Navigation Menus

» 120 Excellent Examples of CSS Horizontal Menu (diseños)

»» CSS-Based Navigation Menus: Modern Solutions (diseños, muy bueno)

» Free CSS Drop Down Menu Generator (generador online de menus css)

» CSS Menu Generator (generador de menus css)

» Advanced CSS Menu (precioso menu CSS gratuito)

» CSS navigation menu (sencillo)

Escrito por Janmi el 22/01/2010 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: , , , , , , ,
Noticias Posiblemente Relacionadas [Lista automática]:

13
Ene 21


Diseño | 13 Comentarios »

tutorial avatar navi photoshop

¿Te gustaría convertir una foto tuya en un Navi, uno de los avatares de la película de James Cameron? Aquí tienes un sencillo tutorial en Photoshop de cómo hacerlo.

Este tutorial requiere conocimientos MEDIOS de Photoshop, el dominio del filtro LIQUIFY, de las herramientas SMUDGE y PATCH, control sobre la iluminación LEVELS, la SATURACIÓN y de las capas de Photoshop :)

  1. PREPARACIÓN:
  2. Encontrar la imagen tu fotografía más apropiada para el montaje. Conviene que sea una en la que aparezcas de frente, con un fondo blanco o negro y sin muchos reflejos o sombras.
  3. Descargarte un Poster de Avatar en el tamaño más grande que puedas
  4. PIEL:
  5. Cambiar la saturación a azul. Coge el color de la cara de un Navi del poster de la película Avatar. También puedes probar con este color: #315996
  6. Suaviza tu piel con la herramienta “Smudge”
  7. Juega con los niveles de iluminación (LEVELS) para dar con el tono correcto de piel
  8. Añade algunas sombras a tu cara con el pincel. Coge el azul oscuro del poster de la peli.
  9. Copia y pega un trozo de piel de un Navi de la peli y colápsala en tu piel(CTRL+E)
  10. Usa la herramienta PATCH para copiar piezas de la nueva piel del Navi con tu propia piel
  11. Copia y pega un ojo real de un navi y adáptalo al hueco de tu ojo  (CTRL+T)
  12. Usa el pincel con el color blanco y tamaño pequeño para añadir puntos de diferentes tamaños sobre la piel (las pecas luminosas de los navi). Añádeles el siguiente estilo de capa:
    Outer Glow effect
    - Blend Mode: Screen
    - Color: #3a7987
    - Technique: Softer
    - Spread: 5%
    - Size: 10px
  13. NARIZ:
  14. Adapta tu nariz con el filtro LIQUIFY. Tiene que quedarte achatada y con aspecto felino.
  15. Achata la nariz seleccionando y moviendo la imagen: seleccionas y mueves con las flechas. Luego suaviza los bordes con SMUDGE.
  16. CEJAS Y OJOS:
  17. Reduce las cejas con la herramienta de borrar y la de SMUDGE. ¡Tienen que ser muy finitas!
  18. Agranda hasta que parezcan los ojos con el filtro LIQUIFY.

Hay algunas palabras técnicas de photoshop en inglés ya que estoy acostumbrado a usar Photoshop en Inglés :P

En este tutorial no se explica cómo crear las orejas, pero básicamente sería un copiar-pegar, adaptar color y suavizar.

» El mismo tutorial en Inglés: Avatar Movie Photoshop Tutorial

» RESULTADO del tutorial: Me as a Navi

Escrito por Janmi el 21/01/2010 | Comentar (13) | Versión Imprimible Versión Imprimible
Etiquetas: , , , ,
Noticias Posiblemente Relacionadas [Lista automática]:

1
Ene 14


Diseño, Fondos | 1 Comentario »

¿Te gustaría tener ordenados los iconos del escritorio del ordenador de tu trabajo? ¿Estás harto de que tu escritorio sea una bolsa de m&ms?

Aquí tienes un pequeño tutorial para crearte un fondo útil para tu trabajo.

Lo primero de todo es prepararnos para lo que vamos a hacer:

1. Asegúrate de cuál es tu resolución de pantalla

2. Obtén un fondo de pantalla para tu resolución.  En este enlace tienes algunos muy chulos:

» Fantastic Wallpapers That Will Blow Your Desktop Away

3. Arranca Photoshop, y sigue este tutorial :)

PASO 1: Prepara todo para el montaje

Tutorial Cómo hacer un fondo de pantalla útil para tu trabajo 01de03

PASO 2: Crea las cajitas donde organizarás tus iconos

Tutorial Cómo hacer un fondo de pantalla útil para tu trabajo 02de03

PASO 3: Borra la captura de pantalla de tu escritorio y añade los textos para las cajas

Tutorial Cómo hacer un fondo de pantalla útil para tu trabajo 03de03

Aquí tienes el tutorial para conseguir el efecto de texto reflejado:

» Tutorial reflejo 2.0 (by Janmi)

Ejemplo de alguna de las cosas que  podéis hacer con un poco de creatividad:
» The Icon Tray Wallpaper

Escrito por Janmi el 14/01/2010 | Comentar (1) | Versión Imprimible Versión Imprimible
Etiquetas: , , , , ,
Noticias Posiblemente Relacionadas [Lista automática]:

10
Dic 28


Diseño | 10 Comentarios »

Me as Navi, originalmente cargada por Janmi_.

  1. Find the proper picture you want to manipulate
  2. Change saturation to blue. Pick the color from an Avatar-Movie poster
  3. Soft your skin with Smudge tool
  4. Play with LEVELS in order to get the proper light (darkness please)
  5. Add some shadows with brush. Take the dark blue from an Avatar-Movie poster
  6. Adapt your nose with LIQUIFY filter.
  7. Make a shorter nose by selecting and dragging your face
  8. Make thinner eyebrows and also soft them with brush + opacity
  9. Use LIQUIFY again to make your eyes look much feline
  10. Copy and paste a piece of Avatar-Movie skin and collapse (CTRL+E) with your skin
  11. Use PATCH tool in order to copy the pieces of your new skin to the rest of the skin
  12. Copy and Paste an eye of a real avatar and adapt it to your eyes (CTRL+T)
  13. Use BRUSH with white color and place some spots of different sizes. Then add them the Following Layer Styke:
    Outer Glow effect
    - Blend Mode: Screen
    - Color: #3a7987
    - Technique: Softer
    - Spread: 5%
    - Size: 10px

Lo he puesto en inglés para que lo pueda hacer más gente y… porque mi Photoshop está en Inglés XD

Escrito por Janmi el 28/12/2009 | Comentar (10) | Versión Imprimible Versión Imprimible
Etiquetas: , , , , , , , ,
Noticias Posiblemente Relacionadas [Lista automática]:

+
Dic 12


Diseño | Comentar »

1024x768 optimized

El ancho mínimo contando la barra de scroll vertical es de 995px.

Si tuvieramos por certeza que no habrá scroll vertical, nos bastan 1005px de ancho.

El ancho visible en Firefox a 1024x768px es de 560px.

Escrito por Janmi el 12/12/2009 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: ,
Noticias Posiblemente Relacionadas [Lista automática]:

+
Dic 11


Diseño | Comentar »

Christmas icons

Christmas icons

Aquí tenéis un nuevo set de iconos navideños en diferentes formatos gratis gracias a SmashingMagazine:

Escrito por Janmi el 11/12/2009 | Comentar | Versión Imprimible Versión Imprimible
Etiquetas: , ,
Noticias Posiblemente Relacionadas [Lista automática]:

« Noticias Antiguas