Essentiële ontwerptrends, juni 2016
Ontwerpers veranderen de regels voor webdesign, dankzij creatieve probleemoplossing. Geluid automatisch afspelen, echte en geïllustreerde afbeeldingen mengen en zelfs gelaagdheid van logo's bovenop foto's zijn enkele van de heetste ontwerptechnieken op dit moment en alle drie concepten werden niet zo lang geleden als taboe beschouwd.
Dit is de trend in het ontwerp van deze maand:
1. Geluid automatisch afspelen
Nog niet zo lang geleden was het niet de bedoeling om geluid op uw website op te nemen, tenzij dit optioneel was. En je zou zeker niet de auto-play route gaan.
Die tafels zijn veranderd! Wat ooit een bandbreedte hogging, opdringerige ontwerpfunctie is steeds vrij alledaags.
Geluid wordt vooral gebruikt voor een aantal verschillende websitetypen - voor media-gerelateerde inhoud zoals muziek, films of nieuws en voor game- of verhaallijn-typeontwerpen. De truc om geluid te gebruiken, is dat het een aan / uitknop moet bevatten voor gebruikers die nog steeds stil willen communiceren met een website.
Geluid is dat het gebruikers niet zou schokken. Veel sites, zoals Dit was de telefoon van Louise , die automatisch afspelen gebruiken, gebruiken een buffer van soorten om aan te geven dat geluid wordt geladen. Combineer deze laadactie met een tuimelschakelaar en gebruikers kunnen bepalen of geluid voor hen is of niet voordat de site de eerste ruis maakt.
Een andere truc als het gaat om het gebruik van geluid is om zachtjes te starten. Je wilt niet dat gebruikers uit hun stoelen springen omdat je ontwerp opent met een zware metalen breuk. Alles klinkt in de eerste paar seconden van bijna een gefluister tot volledig volume.
Ten slotte is het belangrijk dat geluid (met name wanneer het automatisch wordt afgespeeld) een essentieel onderdeel is van de inhoud die bijdraagt aan de algehele gebruikerservaring. Gebruik geen geluid alleen maar omdat u iets nieuws wilt proberen; gebruik het met doel. Houd hier ook rekening mee - zelfs met geluid als onderdeel van het ontwerp hebben veel gebruikers zonder inhoud toegang tot de inhoud. Ontwerp verstandig.
2. Mixen van foto's en illustratie
Het kan een moeilijke techniek zijn om van te maken, maar de grens tussen fotografie en illustratie is overschreden. Het mengen van echte en met de hand getekende elementen kan een vleugje eigenzinnigheid toevoegen aan een project dat zowel leuk als visueel intrigerend is.
Doe het zonder cheesy te zijn om een blijvende impact op gebruikers te hebben. Hier zijn een paar suggesties:
- Gebruik illustraties voor pictogrammen en knoppen en fotografie voor een dominante visuele impact
- Maak een visueel patroon dat voornamelijk illustratie gebruikt, maar voeg in korte video- of afbeeldingsgebieden toe om te benadrukken
- Voeg geanimeerde geïllustreerde elementen toe voor een vleugje van iets anders in de buurt van foto's
- Maak een badge of logo dat is geïllustreerd om te gebruiken met merkfoto's of op verpakkingen die in merkafbeeldingen worden weergegeven
- Gebruik illustratie om gebruikers door andere visuals te leiden en een verhaal te vertellen
Taylor gemaakt is een goed voorbeeld van deze mix-en-match benadering van fotografie en illustratie. Een financieel planningsbedrijf is geen plaats waar je zou verwachten deze techniek in actie te vinden, maar het is effectief. Geanimeerde illustraties op de achtergrond van foto's van mensen voegen belang toe aan wat anders een saaie headshot zou kunnen zijn. De geanimeerde hover-statistieken trekken de aandacht van gebruikers en moedigen het scrollen aan. Nog meer illustraties worden gebruikt in de iconografie van de site om klikken te stimuleren en visuele flair toe te voegen aan tekstzware delen van het ontwerp.
3. Badges bovenop hero images
Badges zijn overal waar je nu naar toe gaat. Van logo-ontwerp tot vintage retro-typografiestijlen die als hippe favorieten kunnen worden bestempeld, deze eenvoudige elementen zijn een vast onderdeel geworden van minimale ontwerpstijlen. Ze zijn ook een veel voorkomende optie voor ontwerpen die mogelijk ontbreken in de fotografie.
Dat is aan het veranderen, want meer ontwerpers gebruiken badges met stellaire fotografie in hero images. De trend wordt geïllustreerd door een enkele hero-afbeelding (meestal geen schuifregelaar) met bovenaan een witte of semitransparante badge. Badges zijn vaak horizontaal en verticaal gecentreerd, hoewel plaatsingen kunnen variëren.
Het is een opvallend contrast tussen foto's en logo's (of tekst). Wat dit werk doet is dat de grote afbeelding gebruikers binnenhaalt. De badge dient als een focuspunt voor wat vaak een enigszins zwak of los beeld is. (Dat wil niet zeggen dat de afbeeldingen die in dit soort stijl worden gebruikt slecht zijn, maar ze profiteren wel van een badge.)
Deze trend is een evolutie van iets dat we een tijdje hebben gezien met headers voor hero-afbeeldingen. Overdadige, gedurfde typografische keuzes waren de rage vorig jaar. Dit is een natuurlijke verschuiving vanwege de populariteit van badge-stijlen en gelijkenis tussen hoe grote maten en badges worden gebruikt.
- Beide hebben de neiging om een wit of licht type te zijn
- Beide hebben de neiging om een enkel bericht naar gebruikers te hameren
- Beide werken in ontwerpen die niet veel concurrerende beelden hebben
- Beide zijn gedurfd en gedurfd omdat ze gebruikers slechts een echt punt van binnenkomst bieden
- Beide werken uitzonderlijk goed met stockfotografie
- Beide stijlen bieden een gedurfde visuele oplossing als u niet veel foto-opties hebt
- Beide stijlen lenen zich voor het toevoegen van een vleugje animatie op andere plaatsen (zoals een zweeftekst) om gebruikers te verleiden omdat er niet veel andere bewegende elementen zijn, zoals video of een afbeeldingsschuifregelaar
Wat leuk is aan een goede badge is dat deze ook als merk kan dienen voor dual-duty. (Dit is een geweldige optie voor kleine bedrijven of portfoliosites.) Maak een badge met het idee in gedachten dat dit uw logomark zal zijn. Ontwerp kleur en witte versies om te mixen en matchen, afhankelijk van het gebruik. Deze toegevoegde functionaliteit is nog een reden waarom badges op dit moment zo populair zijn.
Conclusie
Ben je dapper genoeg om auto-play muziek aan je website-ontwerp toe te voegen of echte en geïllustreerde beelden te mengen? Beide trends hebben een element van risico en bieden ruimte voor uitbetaling. Als u nog niet helemaal klaar bent voor deze trends, is het opnemen van een badge op een heldafbeelding iets dat voor bijna elk type ontwerpomtrek kan werken. Je kunt deze aanpassing ook onmiddelijk maken en naar behoefte gebruiken.
Van welke trends hou je nu (of haat)? Ik zou graag enkele van de websites willen zien waar je gefascineerd mee bent. Stuur me een link op Twitter ; Ik hoor graag van je.