Huis Sociale Media Top Webdesigntrends om toe te passen in Edge Animate - dummies

Top Webdesigntrends om toe te passen in Edge Animate - dummies

Inhoudsopgave:

Video: Really Good UX Examples - Design Tool Tuesday, Ep18 2024

Video: Really Good UX Examples - Design Tool Tuesday, Ep18 2024
Anonim

Door Adobe Edge Animate te gebruiken, kunt u alle ontwerptrends maken die hier worden vermeld. De webontwerptrends die hier worden gepresenteerd, vertegenwoordigen grotendeels niet alleen nieuwe coderingstechnieken, maar ook nieuwe manieren waarop uw publiek op boeiende manieren met uw site kan communiceren. Wanneer je de aandacht van je publiek trekt en ze geïntrigeerd raakt in je webontwerp, ben je goed op weg om dat publiek te behouden.

Meer afbeeldingen en illustraties

Ben je moe en verveeld om naar een tekstwand te kijken? Zijn al die kleine afbeeldingen en pictogrammen er een beetje gedateerd uit gaan zien? Maakt een egale achtergrondkleur je gaap? Als je je zo voelt, is de kans groot dat je publiek hetzelfde voelt.

Door meer afbeeldingen en illustraties aan uw site toe te voegen, kunt u uw webontwerp aanzienlijk verbeteren. Voeg een subtiele achtergrond toe in plaats van een witte, grijze of zwarte achtergrond om uw site er actueler uit te laten zien.

U kunt eenvoudig afbeeldingen importeren voor gebruik met uw Animate-compositie en hoe u ermee kunt werken. Ontdek hoe u afbeeldingen op de achtergrond gebruikt en het verschil tussen het gebruik van een div-tag en een img-tag voor de afbeeldingen. U kunt lay-outpresets voor uw afbeeldingen instellen.

Horizontaal scrollen

Het maken van webontwerpen met horizontaal scrollen kan wat moed kosten - het is zelden gedaan - maar dat betekent nog niet dat dit niet eerder is gedaan en met veel effect. Een eenvoudige zoekopdracht op het web naar "geweldige horizontale websites" zal u niet teleurgesteld laten. U zult veel geweldige voorbeelden vinden van kunstsites, galerijen en creatieve sites die horizontaal scrollen gebruiken voor een geweldig effect.

Hoewel dit type navigatie nog relatief nieuw is, kun je door een site op deze manier te maken aan de kop van het pack komen qua modieus webontwerp.

Verticaal scrollen

Het tegenovergestelde van horizontaal scrollen is verticaal scrollen. Verticaal scrollen is al jaren een populaire trend in het webontwerp, het afgelopen jaar of twee is het overdreven sterk overdreven.

Veel sites gebruiken een oneindige verticale scroll-techniek die het publiek op de pagina houdt. Deze eindeloze presentatiestijl is ontworpen om de aandacht van het publiek te houden op een continue zoektocht naar meer inhoud.

Vaste headers

Als u besluit een geanimeerde webpagina te maken met behulp van de oneindige verticale scroll-methode, dan wilt u misschien overwegen om een ​​ vaste header aan uw site toe te voegen. Een vaste koptekst is een navigatiemenu dat bovenaan de pagina staat en het blijft zichtbaar terwijl uw doelgroep de pagina afrolt.

Met deze functie kan uw doelgroep snel navigeren van de plaats naar een ander gedeelte van uw site - en altijd weten waar ze zich bevinden.

Een vaste koptekst is een gemak dat uw publiek kan waarderen, omdat ze niet helemaal terug hoeven te scrollen naar de bovenkant van de pagina om het menu te vinden. Functies die het gebruikersgemak in gedachten houden, zullen uw publiek ook voor langere tijd op uw site houden.

Creatieve navigatie

Creatief werken met uw navigatie is netjes complementair aan het gebruik van meer illustraties en afbeeldingen in uw webontwerpen. Gebruik afbeeldingen in plaats van een standaardtekstmenu om een ​​koppeling aan te duiden. Nadat uw gebruikers hebben geleerd dat ze op afbeeldingen kunnen klikken om door uw site te gaan, zullen ze zich meer op hun gemak voelen bij het zoeken naar koppelingen op ongebruikelijke plaatsen op uw site.

Dit soort interactie biedt de mogelijkheid om paaseieren binnen uw site te maken. Een paasei vertegenwoordigt in deze context schijnbaar verborgen inhoud die uw publiek kan verrassen en prikkelen wanneer zij erover struikelen.

Een goede manier om uw doelgroep te laten zien dat een afbeelding of een pictogram een ​​koppeling is, is het kenmerk Cursor te gebruiken in Animate. Wanneer uw publiek de muisaanwijzer over een gekoppelde afbeelding leidt, kan de cursor van een aanwijzer in een hand veranderen, wat een link aangeeft.

