jueves, 3 de marzo de 2011

¿Que es el Diseño visual?

El diseño visual o diseño en comunicación visual es una disciplina profesional que estudia los sistemas de información, con el objeto de convertir los datos en formas visuales, teniendo en cuenta los procesos perceptivos. Consiste en la creación de imágenes funcionales con fines netamente comunicacionales, para esto se hace uso de las nuevas tecnologías para un desarrollo más estructurado.
Diseño Visual es una denominación profesional del diseño que analiza y transforma datos en estructuras visuales mediante el conocimiento de procesos perceptivos (ciencia de la visión) y cognitivos, el reconocimiento de los contextos socioculturales para su planificación en los dispositivos y soportes de la imagen, con el fin de generar sistemas de información que interactúan con la comunidad y sus referentes significacionales, a través de los procesos comunicativos.
Desde esta perspectiva, el Diseño Visual coordina, gestiona y administra sistemas de información visual, categoriza las variables visuales, investiga los procesos cognitivos, evalúa las metodologías del diseño, determina la pertinencia de los soportes de la imagen de acuerdo a la naturaleza de la información para la ejecución general de un proyecto de diseño.


Alcances del Diseño Visual

Sus alcances se ven reflejados en el medio productivo a través de la gestión, coordinación y administración de sistemas de información y comunicación, encaminados a la construcción de productos visuales.
- El Diseño Visual incide en el sistema de producción por medio de la categorización y la estructuración de la forma visual.
- El Diseño Visual mejora la calidad visual del ambiente, por medio de la ecoeficiencia en la realización de productos visuales.
- El Diseño Visual aporta a la sociedad mediante la generación de estructuras visuales que acercan al individuo al conocimiento.
- El Diseño Visual aporta al sistema cultural fomentando valores de identidad y equilibrio, ya que facilita el reconocimiento de los individuos de sus contextos geográficos particulares, a la vez que garantiza su acceso al caudal de saberes producidos universalmente.
- Diseño Visual interviene en el campo de la investigación y su relación con la comunicación visual al profundizar en las estructuras visuales y su relación con las teorías cognitivas de la percepción y el aprendizaje.




estructuras de las páginas.

La gran mayoría de las páginas web tienen divisiones o secciones similares. Lo usual es que, en la parte superior de la página se encuentre un encabezado, seguido de un cuerpo principal que suele estar flanqueado por una columna lateral (tanto a la izquierda como a la derecha) o dos columnas laterales, seguidas al final de la página por un pie de página. La imagen siguiente es un esquema típico de una página web. Se debe tener en cuenta que este esquema sufre variaciones, aunque normalmente son pequeñas.
Normalmente se proporciona una estructura con una cabecera principal donde se refleja una imagen relacionada con la empresa y donde puede aparecer el logotipo y todo lo relacionado con la identidad de la empresa. El diseño seguirá las líneas generales de los bocetos previamente vistos y seleccionados.



A un lado de la página, generalmente el izquierdo, aparecerá el Menú Principal que mostrará las secciones que se vayan creando en el panel de control pudiendo crear hasta un número infinito de éstas.
Después de la cabecera de la web y siguiendo el eje horizontal puede aparecer el Menú General que mostrará secciones que previamente se hayan dado de alta en el Menú Principal para que aparezcan como destacadas aquí. El número de estas secciones que pueden aparecer debe ser acordado para la preparación de su utilización por la programación de Lmental y será de un número determinado. Es posible modificar las secciones que aparecen destacadas en este menú, entrando en él desde el panel de control, seleccionando secciones, Generales y seleccionando las secciones que quiere que aparezcan como destacadas de entre las que se muestran que son todas las creadas previamente en el Menú Principal.

También se puede contar con un Menú Destacadas que generalmente aparecerá en el lado derecho de la web, y en el que se podrán añadir un número infinito de secciones destinadas a la publicidad de empresas afines que se promocionen o afilien y que proporcionan un código javascript o HTML para ser incorporado a la programación del website. La forma de colocar dicha programación y ordenar la posición de estas empresas es seleccionando secciones / Destacadas, en el panel de control apareciendo en pantalla el lugar para poner el título que se quiere mostrar y el lugar donde ingresar el código proporcionado por la empresa. Al tener varias implementadas se puede modificar el orden de aparición desde el panel de control utilizando los botones subir/bajar la empresa seleccionada para alterar su orden.
En el panel de control junto a la página principal aparecen las páginas Aviso Legal y Política de Privacidad, secciones de tipo página que se puede elegir en la construcción del diseño de la web donde se quieren mostrar y en ellas se colocarán los datos referidos a estos temas sobre la empresa.

Bocetos de diseño.

Para que la idea sobre un sitio web se materialice en un diseño hay un paso imprescindible: bocetar. El boceto, layout, o mock up es una representación visual simplificada de los elementos visuales que contendrá la página o sistema web y tiene dos objetivos bien definidos:
  • Ser el punto de partida para discutir ideas en proyectos grupales.
  • Mostrarle al cliente de forma aproximada qué elementos verá en la página web.
Tradicionalmente el primer boceto de una página suele hacerse a mano, pero con clientes y colaboradores distribuidos en todo el mundo la manera más efectiva de llevar adelante un proceso de diseño es digitalizar la maqueta y crear un prototipo de lo que contendrán las páginas web. Algo más o menos como esto:


Un prototipo de una página web muestra de forma organizada todos los elementos que posibilitan la interacción del usuario con la aplicación y su distribución. Como dice Dan Harrelson  de Adaptative Path, el prototipo nos permite articular la funcionalidad con las sensaciones que trasmite un diseño. Debe reunir tres características:
  • Ser rápido, para plasmar las ideas tan pronto como sea posible.
  • Ser desechable, porque será discutido, revisado y rehecho varias veces.
  • Ser específico, para solucionar aquellos aspectos complejos de la interacción.

Borradores de página

Borradores de Página
Una vez que se ha aprobado la etapa anterior, se toman los bocetos de diseño que hayan sido aprobados y se genera un prototipo (páginas clickeables) mediante el cual se pueda comprobar directamente la forma en que se desempeñan, cuando se les aplica la tecnología HTML de construcción de páginas web.
La intención de esta etapa es usar el diseño de pantalla que se ha creado, contando con enlaces reales que permitan ver la forma de usar sus atributos (cada enlace tiene los estados de Enlace, Flotante, Activo y Visitado) y revisar la forma en que se despliegan las páginas que se van a desarrollar.
Adicionalmente, en esta etapa será posible hacer la comprobación efectiva del peso de las páginas una vez construidas y se podrán optimizar los elementos que queden fuera de norma por peso o tamaño.


Maqueta Web.

Es la etapa final de la creación de tu pagina y consiste en generar todo el sitio en tecnología HTML utilizando imágenes y contenidos reales.
En el caso de un sitio estático, esta etapa corresponderá a la construcción del sitio. En el caso de un sitio dinámico, las páginas que se generen permitirán que el diseñador genere las plantillas de trabajo y el desarrollador de software las utilice como elementos para introducir la programación que sea necesaria para la creación del sitio.
Es importante considerar que todas las tareas y actividades incluidas en esta etapa pueden ser abordadas por un diseñador que tenga experiencia en diseño web. Esto debe ser parte de los requerimientos solicitados a las empresas proveedoras de este tipo de servicios.

algunos programas útiles para hacer maquetas web son:
 Adobe fireworks que lo puedes descargar gratis de aqui:
también Adobe Photoshop descargarlo aquí:
y por ultimo el mejor dreamweaver descargalo: