Home

La idea es que la pagina principal sea como un cuadro, ahí va a aparecer el logo de la empresa y una especie de “exposición” de fotos que van a ser los iconos, estos van a ser las fotos que publiqué y van a estar opacos, cuando el cursor pase por arriba de cada uno de van a iluminar.

Algunas imagenes que voy a utilizar para mis botones

BOCETOS DE LA PAGINA

Estrella de la página Web

Resumen de la lectura

Resumen de la lectura
Navegación:
Uno de los factores que se debe tomar en cuenta es la transmisión de la información, proporcionando las claves necesarias, ofreciendo estructura y organización de la información.
Es importante incluir links que permitan al usuario ver en que pagina esta ubicado y que le permitan volver a la página anterior así como a las demás páginas. Esto se puede lograr a través de un menú que no estorbe la visibilidad de la pagina pero que sea fácil de ubicar.
Diseño del sitio:
Lo primero que se tiene que tener en cuenta es la información que es prioridad para el cliente.
Para organizar esta información de manera óptima se pueden seguir 5 pasos:
1. Dividir el contenido en unidades lógicas
2. Establecer jerarquía de importancia
3. Utilizar esta jerarquía para establecer vínculos entre unidades
4. Construir un sitio que siga de cerca la estructura de de información
5. Analizar el éxito funcional y estético del sistema
Estructura del sitio:
Para esta función se cuenta con técnicas de estructuración:
 Secuencias: va de lo general a lo especifico, se utiliza una secuencia logia y cronológica de la información.
 Retículas: se utiliza con frecuencia para listados de cosas universitarias, el usuario debe tener cierto conocimiento del tema expuesto.
 Jerarquías: Se organiza alrededor de la página principal que es “Home”
 Telaraña: En este sistema el usuario decide como va explorando el sitio.

 Componentes del sitio:
 Contamos con 13 componentes principales que son:
 Paginas principales: todas las demás páginas deben tener un enlace de acceso a ésta
 Página principal orientada: ofrece información más concreta y relevante
 Portada o pagina de bienvenida
 Retícula base para el diseño de la pagina, si te cansas puedes cambiarla.
 Menus y subwebs: sirven para organizar la información y guiar al usuario.
 Índices de materias: incluye palabras clave e información reducida sobre el contenido.
 Pagina novedades: te informan sobre las cosas recientes que se incluyen en la página para que no se vuelva obsoleta.
 Buscadores: sirven para encontrar información basados en palabras clave.
 Información del contacto: para obtener datos y retroalimentación de los usuarios y poder estar en contacto con ellos.
 Direcciones físicas
 Mapas: instrucciones para los clientes o usuarios sobre como navegar en la pagina
 Bibliografía y apéndices
 Paginas FAQ: incluyen las preguntas más frecuentes de los usuarios
 Paginas de error del servidor: explican al usuario cuando no se puede desplegar alguna página.
Diseño de internet y diseño de intranet
Básicamente para el diseño de internet se busca captar mediante cualquier herramienta la atención del usuario para que permanezca dentro mayor parte de tiempo posible. En el intranet la información es concisa y específica sobre algún tema, no se quiere que se distraiga el usuario ni que pierda tiempo.

Prototyping for Tiny Fingers

Se recomienda en la lectura llevar a cabo un prototipo de baja fidelidad, en el ejemplo de la lectura se llevo a cabo en un pizarrón pero recomiendan que si no cuenta con esos recursos lo puedes llevar a cabo en papel. La finalidad de este es darte cuenta de cómo puede funcionar tu página. Es muy sencillo, consiste en plasmar en papel la idea que se tiene de proceso tomando en cuenta diseño y funcionalidad y analizar cada elemento para así analizar l imagen y el mensaje final que se estará enviando a los usuarios de la página.
Una vez terminado el prototipo se recomienda probarlo con un grupo de gente que lo califique para así ir haciendo modificaciones hasta llegar al resultado final.
El autor quiere hacer énfasis en la importancia de la técnica de bocetear o de plasmar en papel las ideas que se pretenden poner en algún software, y que considera muy importante tener ideas claras. Tiene mucha razón en este punto ya que es más sencillo trabajar en papel hasta estar seguro de lo que se quiere y una vez que ya se probó y se tiene el resultado al que se quiere llegar comenzar a trabajar en el software y así no perder tiempo.
Un elemento que se utiliza después de tener un prototipo es el Tojan – meme, este es una prueba de tu prototipo y te permite tener retroalimentación de cómo va a funcionar y así puede ir haciendo modificaciones según nuevas ideas que vallan surgiendo o problemas que vallan presentando.
Se puede poner una estructura para llevar a cabo un prototipo Lo – FI , los pasos que propone el autor son:
Tener el material
Fijar un plazo
Construir modelos
Preparación de la prueba
Selección de usuarios potenciales
Realizar reporte con resumen de lo ocurrido en la prueba
Seleccionar ideas relevantes para mejorar el diseño.