Storytelling

Iedereen houdt van een boeiend verhaal. Dus, waarom zou u geen site of animatie ontwerpen die uw publiek een boeiend verhaal vertelt? In plaats van een eenvoudige restaurantwebsite te maken met alleen afbeeldingen van het eten en beschrijvingen van ingrediënten, waarom zou u dan geen fantasierijk achtergrondverhaal creëren?

Voeg niet alleen je beste gerechten toe als lokaal biologisch, boerderij-op-de-grond, duurzame goedheid, maar voeg ook een verhaal toe over het paar dat zich heeft verloofd tussen het hoofdgerecht en het dessert? Je kunt een animatie toevoegen van een ring die in een champagneglas valt, compleet met stijgende bubbels.

sitebezoekers zijn mogelijk op uw restaurantsite op zoek naar een goede maaltijd, maar blijven hier om meer te weten te komen over wat er aan de andere tafels gebeurt. Storytelling website-animaties verbeteren niet alleen de presentatie, ze kunnen ook aansluiten bij de levenservaringen van bezoekers.

Navigeren binnen één pagina

Websites met één pagina - ooit bekend als brochuresites - komen weer terug. Door uw publiek op één pagina te houden die op verschillende pagina's kan lijken, kunt u profiteren van de trend van bladeren.

In plaats van rond te klikken op verschillende pagina's in een poging iets te vinden, kan uw doelgroep in plaats daarvan door uw site scrollen terwijl ze door uw inhoud bladeren. Links die als afbeeldingen fungeren, kunnen uw publiek ook helpen rechtstreeks naar specifieke plaatsen op de site te gaan wanneer ze weten wat ze willen - terwijl ze nog steeds iemand aanspreken die terloops zoekt.

Door een site te maken die in dit gedeelte wordt beschreven, maakt u echt gebruik van een paar actuele webontwerptrends: scrollen naar informatie, meer afbeeldingen gebruiken en creatieve navigatie implementeren …

Afwijken van Flash

Adobe Flash was ooit de golf van de toekomst, maar die golf is op het strand neergestort en er komt een nieuwe golf aan.Waar Flash de belangrijkste tool was voor het maken van animaties en websites, is de hoogtijdagen van die tool aangebroken.

Adobe Edge Animate is misschien niet helemaal klaar om Flash volledig te vervangen, maar het is op weg om precies dat te bereiken. Je kunt Flash immers niet bekijken op i-apparaten zoals iPhones en iPads, en wie wil er content maken die op sommige van de meest populaire mobiele apparaten in de buurt wordt weergegeven?

HTML5, CSS3 en JavaScript

De wereld van webontwerp en coderingstechnieken is voortdurend in ontwikkeling. De grote trend in code is HTML5 en CSS3, die alleen maar meer en meer ingebakken zullen raken in de web-o-sphere. Google Chrome leidt de aanklacht en implementeert de nieuwste standaarden - naast Firefox en Safari.

Dan is er Internet Explorer - momenteel een beetje laat op het feest - maar Microsoft maakt grote vorderingen bij het bijwerken van hun browser om gelijke tred te houden.

Zorg ervoor dat uw animatie niet verbroken wordt weergegeven in oudere versies van Internet Explorer door het Down-Level Stage en de verschillende webpublicatieopties te gebruiken die Edge Animate aanbiedt. In deze optiek kan het gebruik van Adobe Edge Animate als een webontwerptrend zelf worden beschouwd!

Responsive Web Design

Responsive web design (RWD) is tegenwoordig de nieuwste rage. Het concept achter RWD is om een ​​site te ontwerpen voor gebruik op een willekeurig aantal apparaten, van desktopmonitoren tot tablets tot telefoons. Hoewel webontwerpers kunnen worden opgesplitst om een ​​mobiele site apart van een desktopsite te maken, of om een ​​enkele site te maken die kan reageren op de grootte van de browser, is de trend naar het responsieve camp.

De reden hiervoor is vrij eenvoudig: door een responsieve site te maken hoeft u niet twee verschillende sites bij te werken. RWD-punten creëren in de richting van de toekomst; de meer geavanceerde coderingstechnieken en -hulpmiddelen worden, hoe beter ze zullen werken met RWD. Beschouw het als een extra manier waarop Adobe Edge Animate je in de voorhoede van trends in webdesign plaatst.

Top Webdesigntrends om toe te passen in Edge Animate - dummies

Bewerkers keuze

Lagen automatisch aanpassen in Photoshop CS6 - dummies

Lagen automatisch aanpassen in Photoshop CS6 - dummies

