Taula de continguts
Una guia completa per aprendre els conceptes bàsics del disseny visual.
La pregunta d'un milió de dòlars: quin és el secret d'un bon disseny?
Podem ser filosòfics sobre aquest. , però en general, el proverbial "secret" del bon disseny rau en la manera com organitzeu els vostres elements visuals, en relació amb el vostre llenç i entre ells. Bàsicament, acabem de descriure el disseny del disseny. Que, quan hi penses, està a tot arreu.
Preguem, per exemple, la maquetació d'una revista. El seu disseny segueix un sistema de quadrícula clàssic (aprendrem tot sobre les quadrícules en un minut). Normalment, tot està alineat a l'esquerra, a la dreta i a la part inferior. Les columnes tenen especialment una alineació justificada diferent que fa que la pàgina no només sigui atractiva visualment, sinó que també sigui fàcil de llegir i tingui autoritat. Els encapçalaments grans atreuen l'atenció de l'espectador, mentre que el subtítol es presenta com un contrast de mida per crear una jerarquia visual d'informació.
Linda Gaom, Behance
Totes aquestes qualitats fan que la pàgina disseny net, estructurat i fàcil de llegir, i estan en sintonia amb els consells dels quals parlarem a continuació. Però primer, anem a entendre més sobre el disseny de maquetació en si.
Vegeu també: Com gestionar la crítica creativa com a dissenyadorQuè és el disseny de maquetació?
El disseny de maquetació es refereix a la disposició dels elements gràfics per atreure l'atenció del lector i transmetre un missatge particular d'una manera visualment atractiva. .Així que no estem parlantel lloc de descans, mentre que altres elements donen direcció.
Una manera senzilla d'entendre-ho és prenent l'exemple del nostre lloc web, per exemple. Els gràfics estan clarament separats del text, i també les crides a l'acció, de manera que l'atenció de l'espectador està navegant d'un grup d'informació a un altre.
Principi #5. Utilitzeu el contrast
Assegureu-vos que teniu prou contrast al vostre disseny.
El contrast ajuda a organitzar el vostre disseny i establirà una jerarquia molt necessària i posarà èmfasi en allò que és important.A més, un bon ús del contrast també afegeix interès visual al disseny. Siguem sincers, un disseny on tot tingui la mateixa mida, forma o color semblarà avorrit. El contrast anima les coses.
El teu primer pensament podria ser el contrast de colors, com ara càlid versus fresc, fosc versus clar, blau versus taronja. Però tot i que el color és un principi de contrast extremadament essencial, també hi ha contrastos de tipus, alineació i mida. I recordeu, el contrast també és relatiu. Només té significat en juxtaposició amb altres elements.
A continuació es mostren alguns exemples de dissenys que utilitzen aquesta regla d'una manera intel·ligent i bella. Observeu el contrast de la tipografia, el color i fins i tot el contrast de la mida entre els elements.
Font: Pla d'acció de conciliació de l'IAG
Principi núm. 6. Repetició, patró, ritme
Quan pensem en la repetició, pensemdel mateix element una i altra vegada.
Però és diferent en el seu disseny. Definitivament no és tan avorrit com això. Quan s'utilitza correctament, la repetició pot potenciar el vostre disseny.
Vegeu també: Portafolis d'il·lustració convincents i com crear el vostre propiIntenta identificar i reutilitzar un motiu al llarg del disseny perquè diverses àrees se sentin connectades i formen part de la mateixa composició. Ajudarà que el vostre disseny tingui un tema. En repetir elements, no només entreu segons les expectatives del vostre públic, sinó que també millorareu l'experiència de l'usuari. Ser coherent fa que els usuaris se sentin més còmodes.
Pots fer-ho repetint formes o símbols. O fins i tot una combinació de colors, una tipografia i el mateix estil en general.
Un bon hàbit és utilitzar una tipografia amb una família nombrosa. Limiteu el nombre diferent de patrons, gramatges/estils de línia i colors i repetiu-ho tot. A més, intenteu mantenir l'estil de les imatges i els gràfics igual. Per exemple, utilitzeu il·lustracions del mateix artista.
Font: Thepentool.co
Això és tot. Aquests són els sis principis que us ajudaran a organitzar el vostre disseny i a aconseguir un disseny més net, més professional i equilibrat.
Però el vostre viatge no s'acaba aquí. El disseny gràfic no és una ciència exacta i no s'ha de limitar a consells i principis. Com és cert en totes les àrees de la creació, no hi ha cap regla general. Trencar aquests consells de maneres subtils afegirà profunditat i varietatels vostres dissenys.
No obstant això, són un gran punt de partida i us animem a provar-los. I fes-nos saber com van funcionar!
Baixa Vectornator per començar
Porta els teus dissenys al següent nivell.
Baixeu el fitxer
sobre el disseny del logotip aquí. Però el disseny de material imprès, com ara diaris, revistes, pòsters i els seus homòlegs digitals, així com el disseny web, d'aplicacions o d'UX/UI.La paraula "disseny" ens dóna moltes pistes. Significa una disposició d'elements predeterminats en una pàgina.
Quan un disseny és efectiu, té un bon aspecte i guia l'espectador per entendre el missatge que el disseny intenta transmetre. Per tant, comprendre la maquetació és clau per crear composicions atractives, efectives, fàcils d'utilitzar i agradables.
Si una maquetació no transmet bé el seu missatge a l'audiència, és a dir, no "llegeix bé". ", el disseny serà ineficaç per molt que sembli de moda. En l'àmbit del disseny de maquetació, el contingut substitueix les tendències i els trucs.
El propòsit del disseny de maquetació
Transmetre un missatge ràpidament
Això és clau. El disseny de maquetació estableix la relació entre els actius gràfics per aconseguir un flux suau de moviments oculars per obtenir la màxima efectivitat i impacte.
Per crear equilibri
Utilitzar els principis del disseny de maquetació és la manera més senzilla de crear una sensació d'equilibri i simetria en els vostres projectes de disseny sense arribar a ser avorrit.
Per crear cohesió
La disposició us ajuda a organitzar els molts elements del vostre disseny d'una manera fàcil de digerir, cohesionar i lògic.
Per crear bellesa
L'equilibri i l'estructura creen bellesa de manera natural.Si el vostre disseny de maquetació es fa correctament, automàticament serà visualment atractiu per a l'espectador. Com menys esforç hagin de fer els espectadors per entendre un missatge, més atractiu semblarà el vostre disseny.
Dissenyador de Frank Philippin per al seu llibre 'I Used to Be a Design Student: Then - Ara.' Font: DesignBoom
Els elements del disseny de maquetació
Text
Això inclou no només el cos del text o els paràgrafs, sinó també els títols, subtítols, capçaleres i peus de pàgina. La tipografia, el color i la mida que trieu aconseguiran efectes diferents sobre com es traduirà el vostre disseny al vostre públic.
Imatge
Els tipus d'imatges més habituals són les fotografies, les il·lustracions o les infografies.
Formes
Les formes poden ser geomètriques, que són molt angulars, o poden ser orgàniques, imitant el món natural. També poden ser abstractes. Les formes abstractes han estat molt de moda durant l'últim any, ja que hem vist dissenyadors web incorporant-les a composicions complexes i extenses.
Les formes poden substituir una imatge. O es poden utilitzar per afegir elements gràfics a una pàgina, ressaltar text o delimitar l'espai entre altres elements visuals.
Espai en blanc
Qualsevol disseny de disseny tindrà una certa quantitat d'espai en blanc. que permetrà que els vostres elements respirin i destaquin per si mateixos.
Els principis d'or del disseny de maquetació
Notaràs que els principisdel disseny de maquetació segueixen molts dels principis fonamentals del disseny. Com utilitzar el color d'una determinada manera, la tipografia, la repetició, el contrast, la jerarquia i l'equilibri.
Principi #1. Utilitzeu quadrícules
Les quadrícules ajuden els dissenyadors a posicionar diversos elements de disseny com el text i les imatges d'una manera que sembli coherent i fàcil de seguir.
Proporcionen una sensació d'ordre, impedeixen que els elements es superin els uns als altres. , i el més important, les quadrícules també corregiran la vostra alineació. Fes que la teva feina se senti més neta i professional.
Font: hgmlegal.com
L'anatomia de les quadrícules
Potser pensar que només són línies verticals i horitzontals, però una graella està formada per diverses parts. Molts, de fet. Aquí teniu la terminologia més important que heu de conèixer en una graella bàsica:
- Format és l'àrea completa del vostre disseny final. Per tant, si dissenyeu alguna cosa per imprimir, el format és la pàgina, i si sou dissenyador web, el format és la pàgina web o la finestra del navegador.
- Marges són els espais buits intencionats entre el format i el disseny.
- Línies de flux són les línies horitzontals que separen el vostre disseny en seccions paral·leles. Les línies de flux ajuden a la llegibilitat del teu disseny i guien el lector a seguir correctament el contingut.
- Els mòduls són els blocs que estan formats per les línies horitzontals i verticals.línies de flux de qualsevol quadrícula. Si hi penseu bé, són els components bàsics de qualsevol quadrícula. Tots els vostres mòduls verticals creen les vostres columnes, mentre que totes les vostres quadrícules horitzontals creen les vostres files.
- Les regions són grups de mòduls connectats, ja siguin verticals o horitzontals. No hi ha regles sobre com decidiu organitzar-los.
Font: Radversity
Tipus de quadrícules
Les quadrícules de disseny es van utilitzar primer per organitzar-les. escriptura a mà sobre paper.
Es remunten ja al segle XIII, quan l'artista francès Villard De va fusionar el sistema de quadrícula amb la proporció àuria per produir dissenys de pàgines impreses amb marges. Podeu veure aquest sistema de quadrícula fins avui, com demostren la majoria de dissenys de llibres i revistes impresos. Els editors, els editors i els dissenyadors prefereixen utilitzar quadrícules estàndard no només perquè tenen un bon aspecte, sinó perquè els lectors han arribat a esperar que determinats elements de disseny estiguin en un lloc concret.
Les quadrícules es poden dissenyar de dues maneres: simètriques. o asimètric. Les quadrícules simètriques segueixen una línia central, on les regions vertical i horitzontal són iguals entre elles; i les columnes tenen la mateixa amplada.
En una quadrícula asimètrica , com el seu nom indica, els marges i les columnes no són tots idèntics.
Basant-se en aquesta classificació, hi ha cinc tipus principals de quadrícules de disseny utilitzats a tot el món en què podeu confiar:
Manuscritles graelles són el tipus de graella més comú per als documents. Separen la capçalera, el peu de pàgina i els marges i, bàsicament, creen un rectangle dins del format (o la pàgina) que proporciona els límits del vostre text. Són la base per a revistes, diaris i llibres. Per tant, és probable que sigui el disseny amb el qual esteu més familiaritzat.
Font: UXplanet
Font: Radversity
Grilles de columnes són un altre dels favorits en l'edició de revistes. Un disseny típic de revista utilitza quadrícules de columnes per separar el text en seccions fàcils de llegir. Però també són molt populars per als llocs web. Podeu utilitzar des de dues fins a sis graelles. Més és possible, però no és comú. Una cosa molt important sobre les quadrícules de columnes és que l'espai entre les columnes, o els canalons, estiguin a la mateixa distància entre si.
Els diaris utilitzen quadrícules de columnes simètriques, per exemple, mentre que en disseny web es prefereix una quadrícula de columnes asimètrica. .
Font: UX Planet
Font: Radversity
Les quadrícules modulars són similars a la quadrícula de columnes, però també tenen en compte les línies de flux horitzontals. Aquest tipus de quadrícula és necessari quan heu d'organitzar diversos elements a la vostra disposició i les quadrícules de columnes simplement no són suficients.
Les quadrícules modulars tenen mòduls de la mateixa mida que fan que sigui molt fàcil visualitzar les vostres zones espacials de diferents maneres.
Font: UXPlanet
Font: Radversity
Les quadrícules de referència són fantàstiques per a composicions basades en text. Una línia de base és la línia on descansa el text quan escriviu, i l'interlineat és l'espai entre dues línies de base. Et preguntes quina mida hauria de ser el teu encapçalament o subtítols?
Les quadrícules de referència estan aquí per ajudar-te a donar un ritme fluid al teu text.
Font: UX Planet
Font: Fragaria
Les quadrícules jeràrquiques semblen menys una quadrícula que totes les seves homòlegs. No obstant això, són molt útils a l'hora d'organitzar els elements de disseny en el seu ordre d'importància. Les quadrícules jeràrquiques es poden basar en quadrícules modulars, o fins i tot podeu crear les vostres pròpies. Els llocs web utilitzen molt aquesta quadrícula, especialment les revistes digitals i els diaris acostumen a confiar més en quadrícules jeràrquiques que en quadrícules de columnes en la seva transició a ser digitals.
Font: UX Plane
Principi #2. Utilitza l'espai negatiu
Sovint pensem que el buit, el silenci o la manca de color són dolents. Però no considerem com són la base sòlida del contrast.
També anomenat espai en blanc, l'espai negatiu és aquella àrea del vostre disseny que no té cap element real. És la zona deixada buida. No només envolta els vostres actius, sinó que també crea els vincles necessaris entre ells. Per això, l'espai negatiu és un element de disseny legítim i té un impacte massiu en l'efectivitat del vostre dissenyel disseny és.
Espai negatiu bo i dolent
L'espai negatiu ajudarà a separar diverses àrees del vostre disseny, alhora que permetrà que el vostre disseny es respira. Ajuda amb la jerarquia visual i l'equilibri visual; fixa l'atenció de l'usuari en els elements bàsics; redueix el nivell de distracció; i, finalment, afegeix estil i elegància al vostre disseny.
Els dissenyadors sense experiència poden tenir la tendència a omplir el màxim possible del seu llenç, augmentant el text o fent volar un logotip o una imatge. Però donar espai als vostres elements permet que l'espectador pugui seleccionar determinades pistes d'informació més ràpid i còmodament.
Si tot crida cap a l'atenció de l'espectador, no se sent res.– Aaron Walter, 'Design for' emoció'
Una manera senzilla de determinar el vostre espai negatiu és utilitzar una graella modular. Si col·loqueu això a sobre del vostre disseny, podreu visualitzar fàcilment quins mòduls poden romandre buits i quins s'han d'omplir.
Dissenyador de Brunswicker, Font: Codesignmag.com
Principi núm. 3. Trieu un únic punt focal
Alguna vegada us ha demanat algun client que engrandissiu el logotip? I després, per fer encara més gran el titular?
No pots emfatitzar-ho tot. Derrota el punt del bon disseny. Igual que el temps, el focus és relatiu. Perquè un element destaqui, un altre ha de servir de fons. Alguns elements han de dominar els altres perquè es mostri el vostre dissenyuna jerarquia visual.
El punt focal d'un disseny és l'element amb més pes visual. És l'element que atreu primer l'ull, més que qualsevol altra cosa en el vostre disseny.Un punt focal anunciarà al vostre públic on comença el seu viatge de visualització al vostre disseny. Per tant, és el començament de la història que esteu explicant.
Acostuma a aconseguir-ho utilitzant una imatge gran o una font de tipografia gran. Observeu com d'eficaç és el punt focal a continuació
Dissenyat per Braulio Amado per a Bloomberg Businessweek, Font: És agradable que
Però, si bé un punt focal cridarà l'atenció del vostre públic, la següent regla ajudarà a guiar-lo.
Principi #4. Penseu en la proximitat i el flux
El principi de proximitat és senzill. Assegureu-vos que els elements que estan relacionats entre si es col·loquen junts.
La proximitat indica que els recursos visuals estan connectats i es converteixen en una unitat visual que ajuda a organitzar el vostre disseny.Per tant, només actius de disseny de clúster que tinguin una relació entre ells i utilitzeu butxaques d'informació sobre el vostre disseny per guiar el vostre públic cap al contingut rellevant que ha de consumir. Això també s'anomena principi de flux.
Font: Satori Graphics
Un disseny amb bon flux guiarà l'atenció de l'espectador per tot el disseny, d'element a element, amb facilitat. Els vostres punts focals atrairan l'ull i es convertiran en
