Transforma dibujos hechos a mano en código HTML

Cuando comenzamos a diseñar una web solemos usar un lápiz y un papel. Los primeros borradores en servilletas, las plantillas en din-a4… el papel siempre ha sido parte del proceso, y hay una plataforma que puede aprovecharlo.

Se trata de una web en la que podemos subir nuestro dibujo escaneado para obtener el código HTML correspondiente, algo que puede ayudarnos a ahorrar tiempo. Continúa leyendo «Transforma dibujos hechos a mano en código HTML»

Designmodo presenta una nueva forma de hacer sitios web sin programar

Desde designmodo llega hoy una de las plataformas más esperadas en el sector de la creación de sitios web, plataforma que lleva varios meses siendo anunciada: Slides 5.

Se trata de la quinta generación de una herramienta que nos permite crear sitios sin saber programar, con funciones que nos permiten desde definir diseño a organizar contenido, todo online, y sin ser necesario poner ni una sola línea de código (aunque en algunos casos podemos hacerlo para ampliar la flexibilidad). Continúa leyendo «Designmodo presenta una nueva forma de hacer sitios web sin programar»

Disha Pages es una buena forma de crear una web sin saber nada de programación

Durante los últimos años han aparecido muchas opciones que nos permiten crear páginas de presentación. Desde el clásico about.me a otras opciones menos conocidas, este sector ha estado siempre muy vivo, y la nueva Disha Pages lo demuestra.

Se trata de una opción que permite crear un perfil atractivo de cualquier usuario en poco tiempo, sin necesidad de programar, y con varias herramientas que lo distinguen de la competencia. Continúa leyendo «Disha Pages es una buena forma de crear una web sin saber nada de programación»

Marvel lanza una nueva versión de su herramienta para crear diseños de aplicaciones

marvelapp

En marvelapp.com tenemos una conocida herramienta de creación de diseños, de borradores de aplicaciones y sitios web, que lleva mucho tiempo como uno de los lí­deres en su categorí­a.

Marvel ha presentado hace pocas horas su nueva versión, con una interfaz renovada y una guí­a de estilos que, dentro de poco, tendrá el código libre para que cualquiera pueda consultarlo.
Continúa leyendo «Marvel lanza una nueva versión de su herramienta para crear diseños de aplicaciones»

3 recursos para diseño web que seguro que no conoces

Veamos ahora una lista de recursos útiles para quien trabaja con diseño web, herramientas que pueden usarse para dar un toque de originalidad a nuestros proyectos o para trabajar más rápido, ya que todos ellos pueden aplicarse en muy poco tiempo.

gradient.quasi.ink: Se trata de un código que genera un fondo aleatorio de una forma bastante original: elegimos una imagen cualquiera y este programa hace un superzoom de una región especí­fica, antes de suavizarla con un algoritmo propio. el resultado es un color suave que puede usarse como fondo de pa´ginas web, protector de pantalla y otras utilidades semejantes.

Shower: Programa de código abierto, disponible en github, que podemos usar para hacer presentaciones en la web. Las diapositivas se pueden crear de forma sencilla, y es posible pasar de una a otra con el cursor del teclado. Dentro de cada una es posible mostrar listas, textos, columnas, avisos… es bastante flexible, y el resultado es muy rápido.
Continúa leyendo «3 recursos para diseño web que seguro que no conoces»

Tres proyectos ideales para diseñadores web

Pensemos ahora en los webdesigners que buscan recursos originales, tanto para agilizar su trabajo como para encontrar contenido de forma sencilla, y hagámoslo con tres sitios que no pueden faltar en su barra de favoritos:

NounProject

captura-55

Os lo presentamos en 2012 como un proyecto que nos permite contribuir con nuestro icono, representando cualquier concepto que deseemos, dejándolo disponible para que otras personas puedan usarlo en sus trabajos.

Existe una infinita colección de iconos de todo tipo, clasificados y gratuitos cuando se da licencia al autor, con una opción de pago para obtener todo el contenido si necesidad de poner el link de referencia al creador.

Está disponible en varios idiomas, podemos bajar los iconos desde la web y es posible instalar una aplicación Mac para facilitar el uso.
Continúa leyendo «Tres proyectos ideales para diseñadores web»

5 páginas sencillas y útiles para diseñadores web

Entre los miles de recursos que hemos divulgado en los últimos años dentro de la categorí­a «Utilidades para diseño», hemos seleccionado hoy cinco que pueden ser muy útiles en el dí­a a dí­a, aplicaciones poco sofisticadas, pero que pueden ayudar a ahorrarnos tiempo.

Aquí­ tenéis la lista:

resizeappicon: Solo tenemos que subir un logo cuadrado y especificar el tamaño de los iconos que queremos que se generen de forma automática. Hay decenas de opciones disponibles, y pueden descargarse todos al mismo tiempo.

