Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • 39 vistas

    6 Novice Guide To Visual Design

    Cargado por

    Luis Felipe Escobar Salas
    Los elementos básicos del diseño visual como punto, línea, forma, color y tipografía deben funcionar en conjunto. La creación de un buen diseño comienza con la comprensión de conceptos básicos como los principios de diseño de unidad, jerarquía, equilibrio y contraste. La psicología de la Gestalt estudia cómo percibimos objetos y diferenciamos figura de fondo a través de leyes como la similitud y proximidad.

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd

    6 Novice Guide To Visual Design

    Cargado por

    Luis Felipe Escobar Salas
    39 vistas7 páginas
    Los elementos básicos del diseño visual como punto, línea, forma, color y tipografía deben funcionar en conjunto. La creación de un buen diseño comienza con la comprensión de conceptos básicos como los principios de diseño de unidad, jerarquía, equilibrio y contraste. La psicología de la Gestalt estudia cómo percibimos objetos y diferenciamos figura de fondo a través de leyes como la similitud y proximidad.

    Título original

    6 Novice Guide to Visual Design

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    DOCX, PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Los elementos básicos del diseño visual como punto, línea, forma, color y tipografía deben funcionar en conjunto. La creación de un buen diseño comienza con la comprensión de conceptos básicos como los principios de diseño de unidad, jerarquía, equilibrio y contraste. La psicología de la Gestalt estudia cómo percibimos objetos y diferenciamos figura de fondo a través de leyes como la similitud y proximidad.

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Descargar como docx, pdf o txt
    39 vistas7 páginas

    6 Novice Guide To Visual Design

    Cargado por

    Luis Felipe Escobar Salas
    Los elementos básicos del diseño visual como punto, línea, forma, color y tipografía deben funcionar en conjunto. La creación de un buen diseño comienza con la comprensión de conceptos básicos como los principios de diseño de unidad, jerarquía, equilibrio y contraste. La psicología de la Gestalt estudia cómo percibimos objetos y diferenciamos figura de fondo a través de leyes como la similitud y proximidad.

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Descargar como docx, pdf o txt
    Está en la página 1de 7

    Novice Guide to Visual Design

    Guía para principiantes de diseño visual

    Resumen Curso: Novice Guide to Visual Design


    Punto, línea forma color textura tipografía, formulario, cuadricula, diseño. Son elementos
    básicos del diseño Visual, la creación de un buen diseño comienza con la comprensión de los
    conceptos básicos.
    Unidad, Espacio, Jerarquía, Equilibrio, Contraste, Escala, Dominio, Semejanza, Proximidad y
    Alineación. Son Principios de diseño, al aplicar principios de diseño, no solo le permitirá comunicar
    la personalidad de la marca a sus usuarios objetivo, sino que también le ayudará a evitar desastres
    de diseño
    Psicología de la Gestalt: se ocupa del estudio de cómo percibimos los objetos de nuestro
    entorno. Discute principalmente la diferencia entre espacios positivos y negativos y examina cómo
    varias leyes nos ayudan a diferenciar figura y fondo. (Leyes: Similarity, proximity, familiarity,
    symmetry, continuity, common fate, synchrony, common region, element connectedness & The
    principle of closure)
    ¿Como las personas leen una Página Web?
    Una página tendrá áreas activas y pasivas. Los estudios de seguimiento ocular revelan que cuando
    los usuarios leen una página, sus ojos escanean el contenido de la esquina superior izquierda.

    En los sitios web con mucho texto, como los blogs, el lector primero escanea verticalmente el lado
    izquierdo del texto en busca de palabras clave o puntos de interés en las oraciones iniciales del
    párrafo. En el momento en que el lector encuentra algo que le gusta, comienza a leer
    normalmente, formando las líneas horizontales. El resultado final es que el patrón se parece a las
    letras F o E y se llama como F-Pattern.
    Z-Paterno el escaneo se realiza en sitios web que no tienen mucho texto. Cuando el ojo llega al
    final de la línea, se mueve en diagonal hacia abajo a la izquierda (nuevamente según el hábito de
    lectura) y repite un escaneo horizontal en la parte inferior de la página. El patrón Z es perfecto
    para interfaces simples, minimalistas y centradas en botones de llamada a la acción.
    Gutenberg Diagram muestra el comportamiento del usuario de la lectura-gravedad. Divide el área
    de diseño visual en cuatro. Área óptica primaria Fuerte, área de barbecho, Área de barbecho
    débil, Área terminal.
    Según Fitts’ law, la cantidad de tiempo necesaria para que una persona mueva un puntero (por
    ejemplo, el cursor del ratón) a un área objetivo es una función de la relación de la distancia al
    objetivo dividida por el tamaño del objetivo. Por lo tanto, cuanto mayor sea la distancia y menor el
    tamaño del objetivo, más tardará el usuario en alcanzarlo.
    Introducción
    La creación de un buen diseño comienza con la comprensión de los conceptos
    básicos. Al aplicar principios de diseño, no solo le permitirá comunicar la
    personalidad de la marca a sus usuarios objetivo, sino que también le ayudará a
    evitar desastres de diseño.

    Elementos de diseño visual


    Los siguientes elementos tienen una importancia primordial en el diseño y deben funcionar en
    conjunto.

     Puntos : dot es el elemento de diseño más simple; marca una posición en el


    espacio. Es el lugar de encuentro de dos coordenadas en 2 dimensiones o tres
    coordenadas en 3 dimensiones.

     Líneas:  line se forma si conecta dos puntos. Está formado por una colección de
    puntos, Una línea puede ser gruesa, delgada, ondulada o irregular.

     Formas: Si pones cuatro puntos y los conectas con cuatro líneas, obtienes
    un shape. Una forma es básicamente un área bidimensional con un límite conocido.
    Son los componentes básicos del diseño gráfico. Son figuras y formas que se utilizan
    para crear logotipos, ilustraciones y otros innumerables elementos que aparecen en
    el diseño. Hay 3 tipos de formas:
    Geometric: Formas como círculos, cuadrados, rectángulos y triángulos.
    Organic: Formas que se asemejan a formas u objetos naturales que se
    encuentran en la naturaleza: hojas, flores, etc.
    Abstract: Las formas abstractas son aquellas que no pueden relacionarse
    con la realidad. Estas son formas de forma libre como formas de burbujas,
    espirales, etc.

     Color: Color es un elemento importante en el diseño y estos se utilizan para


    diferenciar elementos y agregar énfasis a los elementos.
    El color es la luz reflejada por los objetos y tiene tres características
    principales:
    matiz (como rojo, verde, azul, etc.)
    valor (cuán claro u oscuro)
    saturación (qué tan brillante o aburrida)
     Textura: En el mundo físico, la calidad de la superficie de un objeto se denomina
    como texture. Puede ser de dos tipos.
    Tactile Textures: Texturas que puedes sentir y ver. Ej .: Textura sobre un
    paño.

    Implied Textures: Texturas que solo puedes ver. Por ejemplo: textura en el
    fondo de pantalla de su teléfono

     Tipografía: Typography, un aspecto importante del diseño visual, es un arte /


    técnica de ordenar letras para hacer que el lenguaje escrito sea fácil de leer,
    comprender y atractivo cuando se muestra.
    La tipografía establece un estado de ánimo o una emoción y, cuando se hace
    bien, ayuda a reconocer una marca.

     Formulario: Form se aplica a objetos que son de naturaleza tridimensional y


    tienen altura, ancho y profundidad. Se puede utilizar para definir el espacio,
    crear contraste y agregar volumen a una composición visualmente.
    Hay principalmente dos tipos de formas.
    Geométrico
    Orgánico

     Cuadricula: Grids son la base sobre la que se realiza un diseño que permite a


    un diseñador organizar varios elementos de diseño en una página.

     Diseño: A Layoutes la disposición de los elementos visuales en un diseño que


    se parece a la apariencia final del mismo. Por lo general, se construye dentro
    de una cuadrícula. El diseño tiene áreas activas y pasivas según la forma en
    que el ojo lo escanea.

    Principios del diseño visual


    Para crear un buen diseño visual, aplicaremos los siguientes principios a los
    elementos de diseño.
     Unidad: Debe haber un sentido de unityo harmonyentre todos los elementos
    utilizados en una pantalla o página. Debe organizarse de manera equilibrada
    para crear un sentido de unidad. El diseño debe lograr un equilibrio entre la
    unidad y la variedad, no debe ser demasiado aburrido o caótico.
     Espacio: Una forma utilizada en el diseño a menudo se denomina positive
    space (figure)y el área que la rodea se llama negative space
    (ground). Ambos son elementos de diseño igualmente importantes y aportan
    equilibrio a una composición.
     Jerarquía: Visual hierarchy es la presentación o disposición de elementos
    de una manera que implica significado / importancia.
    Al establecer diferentes características visuales para fragmentos de
    información, un diseñador puede influir en la percepción del usuario de lo
    que aparece en la jerarquía.
    Algunas de las características son:
    Size: los elementos más grandes atraerán más atención.

    Color: es más probable que los colores brillantes llamen la atención


    sobre los apagados.
    Alignment: un elemento que se mantenga alejado de la alineación de
    los demás llamará la atención.
    Character: un elemento que posee una forma diferente a la del grupo
    llamará la atención.

     Equilibrio: Balancenos ayuda a distribuir los elementos de un diseño de


    manera uniforme. Los diseños equilibrados parecen estables. Existen
    principalmente dos tipos de equilibrio.
    Equilibrio simétrico
    Equilibrio asimétrico

    Symmetric balance: Los elementos están orientados a lo largo de un eje


    común de arriba a abajo o de izquierda a derecha.

    Asymmetric balance: Los elementos se colocan orgánicamente creando


    tensión y equilibrio.

     Contraste: Contrastse usa cuando se desea que un elemento se destaque. Se


    refiere a la disposición de elementos visualmente distintos para crear interés.
     Escala: Scale define el tamaño relativo de los elementos de diseño, por lo
    que crea interés y profundidad al mostrar cómo se relacionan los elementos
    en función del tamaño.

     Dominio: Dominanceestá creando un enfoque en un solo elemento. Esto se


    puede lograr variando los siguientes parámetros.
    Talla, Forma, color, valor, profundidad, textura, densidad saturación,
    orientación, espacio en blanco local, interés intrínseco, peso físico percibido
     Semejanza: Similarityse trata de mostrar que varios elementos de diseño
    están relacionados, lo que aporta consistencia al diseño. Principalmente
    complementa nuestras habilidades para procesar información.

     Proximidas: Proximity ayuda a organizar elementos. Al agrupar elementos


    similares juntos o muy cerca, crea una relación entre esos elementos en la
    mente del espectador.
    La proximidad le da al usuario, claridad e idea de dónde debe comenzar y
    terminar la lectura. Esto se puede materializar mediante el uso de tamaño en
    puntos, fuente, color, etc.

     Alineación: Alignment ayuda a crear un diseño más nítido, organizado y


    ordenado. Es uno de los principios de diseño más básicos e importantes, ya
    que ayuda a proporcionar una conexión invisible entre los elementos, incluso
    si no están muy cerca unos de otros. Ayuda a reducir la carga cognitiva y, por
    lo tanto, aporta un aspecto más limpio.

    Psicología Gestalt
    Gestalt psychologyse ocupa del estudio de cómo percibimos los objetos de
    nuestro entorno. Discute principalmente la diferencia entre espacios positivos y
    negativos y examina cómo varias leyes nos ayudan a diferenciar figura y fondo.

     The law of similarity afirma que todos los elementos con caracteres


    superficiales similares se perciben como un grupo.

     The law of proximityafirma que los objetos que están cerca unos de otros
    se perciben juntos como un grupo. 
     The law of familiarityafirma que el cerebro humano percibe las líneas, formas
    y curvas y las relaciona con objetos significativos del mundo real.
     The law of symmetry afirma que el cerebro humano percibe los elementos
    visuales agrupados cuando están dispuestos simétricamente.
     The law of continuity afirma que el cerebro humano prefiere ver un flujo
    continuo de elementos de diseño y no como objetos separados.
     The law of common fate afirma que los humanos tienen una tendencia a agrupar
    elementos que se mueven en la misma dirección.
     The law of synchronyes similar a la ley del destino común. Afirma que existe una
    tendencia a agrupar los elementos visuales que aparecen al mismo tiempo aunque
    no estén en movimiento.
     The principle of closure afirma que la mente humana combina la información
    visual disponible para formar un objeto significativo en lugar de verlo como
    elementos individuales.
     The law of common region afirma que los elementos de una región cerrada se
    perciben como un grupo.
     The law of element connectednessafirma que los humanos tienen tendencia a
    agrupar elementos conectados. En este ejemplo, sentimos que los cuadrados
    conectados se destacan en comparación con el resto de cuadrados.

    ¿Cómo lee la gente una página?


    Una página tendrá áreas activas y pasivas. Los estudios de seguimiento ocular
    revelan que cuando los usuarios leen una página, sus ojos escanean el contenido de
    la esquina superior izquierda.

    Nota : los árabes y los chinos leen las páginas de manera diferente a los europeos.

    Patrón F
    En los sitios web con mucho texto, como los blogs, el lector primero escanea
    verticalmente el lado izquierdo del texto en busca de palabras clave o puntos de
    interés en las oraciones iniciales del párrafo.

    En el momento en que el lector encuentra algo que le gusta, comienza a leer


    normalmente, formando las líneas horizontales. El resultado final es que el patrón se
    parece a las letras F o E y se llama como F-Pattern.

    Patrón Z
    Z-Pattern el escaneo se realiza en sitios web que no tienen mucho texto.

    Cuando el ojo llega al final de la línea, se mueve en diagonal hacia abajo a la


    izquierda (nuevamente según el hábito de lectura) y repite un escaneo horizontal en
    la parte inferior de la página.
    El patrón Z es perfecto para interfaces simples, minimalistas y centradas en botones
    de llamada a la acción.

    Diagrama de Gutenberg

    Gutenberg Diagrammuestra el comportamiento del usuario de la lectura-


    gravedad. Divide el área de diseño visual en cuatro.

     Área óptica primaria


     Fuerte área de barbecho
     Área de barbecho débil
     Área terminal

    Ley de Fitt
    Según Fitts’ law, la cantidad de tiempo necesaria para que una persona mueva un
    puntero (por ejemplo, el cursor del ratón) a un área objetivo es una función de la
    relación de la distancia al objetivo dividida por el tamaño del objetivo.

    Por lo tanto, cuanto mayor sea la distancia y menor el tamaño del objetivo, más
    tardará el usuario en alcanzarlo.

    Diseño visual para daltónicos


    Estas son algunas consideraciones que se deben tener en cuenta al diseñar una
    interfaz que también se adapte a los daltónicos :
     Usa símbolos junto con colores
     Utilice un enfoque minimalista al diseñar limitando la paleta de colores.
     Usa texturas y patrones para mostrar contraste.
     Utilice una amplia gama de colores contrastantes y no solo en blanco y negro

    Testing a Visual Design


    El diseño visual de un producto se puede evaluar mediante el seguimiento ocular.
     Analiza cómo los ojos del usuario se mueven por la pantalla.
     Un buen diseño visual debe llamar la atención del usuario hacia algo
    importante para los objetivos estratégicos del producto.

    También podría gustarte