Curated by: Luigi Canali De Rossi
 


30 January 2007

Cree Portfolios De Imágenes Interactivos Que Pueden Ser Incrustados En Cualquier Página Web: Leafletter

Si usted quiere crear un portfolio electrónico de trabajos creativos o un acertijo visual de imágenes sobre un tópico específico, para ser integrado fácilmente dentro de una página web existente o distribuido viralmente a través de la mayor cantidad de sitios posibles, Leafletter quizá tenga lo que usted está buscando.

De hecho, la nueva solución basada en web Leafletter, hace posible crear de manera sencilla micro-websites de gran aspecto a partir de cualquier texto y conjunto de imágenes que quiera utilizar. El portfolio visual de mini imágenes resultante es completamente navegable y puede ser incrustado sin esfuerzos dentro de cualquier página web o blog.

"Leafletter le permite crear un mini-sitio Flash e integrarlo (via cortar y pegar) en cualquier página web, blog o página de redes sociales social. Esta aplicación es muy útil para crear un portfolio virtual y ha sido concebida para diseñadores, para medios y para compartir contenido multimedia."
(Fuente: Telapuntozero)

"Si usted es un artista, diseñador o fotógrafo, o se dedica a cualquier profesión en la cual tiene un portfolio para mostrar su trabajo, Leafletter es indispensable."
(Fuente: TecnoChica)

Leafletter atrae de sobremanera a no-geeks, a aquellos que ansían la integración efectiva de visuales y texto dentro de sus sitios web y en particular a aquellos que necesitan exhibir o proporcionar un acceso más detallado a conjuntos de imágenes anotadas sin interrumpir el flujo de la página web (como sucede a menudo actualmente).

Con el, cualquiera puede rápidamente subir y ordenar múltiples imágenes digitales dentro de un cuadro visual personalizable, agregar textos e hiperenlaces y publicar el widget web resultante con la mínima molestia.

En la siguiente revisión, analizo como Leafletter promete facilitar la creación de interesantes, innovadoras y dinámicas mini configuraciones que pueden contener múltiples elementos de información interactivos, independientemente de sus capacidades técnicas y de diseño.

 

Cree Portfolios De Imágenes Interactivos Que Pueden Ser Incrustados En Cualquier Página Web: Leafletter

Introducción a Leafletter

Leafletter acerca la configuraciones de buen aspecto al resto de nosotros, y me sorprendí gratamente de lo fácil que era tener páginas simples en funcionamiento. Si usted lo piensa como una combinación entre web widgets - en términos de la capacidad para crear e incrustar contenido dinámico - y las recientes herramientas de presentación online como Spresent, estará en el camino correcto.

Pero Leafletter realmente no cae en ninguna categoría ya que su función principal y la creación de micro-websites visuales que pueden navegarse fácilmente como si estuviera hojeando un folleto o portfolio. Por este motivo, será una herramienta popular para cualquiera que quiera agrupar una colección de diseños de páginas como si fueran un catálogo online, portfolio, introducción a un sitio y así.



Todo se trata de cuadrículas

Estos días, por supuesto, el diseño se hace casi exclusivamente utilizando computadoras, pero algunos de los métodos fundamentales utilizados en agrupar diseños siguen siendo los mismos. El diseño de la grilla evolucionó en la era pre-computadora como una forma de crear diseño coherente que se interconectara apropiadamente, con una cierta consistencia visual. Si usted piensa en una página (o pantalla) como una cuadrícula, se hace más fácil comenzar a ubicar elementos de una manera visualmente placentera, en vez de arrojar texto e imágenes de manera aleatoria.

Leafeletter_page_layout_interface_550.gif

Leafletter trabaja a partir de este simple sistema de reticulado para que compartir imágenes y presentaciones sea tan sencillo como seleccionar de un rango de 36 diseños pre configurados. Si eso suena restrictivo, lo que tiene que tener en mente es que esas grillas son un poco más que un esqueleto para su contenido. Cuando haya seleccionado el color, imagen y ubicación del texto de su página final, la retícula habrá desaparecido, dejando en su lugar un buen diseño. Tome cualquier revista y, si mira con suficiente atención, verá que se ha seguido el mismo proceso.



Haciendo grillas usted mismo

Si la grilla es el esqueleto de su diseño, deberá seleccionar el contenido, esquema de color y espaciado. Mientras que Leafletter no puede enseñarle cuáles combinaciones de color son las mejores, o donde ubicar sus imágenes y textos en relación uno con otro, lo que puede hacer es probar diferentes posibilidades muy fácil.

