Diseño gráfico y estética ¿Qué hacer y no hacer?

Para que nuestros diseños nos caigan en los errores más típicos, veamos la siguiente diapositiva. Además, encontraremos una serie de recursos útiles para nuestra creatividad.

1. y herramientas
Mg. Carlos Cruz
Docente Universitario
Recomendaciones

2. “Cuandobuscamossercreativos, la mente recurre a lo que ya
hemosvisto, probado, escuchadoo sentido”
2
Asíquedebemosverbastantecontenido, esunaforma de
darlematerial a nuestracreatividad…
Mg. Carlos Cruz / DocenteUniversitario

4. ¿Porquéesimportanteser
estéticoen un diseño?
•En el lenguaje coloquial se refiere a aquello
que es bello, o mejor, que se percibe como
bello, aunque en filosofía se entiende como la
rama que estudia la esencia y la percepción de
la belleza. La palabra deriva de las voces
griegas “aisthetikê” (percepción), “aisthesis”
(sensibilidad) e “ica” (relativo a).
•Ahora, existen unas normas básicas dentro del
diseño que encajan perfectamente en los
gustos de una buena parte de la sociedad…
4
Mg. Carlos Cruz / DocenteUniversitario

5. “Para los gustos, los colores”
La estética es: Crítica, rigurosa, sistemática
-Juzga, compara, vincula, organiza
-Es subjetiva: tiene presente las percepciones,
culturas, gustos y conocimientos.
•Poreso, el diseñador debe conservar ideas,
conceptos y signos.
•Debeteneren cuentael lugar, el tiempoy la
cultura.
•Debe tener en cuenta un modelo o arquetipo
https://www.behance.net/galleries 5
Mg. Carlos Cruz / DocenteUniversitario

6. https://www.fotojet.com
ParecidoaCanva,conunainterfazmuyintuitivay
fácildemanejar,asíesfotojet.Unsitiowebdonde
podremosagregarlasfotosdesdenuestrapcy
agregarmarcos,textosofiltrosprediseñadosyal
finalexportarenJPGaltaresolución.
https://www.flaticon.com/
EsteeselportaldelosíconosenPNGoenvectores
parausarennuestrosdiseños.Bastaconescribirenel
buscadorlapalabraclaveyensegundosveremosuna
buenacentenadeíconosparadescargaryusarennuestros
diseños,simpleydebuengusto.

8. Evite agregarmarcosy efectosinnecesarios
a lasfotoscuandohagasusdiseños. Los
marcosy efectoscaenbiencuandohay
buenaestética, cuandose hacenecesario
en el diseño.
8
-No distorsionar la imagen
-No sesgar la imagen
-No estilizar la imagen
-No cortar la imagen correctamente
-No usar imágenes de buena calidad
Las imágenesse escalande
lasesquinas, no de la mitad

9. “El diseño no consiste en hacer bello lo útil, ni hacer bueno lo bello, ni
hacer útil lo bueno. Un buen diseño encuentra su ciencia, su ética y su
estética en su simple globalidad”Jorge Wagensberg
9
Fuente: Pinterest (Foto original, sin retoque)
Mg. Carlos Cruz / DocenteUniversitario

10. 10
Fuente: Pinterest (Foto original, sin retoque)Fuente: Pinterest (Foto original, sin retoque)

11. https://www.rawshorts.com
Siloquenecesitasescrearunvideotipoinfografíaytienes
unabuenaidea,Internetyalgunosrecursos,estaesla
plataformaqueteayudará.Solodebemosregistrarnosyde
inmediatoaccederemosaunpanelmuyatractivode
recursoseditablesenvideo.
https://www.vexels.com/
Uno de los portales de búsqueda de archivos en PSD, AI,
PNG y SVG más grande de Internet. De verdad pero los
creadores de esta plataforma se fajaron con sus recursos.

13. 13

14. El diseño tiene que transmitir
unmensaje claro y visual.
Hay que conocer bien elsector, la
empresa/marca y el público
objetivo.
Elementosqueaparecen
Esimportanteteneren cuenta:
•Figuras: líneas, cuadrados, círculos, triángulos,
rectángulos.
•Si en un diseñolasimágenesvan en círculos,
se debeconservarestasfigurasen todo.
•Esimportanteteneren cuentala ubicación
de los elementos, conservarun equilibrio.
14
Colocación o distribución de los elementos
Fuente: Pinterest (Foto original, sin retoque)
Mg. Carlos Cruz / DocenteUniversitario

15. Títulosy subtítulos
15
QUÉ HACER Y NO HACER
•Las líneas le dan soporte a los bloques de
textos grandes, úsalas.
¿Quétalunaspunteadas?
•Así se verán tus líneas cuando tengas párrafos
grandes y necesites agruparlos dentro de un
diseño.
•Recuerda que existen diferentes tipos de
líneas, algunas son deformes o degradadas
No dañesusdiseños
•Los círculos se ven muy bien, los óvalos no. Los
óvalos hay que saber manejarlos, por lo
general se ven como si el círculo hubiera
quedado mal.
•Lo mismo pasa con los rectángulos y demás
formas que al rotarse toman una distorsión en
sus bordes.
Mg. Carlos Cruz / DocenteUniversitario