Resumen de la lectura

Diseño Grafico
Resumen de Composición y Elementos básicos de la comunicación visual

Composición: los fundamentos sintácticos de la alfabetidad visual.
La composición se entiende como el paso más importante en la solución de problema visual. Es precisamente en esta etapa en la cual el comunicador tiene mayor control de su trabajo para poder expresar el estado de ánimo que desea par la obra. Se sabe que en este tema no existen reglas absolutas más bien se tiene comprensión de lo que puede ocurrir en términos de significado para obtener una organización y armonía de los medios visuales.
Percepción y comunicación visual.
Para confeccionar un mensaje visual se puede decir que creamos un diseño a partir de los elementos básicos que se explican mas adelante, el resultado de esta composición es la intención del artista. El siguiente paso es proceso de absorber la información del mensaje que resulta a través de los ojos. La interpretación que cada persona le da a este mensaje es la percepción. Hy que recalcar que el elemento más importante dentro de la experiencia visual es el carácter tonal, quedando los demás elementos como secundarios.
Se pueden percibir algunas variables dentro de la declaración visual las cuales consisten en hacer énfasis de algunos elementos a favor de otros y también la manipulación de esos elementos utilizando las técnicas de manera estratégica. Estas elecciones ayudan al artista a dar significado al mensaje visual.
Otra herramienta que ha sido de gran ayuda para estudiar la percepción es la psicología Gestalt.
Equilibrio.
Este factor es muy importante ya que el hombre tiene la necesidad humana de encontrar equilibrio. El hombre encuentra el equilibrio hasta en la forma de pararse en la que se para, es por esto que el constructo horizontal-vertical es la forma básica entre el hombre y su entorno.
Tensión.
Hay figuras como el círculo que no parecen tener estabilidad, es por eso que el hombre para suplir esa necesidad de equilibrio impone un eje vertical en el centro y una base horizontal y los utiliza como referencia a esto se le conoce como tención visual. Este es el medio que no sirve para crear un efecto que tenga potencial económico y directo en la transmisión de la información. También es importante tener en cuenta a al analizar los elementos que hay muchos otros aspectos sobre la misma que deberían ampliarse y que esta no es lo único que domina al ojo.
Nivelación y aguzamiento.
En un campo visual con forma rectangular la nivelación se lograría colocando un punto en el centro geométrico de un mapa estructural sobre este cuadro y esto nos ofrecería sorpresa visual, por otro lado el aguzamiento seria colocar el punto en un lugar excéntrico por ejemplo en la esquina derecha del cuadro. Cuando el punto no está claramente en el centro de la imagen ni en una esquina sucede lo que se conoce como una situación de ambigüedad.
Preferencia por el ángulo inferior izquierdo.
Entre las formas en las que la tención visual puede maximizarse esta en aprovechar el hecho de que el ojo favorece la zona inferior izquierda, esto se puede atribuir a la forma de leer occidental en la que vamos de derecha a izquierda.
Atracción y agrupamiento
Un punto aislado en un campo se relaciona con todo, cuando existen dos puntos significativamente separados luchan por atraer la atención y dan la impresión de que se repelen. Mientras más cercanos están los puntos se va creando la impresión de que se armonizan y por lo tanto se atraen y así se va agudizando el efecto mientras los puntos son más cercanos. Otro punto importante en este elemento es que los opuesto se repelen y los semejantes se atraen, entonces las personas tienden a unir con la vista formas iguales.
Positivo y negativo.
La significancia de este elemento se explica tomando en cuenta que hay elementos separados que están unificados en los acontecimientos visuales. Un ejemplo claro de esto sería la introducción de un punto dentro de un cuadrado, el punto absorbe la atención alejándola del cuadro, a esta situación se le denomina significancia de lo positivo y lo negativo. Un buen ejemplo que todo conocemos de lo anterior es el símbolo conocido como el YING-YANG.
Elementos básicos de la comunicación visual.
Los elementos básicos de la comunicación visual son: punto, línea, contorno, dirección, tono, color, textura, dimensión, escala y movimiento. Estos elementos son l materia prima de la comunicación visual que está formada por selecciones y combinaciones selectivas.