Dentro de los cuadrados y rectángulos de su grilla elegida, puede tener tres decisiones básicas para hacer:

  • ¿De qué color le gustaría que fuera el cuadrado?
  • ¿El cuadrado albergará un imagen o será dejado en blanco?
  • ¿O lo usará para agregar texto a su configuración?

Estos son, por supuesto, los fundamentos de la configuración - texto, imágenes y bloques de color ubicados en una página. Leafletter permite un poco más que eso, pero veamos primero la parte básica.

colour_ll.jpg

El menú es simple y le permite ponerse a trabajar rápidamente en personalizar su retícula de diseño. Cada cuadrado individual puede tener un color diferente el cual puede ser dejado en blanco o usado como fondo para una imagen o porción de texto. Como podría esperar, hay un buen rango de colores de dónde elegir y hay una buena selección de diferentes tonos disponibles si usted quiere un aspecto monocromático para su diseño.

Una cosa que me gustaría ver disponibles es la posibilidad de deshabilitar las líneas de reticulado las cuales algunas veces encuentro distraen los resultados visuales de mi diseño final. También sería bueno tener bloques de color disponibles obviando esas líneas negras y que en futuras ediciones del servicio hagan de esto una opción.

image_ll.jpg

Seleccionar imágenes también es sencillo y versatile. Usted puede subir directamente las imágenes desde su disco rígido, acceder a su cuenta Flickr e importar desde ahí o incluso señalarle a Leafletter cualquier URL que contenga una imagen. Esto trabaja como una manera muy flexible de obtener imágenes y elimina la molestia de tener que subirlas individualmente si usted ya tiene su trabajo visual online.

Entonces, si bien las opciones para obtener imagines de Leafletter es altamente plausible, otra mejora potencial que realmente me gustaría, sería la inclusión de un navegador visual Flickr, como el que está destacado en SPresent.

text_ll.jpg

Agregar texto a un bloque de su cuadrícula es incluso más fácil que agregar imágenes y hay varios tipos de fuentes para elegir, además de poder seleccionar el color de texto, alineación, justificación y todos los demás controles tipográficos que usted encontraría en su procesador de texto preferido.

Aprovechando esas sutiles variables de diseño información como fondo y colores de texto o alineación y tamaño de la fuente es posible crear algunos micro-diseños verdaderamente efectivos, los cuales pueden ser utilizado por un amplio número de útiles aplicaciones.



Más allá de lo impreso - los elementos dinámicos de Leafletter

Leafletter va un paso más allá del medio impreso , sin embargo, trayendo elementos dinámicos que hacen posible aplicar hiperenlaces sobre imágenes y texto y también ampliar y mostrar información sobre una determinada imagen.

En verdad, al seleccionar una imagen cuando se está creando un diseño Leafletter, una singular función proporciona la capacidad de agregar más profundidad de información a las mismas imágenes: se le da la opción de elegir entre dos tipos de imágenes - una imagen "estática" o una "trampolín".

springboard3_ll.jpg

Si usted elige tener un imagen estática, ésta se ubicará adecuadamente en el bloque de la grilla pero si usted opta por tener una imagen trampolín, la imagen utilizada tendrá un aspecto dinámico. Las imágenes trampolín tiene la capacidad de mostrar dinámicamente un icono de 'información' cada vez que usted desplace el cursor del ratón sobre el.

springboard1_ll.jpg

Más aún, haciendo clic en esas imágenes, cambiarán el tamaño para ocupar toda la configuración Leafletter y desplazando del ratón sobre el botón de 'información' debajo de cada una, mostrará más información basada en texto sobre la imagen en un cuadro de texto semitransparente.

springboard2_ll.jpg

Tal función le permite comunicarse a dos niveles posibles: uno más exclusivamente visual y uno más profundo, el cual aprovecha la ayuda de la información textual.

Un uso efectivo de dicha capacidad para Leafletter estaría también en el envío de presentaciones al estilo widget donde la información de texto adicional conectada con cada diapositiva puede ser visualizado bajo demanda haciendo zoom sobre la imagen, o en portfolios electrónicos personales, los cuales podrían beneficiarse enormemente de la simplicidad y efectividad de tal herramienta.

Para diseñadores de medios, por ejemplo, Leafletter brinda un imbatible instrumento de creación y publicación de portfolio, haciendo extremadamente fácil y efectivo proporcionar acceso al trabajo de diseño y publicación que usted ha creado. Esto ofrece el particular beneficio de poder acceder y mostrar su mejor trabajo en contexto, sin necesidad de enviar inmediatamente a sus lectores a otro sitio.

embed_ll.jpg

Sin embargo, si usted desea tener su micro-sitio hospedado, esta también es una opción,
ya que se le proporciona una dirección web única tan pronto como ha sido guardado.