16. En occidente leemos de izquierda a
derecha, por eso los ojos se desplazan a
través de los anuncios de izquierda a
derecha.
Entonces es recomendable arrancar con
el producto y/o slogan en la parte
superior izquierda para “abrir” el anuncio.
Ahora, si el fondo no deja leer bien el
logo, puede ir en la parte inferior derecha
para “cerrar” el anuncio y que sea lo que
permanezca en la memoria.
Si aprendemos de los grandes: Coca-
Cola / Mc Donalds/ Pepsi / Nos daremos
cuenta que todo depende del anuncio,
así mismo se ubica la marca.

17. Fuente: Pinterest (Foto original, sin retoque)
Mg. Carlos Cruz / DocenteUniversitario

18. LOS LOGOTIPOSSE COMPONEN ÚNICAMENTE DE PALABRAS.
LOSISOTIPOS SON SÍMBOLOS QUE YA RECONOCEMOS COMO
UNA MARCA EN ESPECÍFICO. NO REQUIERE MOSTRAR
ACOMPAÑAMIENTOS TEXTUALES.
LOS ISOLOGOSSON LA FUSIÓN DE IMAGEN MÁS TEXTO.
SON INDIVISIBLES, YA QUE SOLO FUNCIONAN COMO UN
CONJUNTO.
LOSIMAGOTIPOS SON TAMBIÉN UNA FUSIÓN DE TEXTO E IMAGEN.
ESTOS SÍ PUEDEN SEPARARSE, SIN TEMOR A PERDER EL
SIGNIFICADO.
17
Mg. Carlos Cruz / DocenteUniversitario

19. https://www.tailorbrands.com/
Nohaynadamejorqueelconceptoideadoporundiseñador
gráficoounpublicista.Sinembargo,avecesnocontamos
coneltiemposuficienteolosrecursosidealespara
construirunlogo,poresoestáestetipodepropuestascomo
tailorbrands.
http://www.brandsoftheworld.com/
Casiquetodosloslogosymarcasestánaquí.Lointeresantesesque
lospuedesdescargarenPSDoAIyverlaconstruccióndecadaunopara
tenerloscomoguíaparatuspropiosdiseños.

21. Controlesusemociones, no viertatodos
los coloresen un diseño
Tengaencuenta:Matiz,saturacióny
luminosidad
Matiz:Matizeselcolormismo.Cadamatiz
tienecaracterísticaspropias.Haytres
maticesprimarios(amarillo,rojo,azul).La
estructuracromáticaseenseñamediantela
ruedadecolores.Loscoloresprimariosylos
secundarios(naranja,verdeyvioleta).Pero
suelenincluirsetambiénmezclasmuyusadas
dealmenos12matices.
Saturación:Eslapurezadeuncolorrespecto
algris.Escolorsaturado.Estácompuestode
maticesprimariosysecundarios.Loscolores
menossaturadosapuntanhacianeutralidad
cromáticaysonsutilesytranquilizadores.
Cuantomásintensaosaturado,más
cargadoestádeexpresiónyemoción.Lo
informativoesdecolorsaturado.Locontrario
esaloquellamamostonos“pastel”.
Luminosidad:Eslacaracterísticareferidaal
brillo(delaluzalaoscuridad).Lapresencia
oausenciadecolornoafectaaltono
21
https://color.adobe.com

22. Dependiendodel diseño, asímismopensaráen
la temperatura. Sin embargo, los coloresdeben
tenerunajustificacióny un orden.
Negro:Losiniestro,lodesconocido,elmisterio.
Gris:Sugierecomedimientoeinteligencia.Son
neutros,fríos,sincompromisosniimplicaciones.
Transmitedesánimo,aburrimiento.Hayquienlo
relacionaconelpasadoylavejez.
Blanco:Laluzyeldíaseemparentanconlapureza,
colordelavirginidad/inocencia.Símbolodelapaz
ylaarmonía.
Rojo:Vinculadoconelcorazón,lasangreylavida.
Esagresivo,excitante.Implicaacciónymovimiento.
Esuncolormuyvisible,indicadordepeligro.
Naranja:Esricoyextrovertido.Fluorescenteesuno
deloscoloresmásvisibles.Esuncolordealarma.Su
brillantezaumentacuandodisminuyelaluzsolar.
Amarillo:Colorreflectante.Tieneunsentidode
avance.Colormásvisiblecuantomássaturadoesté.
Colordelajovialidad,delarisayelplacer.Esel
colordeloroylaopulencia.Laalegríadelamarillo
dejapasoacualidadesnegativascomolatraición,
lacobardíaoegoísmo.
Verde:Eselcolordelanaturalezaylaesperanza.
Esjuventudyfertilidad.Tienepropiedadessedante
ytranquilizadoras.Puedellegaraserpodredumbre
ydecadencia.Esvenenoyloscelossonverdes,
comolosreptiles.
Azul:Esinfinito,nobleygrandioso(cieloymar).Lo
azulesbelloymajestuosoaunquepasivo.La
confianzaylafidelidadsonazules.Tieneun
componente frio;precisoyordenado.Sipierde
luminosidadtieneunairetriste.
Violeta:Colordellujoyaostentación.Delprestigio,
ladignidadylaelegancia.Elpoderevocadorlo
llevaarepresentarotrosvalores:Elmisteriodela
Pasióncristiana,elengaño,elhurto.
22
El efecto de avance en los colores cálidos y de
retroceso en los fríos
Mg. Carlos Cruz / DocenteUniversitario