Como se mencionó antes La psicología Gestalt ayuda a interpretar los elementos básicos y la combinación de estos. Su base teórica se apoya para comprender y analizar los elementos en verlos como un sistema de partes que interactúan pero que se pueden observar con completa independencia para luego recomponerse en un todo.
Para poder comprender la estructura del lenguaje visual primero que nada debemos conocer los elementos visuales.
El punto.
Es la unidad más simple, por lo tanto es la más pequeña de la comunicación visual. La utilidad del mismo además de ser la base es que sirve como referencia o como un marcador del espacio. La capacidad única de los puntos para guiar la mirada se hace más fuerte cuando estos se aproximan más.
La línea.
Se forma cuando los puntos están tan cercanos entre si que no se pueden distinguir individualmente, también se llega a definir como un punto en movimiento. La línea es precisa y siempre tiene una dirección y un propósito, nunca es estática y es el elemento visual principal para los bocetos.
Otra característica importante de este elemento es que es el instrumento que se utiliza para la escritura y de todo el sistema que forma la estructura visual es el más esencial.
El contorno
La línea describe el contorno y articula su complejidad. Los contornos básicos son el cuadrado, el triangulo y el circulo. Estas son figuras planas y simples de fácil descripción y construcción.
La dirección
Existen tres direcciones básicas que son expresadas por los contornos, estas son: horizontal y vertical, diagonal y curva.
La horizontal y vertical son las más importantes ya que sirven como referencia como ya lo mencionamos si no que facilita el equilibrio no solo del hombre si no de todas las cosas que se construyen y diseñan.
La diagonal es la más provocadora y la curva remite a la repetición y el calor.
Tono
Los bordes en que se usa la línea aparecen en diferentes intensidades de oscuridad o claridad del objeto visto, a esto se le llama tono. Las variaciones de luz son el medio mediante el cual distinguimos de manera visual la información del entorno. Dentro del grafismo, la pintura, la fotografía y el cine la tonalidad es una clase de pigmento o pintura que se utiliza para simular un tono natural. Esta es una herramienta útil para expresar dimensión.
Color
Este componente tiene una relación intensa con las emociones y es necesario para la creación del mensaje visual. Existen mucha teorías sobre el color sin embargo no existe un sistema unificado y definitivo de las relaciones de los colores.
El color cuenta con tres dimensiones:
El matiz, existen tres matices primarios que son amarillo, rojo y azul.
La dimensión, se refiere a la pureza de un color con respecto al gris.
La acromática, se refiera al brillo.

Cundo elegimos un color estamos expresando muchas cosas ya que este es la parte más emotiva y tiene una gran fuerza para expresar y reforzar l información visual.
Textura
Este elemento visual sirve de doble de las cualidades del sentido del tacto, es decir que podemos reconocerla bien sea con el sentido de la vista o del tacto. Se relaciona a través de variaciones diminutas en la superficie del material y sirve como ayudante de la experiencia sensitiva.
Escala
Los elementos visuales tienen la capacidad de modificarte y definirse los unos a los otros. Partiendo de esto podemos concluir que no existe lo grande sin lo pequeño. Una aplicación de esta en la comunicación visual es que se puede usar en planos y mapas para representar una medición proporcional real. Existen muchos sistemas para establecer escalas.
Esta herramienta nos puede ayudar hacer que una habitación muy grande parezca pequeña, es decir nos sirve para hacer manipulaciones del espacio a través de ilusión.
Dimensión
Se define como la representación volumétrica de formas visuales bidimensionales, esta existe en el mundo real, cuando se usa en dibujos, pinturas, fotografías o películas existe un volumen real más bien este es implícito.
Movimiento
Este es una de las fuerzas visuales predominantes de la experiencia humana, en la comunicación visual se pueden usar técnicas capaces de engañar al ojo como la ilusión de la textura y la dimensión. El medio visual que más se aproxima a este elemento es el cinematográfico.

Todos los elementos antes mencionados tienen la capacidad de transmitir información de manera fácil y directa.