No uno, sino muchos

Dado que los diseño resultantes pueden ser incrustados sin mayores dificultades en otro sitio web, Leafletter trabajaría bastante bien si sólo creara simples diseño de páginas. Tal como está, Leafletter también le da la opción de múltiples diseño de páginas. Estas pueden ser navegadas vía números exhibidos en la parte inferior de cualquier nuevo micro-sitio que usted cree. El resultado es un rápido esquema de navegación, con títulos pop-up que aparecen para cada página a medida que desplaza el cursor sobre la misma y esta capacidad adicional para crear rápidamente una serie de páginas interconectadas es absolutamente fabulosa.

pages_ll.jpg

Ya que nada es perfecto en la web y dado el hecho de Leafletter es un servicio completamente nuevo, tengo una ligera frustración respecto a su barra de navegación navegación, la cual podría haber sido hecho más intuitiva de usar.
Para desplazarse entre páginas usted tiene que hacer clic en el número uno y luego utilizar el ratón a izquierda o derecha para activar la próxima página en línea. Para mí hubiera sido mejor simplemente poder hacer clic en los números y mostrarlos en la parte inferior, de modo de tener una idea cuantas páginas hay. De esta manera hubiera sido relativamente sencillo que los usuarios salteen las páginas 2, 3,4 etc. debido a esta ligeramente inusual manera de navegación.



En conclusión

Leafletter es una herramienta muy útil y atraerá a aquellos que quieran mejorar el aspecto de sus conjuntos Flickr, como también a los que están buscando aplicaciones profesionales del tipo de portfolios electrónicos y catálogos de productos basados en web.

La facilidad con la que tales diseños de buen aspecto pueden ser producidos con Leafletter es impresionante y si bien el servicio no intenta ser de ninguna manera un reemplazo para la tradicional arquitectura de información y diseño de sitios web, los widgets de micro-contenido que puede crear tienen la posibilidad de ampliar positivamente su sitio blog o de noticias proveyendo la capacidad para mezclar de manera integrada conjuntos valiosos de imágenes navegables, diapositivas de presentación o imágenes de noticias directamente dentro de un contexto específico mayor.

Con una gran selección y cuadrículas de diseño predefinidas y edición mediante cliquear y arrastrar, Leafletter proporciona una forma completamente nuevo hay muy efectiva para enriquecer, profundizar y extender cualquier página web con el agregado de un navegador de texto de imagen incrustable, navegable y totalmente personalizable.

Con este, referencias a presentaciones de diapositivas online, portfolios electrónicos profesionales, folletos digitales como también informes de investigación y noticias de último momento pueden agregar una capa extra de información visual que no sólo enriquece la experiencia del usuario de múltiples formas, sino también que puede ser descubierto y navegado por el lector para saber más sobre los tópicos presentados de una forma totalmente interactivas personalizada.

Desde el lado de las contras, Leafletter todavía tiene camino para recorrer para hacer de esta simple herramienta y sus funciones aún más efectiva. Para uno, todas las imágenes en un leafletter deberían poder ser aumentadas con un zoom y el diseñador debería tener la libertad de decidir si exhibir una "i" transparente en aquella que contienen información extra. La navegación inferior cuando se usan múltiples páginas debería también ser más intuitiva como lo he mencionado antes en esta revisión.

El rendimiento quizá no sea aún el de una Ferrari, pero parecería ser que Leafletter ya está trabajando para mejorar esto.

La capacidad para seleccionar grupos arbitrarios de celdas en vez de celdas individuales sería un agregado bienvenido.

Poder integrar también miniaturas de páginas web, generadas bajo demanda especificando una URL o la subida e integración de otros formatos de archivo estándar, la posibilidad de opcionalmente agrandada imágenes específicas en una ventana flotante o la agregar pequeños clips de audio, también podría ser, desde mi punto de vista personal, útiles agregados y maneras efectivas para monetizar con prestaciones premium un servicio gratuito ya de por sí útil.



Lecturas complementarias

Si Leafletter ha sido de su agrado, quizás quiera visitar los siguientes sitios web:

 

Originalmente escrito por y publicado por primera vez en MasterNewMedia.

 

Robin Good y Michael Pick -
Si te gustó la nota puedes recibir actualizaciones suscribiéndote via RSS o via email.

O compartirla:
 
 
 
 
Comentar    
blog comments powered by Disqus
 


 

 

 

 

Creative Commons License
This work is licensed under a Creative Commons License.

 

6796


Curated by

Publisher MasterNewMedia.org - New media explorer - Communication designer
Web Analytics