8 manieren om handgetekende pictogrammen en elementen te gebruiken
Hoewel er vaak aandacht is voor pixel-perfecte designelementen, zijn ze niet voor alles geschikt. Soms wil je iets met iets meer ... eigenzinnigheid. Iets authentieker!
Handgetekende pictogrammen of elementen kunnen precies de juiste ontwerptechniek zijn om iets speciaals aan een project toe te voegen. Hoewel de meeste ontwerpers niet gek zullen worden met elementen die met de hand lijken te zijn getekend, kunnen een paar details een persoonlijk gevoel toevoegen waar gebruikers naar worden aangetrokken.
Het is ook iets dat populair is in webdesign. Van een kronkel in een pictogram tot een volledige ervaring met gelijke bruikbaarheid en kunst, handgetekende elementen zijn een populaire ontwerpoptie. Hier zijn acht nieuwe manieren om deze trend te gebruiken!
Maak scheiding
Handgetekende ontwerpelementen kunnen worden gecombineerd en gecombineerd met bijna elk ander soort visuele weergave. Ze kunnen naast foto's of video werken, in een zee van witruimte of in de buurt van tekstelementen. Elimineer het concept van het gebruik van dit type element niet, omdat u bang bent hoe het in het algehele ontwerppatroon past.
Probeer het; je weet maar nooit.
Digital Visitor gebruikt deze elementen in het hele ontwerp om scheiding tussen elementen en bits op inhoud te creëren. Hoewel de elementen op de startpagina slechts stippen zijn, zijn er voorbeelden op meerdere plaatsen onder de scroll en zelfs de favicon heeft die handgetekende flair.
De plaatsing van elk element is ontworpen om ervoor te zorgen dat de gebruiker naar het juiste stukje inhoud kijkt. In het bovenstaande voorbeeld bevindt het element zich in het midden van het scherm en wordt het gebruikt om scheiding te creëren tussen twee inhoudsgebieden. Lager in het ontwerp worden vergelijkbare elementen in pictogramstijl over kleine tekstvakken gebruikt om te laten zien wat het bedrijf doet.
Interactieve doodles
Met de hand getekende elementen kunnen leuke interactieve stukken maken in het ontwerp. Van het laden van animaties - veel van de voorbeelden van websites in deze post gebruiken deze stijl - tot een volledig interactieve ervaring, deze ontwerptechniek is interessant genoeg om de interesse van gebruikers te wekken.
Real Estate Stained Glass is een mooi voorbeeld van een interactief spel dat zowel een website-designtrend als een creatief element combineert, waardoor gebruikers tekeningen op het scherm kunnen inkleuren. Wat dit met elkaar verbindt, is dat terwijl de look met de hand is getekend, de elementen nauwkeurig zijn en naadloos werken. Kleuren werkt zoals het hoort - en je krabbelt niet buiten de lijntjes - voor een ervaring die gebruikers verslaafd zal houden.
Bijna getekende typografie
Soms worden de beste handgetekende elementen niet echt uitgeschreven. Typografische stijlen die handschrift nabootsen, zijn bijzonder populair, vooral voor weergavedoeleinden.
Deze stijl van type heeft een lichter, persoonlijker gevoel waar gebruikers zich mee kunnen identificeren. (De truc is ervoor te zorgen dat letters goed leesbaar zijn.)
Tradewinds Hotel doet geweldig werk met een eenvoudig, cursief lettertype dat groot genoeg en leesbaar genoeg is om in één oogopslag te lezen. Ondersteunende typografie is allemaal in een eenvoudige schreefloze stijl, wat helpt om de nadruk te leggen op het weergavefontuur en ook alles gemakkelijk te verteren voor de gebruiker.
Ontwerp Divots
Sommige handgetekende elementen hebben een puur visueel doel. Ze bestaan om een stroom of gevoel te creëren voor het ontwerp dat op andere manieren moeilijk vast te stellen is. Deze divots kunnen vooral leuk zijn wanneer ze in het hele ontwerp op kleine plaatsen worden gebruikt.
Mother's Brewing doet precies dit. Er is een groot hart op de startpagina - het is duidelijk. Maar er zijn ook kleine elementen op bijna elke andere pagina - sommige voor de hand liggende, sommige behoorlijk verborgen. Elke knop heeft handgetekende accenten met het lintontwerp, elementen verschijnen op de achtergrond en overlay op glijdende elementen om dode ruimte in het ontwerp te vullen. Het algehele effect is slim en visueel interessant.
Om de stemming in te stellen
Handgetekende ontwerpelementen krijgen vaak een lichtere, meer speelse toon. Ze kunnen dit type sfeer aan bijna elk project geven en hoe meer handgetekende elementen u gebruikt, hoe lichter het project zal verschijnen.
Signs for Science is een goed voorbeeld van hoe je een ontwerp met handgetekende elementen kunt verpakken voor een leuke, bijna kinderlijke esthetiek (kleur draagt ook bij). Van de typografie tot iconen tot kronkelende onderstrepingen, het hele concept heeft een heel specifieke sfeer. Het is creatief, licht en stimuleert gebruikersinteractie.
Laat creativiteit zien
Een handgetekend ontwerpconcept kan een geweldige kans zijn voor het ontwerpen van een portfolio-website omdat het de nadruk kan leggen op creativiteit. Deze elementen leggen meer de nadruk op het ontwerpproces en hoe de gedachte en het werk dat in een project kan gaan.
(Bovendien is het een leuke manier om die creatieve spieren te strekken.)
The Feebles gebruikt handgetekende elementen voor de hoofdafbeelding op de bovenstaande manier en combineert met het handgetekende logo linksboven. (Je mist het misschien als je niet goed kijkt.)
Voor pictogrammen of logo's
Omdat dit een van de meest populaire toepassingen is van handgetekende elementen, stond het niet bovenaan de lijst. (Meestal om u te helpen andere ideeën te bedenken voordat u overgaat op iets wat vaker voorkomt.)
Handgetekende aanrakingen kunnen een geweldige aanvulling zijn op een pictogram of logo. Van kronkels tot niet-gecentreerde vormen of cirkels die niet helemaal rond zijn, imperfectie voegt karakter en charme toe waar de perfecte computer-vormstijlen dat niet kunnen.
Higher Ground gebruikt de kronkel om letters in het pictogramstijllogo te scheiden. De minimalistische stijl is opvallend en effectief en het handgetekende element geeft het een persoonlijkheid die een rechte lijn niet zou overbrengen.
Als geanimeerde effecten
Breng een handgetekend element tot leven met animatie.
Afbeeldingen die op het scherm zijn getekend, kunnen leuk zijn om naar te kijken en te bekijken. Hoewel het voor de hand liggende voordeel voor de gebruiker is dat ze iets tot leven zien komen, zijn er ook voordelen voor de eigenaar van de website: meer tijd op de site en meer conversies.
Long Story Short gebruikt dit concept op de homepage. Eerst het logo tekenen, dat een handgetekende typografische stijl gebruikt. En het vervolgens animeren in een pakket ontwerpprojecten, die snel bewegen en meerdere handtekeningen in het proces bevatten. De hele lus duurt maar een paar seconden.
Gevolgtrekking
Zelfs als u niet kunt tekenen, kan het simuleren van handgetekende elementen in ontwerpprojecten een persoonlijk tintje toevoegen dat gebruikers op prijs stellen. Van typografie tot games tot het laden van animaties, deze elementen kunnen creativiteit en persoonlijkheid laten zien.
Hoewel een met de hand getekend element niet voor elk project geschikt is, moet u er de volgende keer over nadenken als u de stemming wilt verlichten of iets wilt toevoegen om gebruikers vast te houden. Houd het idee simpel en verbind het met een thema dat door het hele ontwerp heen loopt. En heb plezier! Dat is waar deze elementen over gaan.
