Plantillas para empaques descargables y gratis!
0




Blog sobre diseño. Recursos, artículos y algunos tutoriales.
0




0
0
0
Una creencia errónea es que, al crear el contenido de un sitio web, bastará con copiar la información que se tiene en folletos y documentos institucionales. Esto se hace cuando se parte de dos premisas equivocadas: (a) el texto de un material impreso se puede presentar y leer de la misma forma en una pantalla y (b) la gente lee lo que es importante para la organización dueña del sitio.
Para el primer punto, ergonómicamente es mucho más cansado leer pixels en una pantalla que texto en un papel. (CBASSE, 1983) Por ello, cuando el usuario está leyendo un artículo largo que le resulta interesante, muchas veces lo imprimirá para continuar leyendo de un papel. Para la segunda premisa, la gente no lee lo que es importante para la organización. Piense en los últimos tres sitios que haya visitado. ¿Leyó toda la información de la página? Por supuesto que no. Cada usuario lee únicamente lo que es importante para él. Por ello es tan relevante conocer qué buscan los usuarios que visitan el sitio.
Diseño de Información
Para tener un sitio amigable y funcional, debemos diseñar la información del mismo. Esto es el mismo principio que rige al diseño gráfico en general; debe de tenerse en mente el objetivo antes de comenzar a diseñar, o en este caso, redactar. De acuerdo con Nathan Shedroff (2008), el diseño de información “es un campo y un enfoque que intenta diseñar comunicaciones claras y entendibles mediante el cuidado de la estructura, el contexto y la presentación de los datos y la información”.
Deben cuidarse 4 aspectos:
• ¿Qué? El tema central o propósito de la página debe ser lo más claro posible.
• ¿Quién? Reclamar la propiedad de una página es básico.
• ¿Dónde? Nunca olvidar la naturaleza internacional del medio.
• ¿Cuándo? Indicar la fecha de publicación, las páginas envejecen.
Un ejemplo muy sencillo sería la publicación de una página que hable sobre índices de deforestación de bosques de coníferas. Lo primero que debe quedar claro es por qué se publica esta información. ¿Está diseñado para centros de investigación o para concienciar a niños de escuelas primarias sobre la importancia del tema? El lenguaje empleado y los resultados presentados variarán mucho en base a mi audiencia. En segundo lugar, ¿quién publica esta información? No tendrá la misma credibilidad si lo publica la SEMARNAT, Green Peace o una asociación regional de madereros. En tercer lugar debe especificar dónde se genera esta información. ¿Se está hablando de los bosques de Querétaro, de México o del mundo? Por último, saber de cuándo son estas cifras. Si son de hace 2 años, ya cambiaron.
Simplificar los textos
El lenguaje debe simplificarse lo más posible, eliminando adjetivos, juicios de valor, y ambigüedades. Hay que dar un tono positivo al mensaje. Se recomienda dar información completa, en forma amigable y sin tecnicismos. Esto último es especialmente importante para los mensajes de error.
Simplificar las ligas
Cuando agregamos ligas, debe especificarse qué contienen para que el usuario decida si quiere accederla o no. Conviene incluir referencias a otras páginas del sitio, para facilitar la navegación del usuario. Cuando se trate de descargar un documento, conviene especificar tamaño y formato.
Redacción de pirámide invertida
Cuando sea posible, se recomienda utilizar la técnica de la pirámide invertida, escribiendo la idea principal y luego sustentando y agregando detalles. De esta forma, si el usuario no termina de leer, habrá captado la idea principal. No es el mejor estilo para un libro o una historia, pero enfoca la atención a la información más relevante.
Blanca Nieves se casó con su príncipe azul tras escapar de numerosos peligros, incluyendo un cazador asesino y una manzana envenenada. (Woodtke, 2002, p.16) Busque más información sobre el príncipe, los 7 enanos, la madrastra, la manzana envenenada y el espejo mágico.
Redactar para buscadores
Otro punto importante de un sitio web es redactar para que los buscadores puedan encontrar fácilmente mi contenido. Se les puede indicar qué información existe y cada cuando tiempo se actualiza. Entre los expertos de diseño de sitios web, se conoce como mejorar la buscabilidad (findability). Es importante recordar que los textos embebidos en imágenes no podrán ser localizados por los buscadores.
Bibliografía
Jeney, C. (2006) Writing for the Web: A Practical Guide (1a ed.) USA: Prentice Hall
Price, J. Price, L. (2002) Hot Text. USA: New Riders
Shedroff, N. Diller, S. Rhea D. (2008) Making Meaning: How Successful Businesses Deliver Meaningful Customer Experiences (1a ed). USA: New Riders Press
Woodtke, Christina (2002). Information architecture. USA: New Riders Press
Referencias Web
2
ArteEl arte oculta. El arte tiene un significado y lo esconde a propósito. El arte entrega un mensaje y lo esconde a propósito. Es un arte el crear arte. El arte es inutilizable por definición.DiseñoEl diseño revela. El diseño revela el significado, un mensaje, una función. El mal diseño hace lo contrario: lo obscurece y lo oculta.
0