23. PEOR

24. https://piktochart.com/
Estaesunadelasplataformasmásgrandesquetiene
Internetparacrearinfografías,postersyotrosdiseños.
Conlamismatécnicadearrastrarysoltar,podrásdarle
vidaatusideas.
https://www.genial.ly/
Sieresestudianteyquieresusarlosdiseñoshechos,tesaldrá
auncostode2dólarespormesytendrásbastantesbeneficios
ademásdequitarlamarcadeagua.Diseñosmuycompletosy
fácilesdeusar.

25. •y excelente ortografía

26. La tipografíadebe
tenerun sentido, una
personalidady una
posición. Utiliza un máximo
de 2 (como mucho 3)
tipografías y combínalas
bien.
26
3. MEZCLAS:
Se combinan fuentes de
estado de ánimo
complementarios y de
épocas similares
2. CONTRASTE:
Combinación entre
una tipografía regular
y una boldo fuerte
1.GHOTMS:
-GeometricSans
-HumanistSans
-Old Style
-Transitional
-Modern
-SlabSerif
4. TÍTULOS Y PÁRRAFOS:
Por lo general los títulos son
textos artísticos y los párrafos
van con texto serifpor su
mejor legibilidad
Mg. Carlos Cruz / DocenteUniversitario

27. Tamaño
Este punto también va relacionado con la legibilidad.
Una letra muy pequeña puede no tener buena lectura.
Pero una letra muy grande tampoco puede ser
agradable, si el texto es muy largo.
Interletrado
Es el espacio que hay entre letra y letra. Si es muy
pequeño ese espacio, las letras se unen y pueden crear
una forma difícil de entender y por lo tanto se pierde la
lectura.
Interlineado
Es el espacio entre línea y línea de texto. Si hay poco
espacio entre una línea y otra se puede complicar la
lectura, o si hay mucho puede que no se vea el párrafo
como tal y no permita la fluidez en la lectura.
El interlineado debe ser justo, que no se vea tan
separado porque rompe el diseño.
Serif
Respeto
Tradición
Autoridad
Grandeza
San Serif (Palo seco)
Moderna
Limpia
Clara
Estable
SlabRare
Fuerte
Solida
Divertida
Moderna
27
Cursiva
Elegante
Creativa
Femenina
Intrigante
Moderna
Fuerza
Estilo
Chic
Exclusividad
Display
Fresca
Única
Expresiva
JUSTIFICAR Y ALINEAR:
Los textos deben estar
justificados o alineados a la
izquierda o derecha o
centrados, no dejar huérfanas.
NEGRITAS Y COLORES:
Si va con NEGRITAno va en cursiva ni subrayada ni con
sombra.
Si va con color, que conserve un matiz similar Mg. Carlos Cruz / DocenteUniversitario

28. Esimportantesiemprecitarla fuentesde información. Puedesercon el
nombredel autoro el enlace de referenciade dondese tomóel
contenido.
28
Fuente: Pinterest(Foto original, sin retoque)

29. 29
Fuente: Pinterest (Foto original, sin retoque)Fuente: Pinterest (Foto original, sin retoque)

30. https://www.dafont.com/
Definitivamenteunadelasmejoresparadescargarfuentes
tipográficas.Aquíencuentrasdiferentesestilosymodelos,
ademáspuedesagregaruntextoyvercómoquedaríacon
eltipodefuentequeescogiste.
https://www.whatfontis.com
Sitienesunaimagenyquieresreconocereltipodefuenteque
sehaempleado,aquílopuedeshacer.Estesitioreconoceeltipo
defuenteytediceelnombreexactoyavecespuedesconseguiresa
tipografíaallímismo.

32. 32
Mg. Carlos Cruz / DocenteUniversitario

33. 33
Fuente: Pinterest(Foto original, sin retoque)

34. https://es.brusheezy.com/
Acciones,pinceles,texturas,patronesydemásutilidades
puedesdescargaraquí.Nohayexcusaparanodiseñarbien
conestosrecursosparaPhotoshop.
https://es.calameo.com/
Dosrevisterosonlinequenossirvencomoreferencia
alahoradediseñaryconservarlaestética.Veremos
cómodiseñanlasgrandesmarcasyperiódicosy
quéorientacióntienenensusfotografías.
https://issuu.com/ issuu