captura-86

firesize.com: una aplicación que altera el tamaño de una imagen con solo cambiar la url de la misma.

Si nuestra foto es de 2000í—800 y está guardada en miweb.com/imagen.jpg, solo tendremos que acceder a https://firesize.com/800í—100/g_center/https://miweb.com/imagen.jpg para tener una versión en 800í—100, imagen que se guardará en varios servidores para que nuestros lectores la carguen desde el más cercano.

Buscadores de iconos: Nunca nos cansaremos de indicar buscadores de iconos de todo tipo, pero la recopilación de cinco buscadores que hicimos hace unas semanas vale la pena ser revisada.

Pablo, de buffer: Ideal para crear en segundos un banner compuesto de una imagen de fondo y un texto destacado.

vectormagic.com: transforma imágenes en baja resolución en vectores casi perfectos, ayudando así­ a ampliar el tamaño sin perder calidad.

captura-87

Es parecido a lo que hacen en vectoriza.com o en autotracer.org, pero puede probarse de forma gratuita.

picnic, para tener una página web, con dominio propio, en pocos minutos

captura-1

Hay muchas formas de tener una web con dominio propio sin invertir mucho dinero, desde crear una cuenta en wordpress.com y asociar nuestro dominio hasta apostar por opciones de creación intuitiva de contenido (como wix, por ejemplo), pero pocas son tan sencillas como picnic.

Se trata de un proyecto en el que solo tenemos que hacer tres cosas:

– Indicar el nombre del dominio deseado
– Pegar el HTML de la página que queremos mostrar al mundo (podéis construirlo fuera de picnic u obtener ejemplos aquí­)
– Realizar el pago de 18 dólares, obteniendo así­ tanto el dominio como 1 año de hospedaje (el precio puede cambiar dependiendo del tipo de dominio, pero los .com, .net, .org y otras opciones cuestan los 17,99 dólares anunciados en su página principal).

Aunque es cierto que hay otras opciones más baratas, ninguna que ofrezca dominio propio es gratuita, y en este caso la compra del dominio está incluida en el precio, por lo que no es excesivamente caro.

El sitio web creado solo tiene una página, no hay opciones de crear menús ni de ofrecer interacción más allá de la que pueda incluirse dentro del HTML, por lo que no es ideal para mostrar la página de una compañí­a (por ejemplo) y sí­ para tener un contenido estático disponible para el dominio deseado.

coolors, una web que nos ayuda a decidir los colores de nuestro próximo proyecto

Aquí­ tenemos un nuevo proyecto relacionado con el mundo de los colores, para ampliar la lista que hicimos hace pocos meses.

Se trata de coolors.co, aplicación que ayuda a encontrar la paleta de colores ideal para nuestro nuevo proyecto, jugando tanto con las combinaciones aleatorias que genera como con las decisiones que tomemos en todo momento.

Una vez abierto podemos ver diferentes combinaciones de colores, que irán cambiando con la barra espaciadora. Si nos gusta uno o varios colores de dicha paleta, podemos congelarlos para que sigan apareciendo en las siguientes propuestas, que se repetirán hasta que demos con la combinación ideal.

Es posible pulsar en el código de cada color para especificar uno determinado (el de un logo, por ejemplo), y ver como las siguientes propuestas se adaptan a ese cambio en busca, siempre, de un conjunto de colores «que pegue».

Al finalizar podemos copiar la url de la paleta deseada y compartirla con otras personas (con el cliente, por ejemplo), ayudando así­ a agilizar el proceso de decisión de colores de una web, aplicación, diseño, etc.

pixelapse, un sistema de control de versiones para diseñadores

Para Windows o Mac, para quien trabaja con Photoshop, Illustrator, InDesign, Fireworks, Graffle, Sketch … pixelapse (pixelapse.com) es un nuevo proyecto que ofrece la posibilidad de guardar las versiones de los trabajos que realizamos, siempre orientado al diseño.

A medida que trabajamos con nuestras herramientas habituales, pixelapse detecta cuando guardamos una versión, subiéndola de forma automática a su plataforma para ofrecer un control inteligente de versiones. No hay lí­mite en el quesito «historial guardado», por lo que es posible guardar miles de versiones de una misma imagen, siempre disponible para recuperarla en cualquier momento. La plataforma se integra con Dropbox, ayudando así­ a los que usan dicha plataforma de almacenamiento.

Con los trabajos que hay en la web podemos solicitar ayuda a otras personas para que opinen y generen una discusión de cada imagen allí­ presente, permitiendo de esa forma obtener feedback tanto de los clientes como del resto del equipo de trabajo.

pixelapse es gratuito para los que no se importen en mostrar sus proyectos de forma pública (de hecho lo anuncian como gratuito para los proyectos con fuente libre), con una gama de precios proporcional a la cantidad de proyectos privados que necesitemos tener bajo control.