![4 Inspirerende ontwerppatronen voor formulieren [GRATIS].](/cdn-cgi/image/width=1024,quality=83,format=auto/api/_files/skUfFRwsVbubAsUUd7xwq7/download/)
Uit een onderzoek van HubSpot bleek dat 82% van de respondenten aangaf een website te hebben verlaten vanwege slechte of onvolledige formulieren en dat 93% van die mensen die formulieren voor het eerst tegenkwam op desktopcomputers.
Formulieren zijn een essentieel onderdeel van uw website en bedrijf, of u nu een enquête houdt, potentiële klanten een middel biedt om contact met u op te nemen of aanmeldingen voor een nieuwsbrief aanmoedigt. Er zijn veel manieren om een goed uitziend en effectief webformulier te maken, maar er is altijd ruimte voor verbetering. Formulieren hoeven niet saai te zijn.
4 inspirerende ontwerppatronen voor formulieren [GRATIS].
Een goed ontworpen formulier voegt waarde toe aan het hele ontwerp zonder afbreuk te doen aan het nut ervan. Bovendien presteren zulke formulieren een stuk beter. In het nieuwe UI-ontwerpraamwerk van Salesforce, Lightning, kunnen kleine wijzigingen in het formulierontwerp de formulierconversie verbeteren. Laten we hier eens in duiken.
Vakloze formulieren
Vakloze webformulieren zijn webformulieren zonder zichtbare vakken of randen. Het maakt webformulieren eigentijdser en moderner omdat ze niet het traditionele uiterlijk hebben van webformulieren met kaders eromheen. Traditionele webformulieren met kaders eromheen kunnen als gedateerd worden ervaren.
Gebogen webformulieren maken gebruik van gebogen lijnen en hoeken om interesse te wekken. Krommingen zijn te vinden in de vormen en de lay-outs. Goed ontworpen gebogen vakken hoeven niet noodzakelijkerwijs de traditionele doosvormige ontwerpen te volgen. Indien goed uitgevoerd, kunnen curven zelfs het oog rond het hele webformulier leiden, waarbij spanning wordt toegevoegd tussen negatieve en positieve ruimte. Het voegt veel visuele aantrekkingskracht toe en kan een saai ogend webformulier spannender en boeiender maken.
Geanimeerde formulieren
Geanimeerde formulieren worden ontworpen met enige animatie in het formulier zelf. Dit kan op veel verschillende niveaus, van eenvoudige animaties die de aandacht trekken (zoals stuiterende pijlen en knoppen) tot meer complexe en uitgebreide ontwerpen die het beste van geanimeerd webdesign naar voren brengen, zoals achtergrondanimaties of overgangen tussen pagina's. Het voornaamste doel van het gebruik van dergelijke geanimeerde effecten is uw gebruikerservaring zo aantrekkelijk mogelijk te maken - iets waarvan we allemaal weten dat gebruikers worstelen met die vervelende websiteformulieren!
Inschuiven vanaf de onderkant of zijkant
Met deze webflow-sjabloon kunnen gebruikers op elk moment een contactformulier indienen zonder afbreuk te doen aan het algehele uiterlijk. U kunt consumenten in staat stellen contact met u op te nemen wanneer ze daar klaar voor zijn door een contactknop toe te voegen aan de onderkant van de site.
U kunt ook een uitschuifbaar menu gebruiken om mensen toegang te geven tot uw formulier. In plaats van bezoekers naar een contactpagina te sturen, trekt u het formulier in vanaf de zijkant van het scherm. Dit is een uitstekend patroon voor gevallen waarin iemand informatie op de site wil opzoeken terwijl hij assisteert.
Formulier op volledig scherm
Een goede techniek om de aandacht op uw formulier te vestigen is afleiding te elimineren. In plaats van uw formulier te proppen op een reeds bezette plaats op uw website (zoals de voettekst), kunt u proberen een aangrijpingspunt in te bouwen om het formulier schermvullend te maken. Het helpt uw gebruiker om de gewenste informatie op een gemakkelijke en gerichte manier in te voeren, waardoor het voor hen gemakkelijker wordt om het formulier in te vullen.
Formulieren in natuurlijke taal
Als webformulieren konden praten, zouden ze zo klinken: "U staat op het punt uw informatie in te dienen. Weet u het zeker? Het is verplicht." Formulieren op het web zijn niet altijd zo eenvoudig als we zouden willen. Tegenwoordig verwachten we dat webervaringen en gebruikersinterfaces menselijker en vertrouwder zijn; interactie met een webpagina moet bijvoorbeeld meer aanvoelen als praten dan als typen. Invoer in natuurlijke taal is een van die manieren waarop we webformulieren spraakzamer kunnen maken - dat wil zeggen, niet zomaar een stuk geschreven tekst dat moet worden ingevuld. Een interface in natuurlijke taal helpt gebruikers door vragen te stellen zodat mensen vragen stellen. Het stelt je in staat een conversationele context te creëren en tegelijkertijd misverstanden te verminderen door gebruik te maken van het conventionele formulierlabel en invoervakpatroon. Het voelt ook uniek en goed ontworpen aan.
Ontwerp van stapsgewijze (procedurele) formulieren
Met een stapsgewijs formulierontwerp kunt u informatie opdelen in verteerbare delen die gemakkelijk te volgen zijn. Hier krijgt de gebruiker visuele aanwijzingen om elk veld in te vullen.
Deze webpagina heeft een duidelijk pad voor gebruikers door de stappen van het webformulier, met zowel kopjes als visuele aanwijzingen die hen op weg helpen. Het gebruik van dit formulierpatroon maakt het gemakkelijker voor mensen die misschien aarzelen om hun informatie online te geven.
Door mensen informatie te laten toevoegen in gemakkelijk te begrijpen brokjes wordt de voortgang bevorderd en wordt een gerichtere ervaring geboden dan wanneer alle velden in één keer worden weergegeven.
In sommige gevallen volstaat een enkele klik op een knop. Maar soms zult u willen weergeven hoeveel stappen nodig zijn om het formulier in te vullen, zodat een gebruiker niet verdwaalt tijdens de hele procedure.
Conclusies
Het web is tweerichtingsverkeer, en we moeten waardevolle webinhoud creëren voor gebruikers en hen betrokken houden met een boeiend ontwerp van webformulieren. Formulieren vormen een integraal onderdeel van de surfervaring op het web, dus waarom niet wat extra tijd besteden aan het nadenken over hoe u uw webformulieren zo aantrekkelijk mogelijk kunt maken? Door over deze patronen na te denken en onze webformulierontwerpen een menselijker tintje te geven, kunnen we helpen het aantal afvallers te verminderen en een betere betrokkenheid met minder verwarring bevorderen.