0
0

0
Los avances a los que hemos llegado hoy en día con sistemas como Mac OS X Leopard o KDE son realmente saltos astronómicos en materia de eficiencia, usabilidad y por supuesto, uno de nuestros temas predilectos, estética.
En este post, haremos una adaptación del articulo de WebDesigner Depot al castellano, revisando la evolución en el diseño de las GUI, para saber como pudimos pasar de esto:
Fuente: toastytech.com
A esto:
Fuente: Flickr.
La primera imagen de este Post, es la primera GUI desarrollada en la historia. Sus creadores fueron los estudiosos chicos del Centro de investigación Xerox en Palo Alto (PARC) en los años 70. La primera PC en utilizar esta interfaz fue la famosa Xerox Alto, desarrollada en 1973. Sin embargo, este fue un producto dirigido al ámbito investigativo, por tanto nunca fue lanzado al mercado.
El primer sistema descrito como una computadora de escritorio totalmente integrada, incluyendo aplicaciones y GUI. También fue conocida como la “Xerox Star”, después renombrada como “Viewpoint”, y después renombrada una vez mas como “GlobalView”.
Fuente: toastytech.com
También conocido como Lisa OS, que en este caso no es abreviatura de “Operative System” sino de “Office System”. Desarrollado por Apple con la intención de ser una estación de procesamiento de documentos.
Sin embargo este sistema no duró lo suficiente, ya que el sistema operativo de Apple era mas barato. La versión se desarrolló hasta Lisa OS, Lisa OS 2 en el 83 y Lisa OS 7/7 3.1 en el 84.
Fuente: GUIdebook
Fue la primer GUI de escritorio desarrollada para la PC IBM. El sistema estaba dirigido a grandes corporaciones, por tanto su precio era casi inasequible para el usuario promedio de aquella época. El sistema hizo uso del mouse (innovador para su tiempo) y tenía incluido un sistema de instalación y ayuda, mas no poseía iconos.
Fuente: toastytech.com
El sistema 1.0 fue el primer sistema operativo GUI creado para Macintosh. Tenía varias de las características de los sistemas operativos actuales, como las ventanas y los iconos. Las ventanas podían ser movidas con el mouse, lo cual pudo haber dejado descrestado a mas de algún parroquiano de la época, al igual que el sistema de copiar y pegar carpetas moviéndolas de ventana en ventana, definitivamente como pa volverse loco.
Fuente: toastytech.com
Oh si! bienvenidos al horroroso mundo de los desktops del año 85… a color. Amiga estuvo desde un principio mas allá de su época, comenzando por añadir el color a su GUI (solo 4, Negro,Azul,Naranja y Blanco) además de facultades multitasking, sonido estéreo (blow my ears) e iconos multiestado (seleccionados y deseleccionados). Miren ese reloj, que mono!
Fuente: GUIdebook
Windows 1.0x (1985)
Primogénito bastardo (con GUI) de una tiranía que subyugaría al mundo de la informática durante al menos otros 25 años ( y sigue contando) Oh, la humanidad!.
Primer sistema operativo basado en una GUI, padre gráfico de la mayor parte de cosas que manejamos hoy en día, con brillantes y rimbombante iconos a una lujosa resolución de 32×32 y gráficos a color, si señor, si yo fuese un geek del 85 estaría babeando sobre mi teclado. Oh y miren! otro reloj análogo! que mono! sin embargo este reloj fue retirado luego, comenzando así la mítica carrera de disparos en el pie de Microsoft.
Fuente : makowski-berlin.de
GEM (Administrador de entrono gráfico) fue una GUI con estilo “Ventanero” creado por Digital Research, Inc. Inicialmente creado para sistemas operativos que trabajaran bajo los procesadores Intel 8088 y Motorola 68000 (nuestros procesadores contemporáneos tienen nombre muy decentes, a Dios gracias) para luego ser desarrollado para correr bajo DOS también.
Fuente:: Wikipedia
El sistema operativo de 64-bit creado para UNIX. Compatible con iconos vectorizados, característica que venia incluida en la GUI años antes de que Mac OS X fuera creado.
Fuente:: osnews.com
El GEOS (sistema operativo de entrono gráfico) fue desarrollado por Berkeley Softworks. Diseñado originalmente para la Commodore 64 (mítica)incluia un procesador de palabras gráfico, llamado geoWrite y un programa de dibujo llamado geoPaint.
Fuente:Wikipedia
La segunda versión del popular sistema operativo traía como novedad un nuevo manejo de las ventanas, haciendo que el usuario pudiese modificar el tamaño y aspecto de estas:
Fuente: guidebookgallery.org
Fue inicialmente desarrollado en conjunto por IBM y Microsoft, sin embargo las dos compañías tuvieron una ruptura comercial en 1991, haciendo que Windows utilizara esta tecnología en su propia GUI e IBM siguiera desarrollando el OS/2. La interfaz de este sistema operativo fue bautizada como “administrador de presentación”. Este sistema solo usaba iconos monocromáticos.
Fuente: pages.prodigy.net
Un entonces bien alimentado y con pelo Steve Jobs salió con la idea de crear la mejor computadora de investigación para universidades especializadas en ciencias de la computación y laboratorios. Esta idea se convirtió en una StartUp llamada NeXT Computer Inc.
La primera computadora de esta compañía fue lanzada en el 88, sin embargo se avanzo bastante con el lanzamiento de NeXTSTEP 1.0 GUI en el 89, la cual evolucionó luego en OPENSTEP. Si, la verdad es un poco complicado.
Con iconos a 48×48 y mas colores disponibles, esta GUI se convirtió en el embrión de lo que serían las GUI en los años a venir, al menos hablando del apartado estético de estas.
Fuente: kernelthread.com
Pequeñas mejoras con respecto a su anterior versión, pero en varias áreas. Ventanas mas suaves, mayor movilidad de los iconos, realmente poco digno.
Fuente: pages.prodigy.net
Quien escribe este post siente nostalgia, ya que el primer sistema operativo que manejó con propiedad fue este, en una “portátil” IBM de casi 1 tonelada de peso. En esta versión, Microsoft explotó a fondo el potencial de las GUI, empezando a mejorarlas de forma significante.
El sistema operativo hacía uso de mas de 640KB de memoria y espacio en el disco duro, lo cual permitía una mayor resolución en pantalla y por supuesto mejores gráficas, como Super VGA 800×600 (Nostalgia) y 1024×768.
Microsoft contrató a la diseñadora Susan Kare para que hiciera los iconos de esta versión e ideara un diseño unificado para la interfaz.
Fuente:: toastytech.com
Muchas fueron las mejoras de esta versión de GUI. El esquema de colores fue cambiado y fue incluido el estilo 3D. El escritorio podía ser dividido de modo vertical en pantallas de distintas resoluciones y profundidad de color, lo cual hoy día se ve un poco raro. La resolución por defecto era de 640×256, sin embargo el Hardware soportaba resoluciones aun mayores.
Fuente:: guidebookgallery.org
La versión 7.0 de MAC OS fue la primera de su tipo en ser compatible con el uso de los colores. Sombras de gris, azul y amarillo fueron añadidas a los iconos.
Fuente:: guidebookgallery.org
Esta versión de Windows incluía fuentes TrueType, las cuales ya venían preinstaladas. Esto hizo de Windows una plataforma para publicación realmente funcional, por primera vez en su historia.
Antes, solo era posible lograr esta funcionalidad mediante el uso del Adobe Type Manager el sistema de fuentes de Adobe. Esta versión también incluía un sistema de color llamado (favor no hacer click si sufren de epilepsia o tiene graves problemas soportando el mal gusto) Hotdog Stand, el cual usaba brillantes tonos de rojo, amarillo y negro.
Este sistema fue ideado para ayudar a personas con cierto grado de ceguera de color a ver los gráficos con un poco mas de facilidad.
Fuente: Wikipedia
Esta fue la primera GUI que fue sujeto de aceptación internacional, así como pruebas de accesibilidad y usabilidad. Toda la GUI fue desarrollada usando diseño dirigido a los objetos. Cada archivo y folder era un objeto que podía interactuar y ser asociado con otros archivos, carpetas y aplicaciones. También tenía la funcionalidad de “Drag and Drop”.
Fuente: toastytech.com
Con una interfaz totalmente rediseñada, se añadió el clásico botón “X” en cada ventana para cerrarla. El equipo de diseño le brindó características de estado (activado, desactivado, seleccionado, etc) a los iconos y otras gráficas. El botón “inicio” aparece por primera vez. Un gran paso a nivel gráfico, independientemente de la calidad del sistema operativo.
Fuente: : guidebookgallery.org
Lanzado por IBM, este cambio le dio un renovado aspecto visual al área de trabajo. Los iconos fueron ubicados en el escritorio, donde archivos personalizados y carpetas también podían ser creados. Tenía un lugar donde enviar los archivos eliminados como la papelera de Windows y MAC OS, sin embargo esta no almacenaba copias para recuperar los archivos.
Fuente: : toastytech.com
256 iconos a color por defecto en esta versión de la GUI. Mac OS 8 fue uno de los primeros sistemas que adoptaron iconos isométricos, también llamados pseudo-3D. El tema gris platino se volvió un clásico constante en las futuras GUI.
Fuente: guidebookgallery.org
Windows 98 (1998)
Los mismos iconos de la versión 95., pero la GUI podía usar mas de 256 colores para renderización. El Explorer cambió por completo y el cansino Active Desktop aparece por primera vez.
Fuente: toastytech.com
En un principio, el equipo desarrollador de esta GUI describe a KDE como “Un entorno de Escritorio contemporáneo para estaciones de trabajo Unix. KDE llena la necesidad de un escritorio amigable para estaciones de trabajo Unix, similar a los escritorios de MacOSX o Windows” Este sistemas es, personalizable como pocos, lo cual le ha hecho ganar bastante adeptos con conocimiento avanzado en sus siguientes versiones.
Fuente: Wikipedia
Este sistema operativo fue desarrollado para computadoras personales. originalmente escrito en 1991 para correr en Hardware Bebox. Fue después mejorado para tomar ventaja de las nuevas tecnologías. La GUI de BeOS fue desarrollada bajo los principios de diseño claro y limpio.
Fuente: Wikipedia
Muy orgullosos se deben sentir los Mexicanos al saber que los padres de este genial proyecto fueron Miguel de Icaza y Federico Mena. GNOME Viene de GNU Network Object Model Environment, inicialmente desarrollado para RedHat Linux, aunque después fue desarrollada para otras distros.
Fuente: visionfutur.com
A inicios del año 2000, Apple anunciaba su nueva interfaz Aqua, y en 2001 la compañía lanzaba su nuevo sistema operativo. Con nuevos iconos de 128×128 Anti-aliasing y semi-transparentes. Mucha crítica negativa le cayó encima a esta GUI, aparentemente la gente no estaba lista para cambios tan grandes, sin embargo con el tiempo la gente se adaptó al estilo y hoy día este sigue siendo la base de todos los OS X.
Fuente: guidebookgallery.org
Como en las anteriores actualizaciones de Microsoft, este sistema operativo fue un cambio radical en la GUI. Con la opción de cambiar de Skin a la GUI, los usuarios podían manipular a gusto el aspecto de esta. Iconos de 48×48 (vamos, es Microsoft) por defecto renderizados en millones de colores.
Fuente: guidebookgallery.org
Desde su versión 1.0 el escritorio mejoró cantidades. Con gráficos mejorados e iconos, redefinieron la experiencia del usuario promedio de este OS.
Fuente: netbsd.org
Uno de los fracasos mas certeros en la historia de Microsoft, mas sin embargo un gran avance en la GUI. Bastante animación en 3D, transparencia con Aero, y una barra lateral con Widgets. Y miren! los relojes analógicos vuelven!
Fuente: technology.berkeley.edu
Dulce para los ojos, tan bonito que dan ganas de lamerlo (WTF). Este OS de sexta generación, mejoró muchísimo la interfaz de usuario. Básicamente sigue siendo Aqua pero con barras para scroll y el clásico gris platino renovado, ahora con mas azul. La GUI tiene ahora un toque mas 3D, con un dock con iconos interactivos y animados.
Fuente: : skattertech.com
Los chicos de GNOME pusieron bastante esfuerzo en crear temas y arte en la versión 2.24, ya que su meta es hacer “Que tun computadora luzca bien”. Organizaron una competencia para encontrar los mejores fondos para escritorio que sus usuarios pudieran crear.
Fuente: gnome.org
La versión 4 de este desktop trajo muchas mejoras, como manejo de ventanas suave pero animado, y siguiendo la tendencia de Microsoft incluyeron Widgets (con relojes analógicos, por supuesto). El tamaño de los iconos es ajustable, y los elementos de diseño son mas fáciles de configurar al gusto. Nuevos sonidos, temas e iconos fotorealistas. Ahora también puede correr bajo plataformas Windows y Mac OS X.
Fuente: Wikipedia
Visto en Isopixel.
*También pueden ver este artículo sobre la historia de las GUI en Ars Technica.
(c) 2008 MyDesignTools . Design by Free CSS Templates. Blogger Template by Blogger FAQs and Mobi123.