De opdracht Auto-mengen in Photoshop Creative Suite 6 helpt om de veelbetekende naden of vreemde kleurinconsistenties die optreden bij het samenvoegen van opnamen met verschillende belichtingen of contrastinstellingen, te verzachten. U kunt ook de opdracht Bestand → Automatiseren → Photomerge gebruiken om afbeeldingen samen te voegen. Tegoed: © iStockphoto. com / Chrisp0 Image # 7310234 U kunt deze opdracht ook gebruiken om een ​​...

Sharp-afbeeldingen vervagen in Photoshop CS6 - dummies

Sharp-afbeeldingen vervagen in Photoshop CS6 - dummies

Mogelijk vindt u een wazig filter in Photoshop CS6 als u een afbeelding hebt die ongewenste korrels bevat (de ruwheid of ruis die wordt toegevoegd door de fotografische film) of een lelijk patroon van halftone dots dat wordt gebruikt in een afgedrukte afbeelding. Mogelijk moet u ook een achtergrond vervagen om de ...

Hoe u uw monitor kalibreert in Photoshop CS6 - dummies

Hoe u uw monitor kalibreert in Photoshop CS6 - dummies

Kalibreren van uw monitor van uw monitor zorgt ervoor dat wanneer u werken in Photoshop CS6, uw monitor geeft geen rode, groene of blauwe colorcasts (sporen van kleur) weer en biedt een zo neutraal mogelijk grijs scherm. Kalibratie zorgt ervoor dat de manier waarop u uw afbeelding vandaag bekijkt, is hoe u uw afbeelding bekijkt ...

Bewerkers keuze

Benader Tragedie met de juiste vragen om geluk te vinden - dummies

Benader Tragedie met de juiste vragen om geluk te vinden - dummies

Voordelen en het resulterende geluk is het resultaat van het stellen van de juiste vragen over de impact van de tragedie op je leven. Het vereist enige introspectie, enige zelfanalyse en een verbinding met je innerlijke zelf. Je moet beslissen of er iets goeds is aan een negatieve leefsituatie - anderen kunnen dat niet doen voor ...

Breng de Me in evenwicht met de We to Have Happy Relationship - dummies

Breng de Me in evenwicht met de We to Have Happy Relationship - dummies

Een gelukkig paar is een waarin de twee partners hun eigen afzonderlijke identiteit behouden terwijl ze samenwerken om de vele uitdagingen van het leven aan te gaan en wederzijdse doelen te bereiken. Dit is soms moeilijk om te doen, maar als je allebei wilt dat het werkt, zal het dat meestal wel doen. Een minister weigerde om het traditionele huwelijksritueel voort te zetten waar de ...

Analyse Verlamming - Dummies

Analyse Verlamming - Dummies

Vermijden als een introvert persoon, je bent een diepzinnige denker en je houdt ervan elke hoek van een probleem te overwegen . En dat is een goede zaak, behalve wanneer het leidt tot analyse-verlamming. Wat is analyse verlamming? Het is wat er gebeurt als je zo wordt meegesleept door elk aspect van een situatie te analyseren dat je niet kunt komen ...

Bewerkers keuze

Elektronica Componenten: Pakketten met geïntegreerde schakeling - dummy's

Elektronica Componenten: Pakketten met geïntegreerde schakeling - dummy's

Geïntegreerde schakelingen (IC's) worden geleverd in een verschillende pakkettypen, maar bijna alle IC's waarmee u in hobby-elektronica zult werken, worden geleverd in een soort pakket genaamd dubbel inline-pakket of DIP. Ja, de zinsnede "DIP-pakket" is overbodig omdat de P in DIP al staat voor pakket, maar de zinsnede "DIP ...

Elektronica Componenten: geïntegreerde schakelingen in schematische diagrammen - dummies

Elektronica Componenten: geïntegreerde schakelingen in schematische diagrammen - dummies

In een elektronisch schema diagram, een geïntegreerde schakeling wordt meestal gewoon als een rechthoek weergegeven met circuitverbindingen die handig rond de rechthoek zijn geplaatst zonder rekening te houden met de fysieke positionering van de pennen. Elke pin-verbinding is gelabeld. U ziet dat de pinnen in dit schema niet in dezelfde volgorde staan ​​als in de ...

Elektronica Componenten: geïntegreerde schakelingen en de wet van Moore - dummies

Elektronica Componenten: geïntegreerde schakelingen en de wet van Moore - dummies

U hebt waarschijnlijk gehoord van de wet van Moore, een elektronisch statement dat in een notendop voorspelt dat het aantal transistors dat op een enkel geïntegreerd circuit kan worden geplaatst ongeveer elke twee jaar verdubbelt. Gordon Moore, een van de oprichters van Intel, stelde eerst zijn voorspelling in 1965. Toen was de voorspelling zelfs nog ambitieuzer. ...