do. sep 29th, 2022


Een mockup is een visuele presentatie van een website of app. Ontwerpers gebruiken vaak mockups om de lay-out en functionaliteit van hun website aan potentiële klanten te tonen.

Hoewel wireframes en prototypes low-fidelity-formaten zijn, zijn mockups intuïtiever. Ze helpen klanten visualiseren hoe het eindproduct eruit zal zien, aanvoelen en werken.

Mockups helpen ook ambiguïteit met betrekking tot de verwachtingen van de klant weg te nemen. Klanten kunnen hiaten op de website detecteren door naar de mockup te kijken en vroege herzieningen van het product voorstellen. Door voor elke iteratie mockups te gebruiken, kunnen ontwerpers een eindproduct maken dat voldoet aan de eisen van de klant. Dit betekent dat een mockup uw website letterlijk kan maken of breken.

In dit artikel zullen we het hebben over websites en tools om briljante mockups te genereren. Ik zal de opvallende kenmerken en prijsdetails van elke tool schetsen, zodat je alle tools in één oogopslag kunt vergelijken en je beste pasvorm kunt kiezen.


12 van de beste sites om mockups te genereren:


Wat zijn de beste sites voor het genereren van mockups?

Of u nu op zoek bent naar een grafische mockup-maker of een gecodeerde, er zijn verschillende tools beschikbaar op de markt. In feite zijn de keuzes genoeg om zelfs een doorgewinterde ontwerper te verbazen.

Om uw keuzes te verfijnen, hebben we 12 geweldige tools geïdentificeerd nadat we veel parameters hebben overwogen, zoals betaalbaarheid en gebruiksgemak.

Als je een tool nodig hebt die mockups kan genereren voor een reeks producten, dan is Adobe XD ideaal voor jou. Het helpt je bij het maken van ontwerpen voor websites, apps, videogames, spraakinterfaces en meer.

Dankzij de mogelijkheid tot co-editing kunnen multifunctionele teams samenwerken aan projecten. Van wireframes tot visuele interfaces, de tool is in staat om ontwerpen met verschillende diepte en details te creëren. Hiermee kunt u gedetailleerde details van uw ontwerp bekijken, inclusief rasters, kleurcontrast en typografie.

Prijzen:

De gratis editie bevat één actieve ontwerpspecificatie en prototype, 2 GB cloudopslag en beperkte Adobe Fonts. Als je meer functies en opslagruimte nodig hebt, kun je kiezen voor de Single App-editie die $ 9,99 per maand kost.


Met 200 componenten en 3.000 iconen is Mockplus de mockuptool van elke ontwerper. De What You See Is What You Get (WYSIWYG) -editor is eenvoudig te gebruiken met slepen-en-neerzetten-functionaliteit.

Het beste van Mockplus is dat je je mockup direct kunt testen op de apparaten van je keuze. De tool genereert voor elk project een QR-code, die kan worden gescand vanaf het mobiele hostapparaat. De mockup wordt binnen enkele minuten op het apparaat weergegeven. Het is bijna net zo eenvoudig als een foto maken met uw mobiele telefoon!

Prijzen:

Als je een solo-ontwerper of een klein team bent, is Mockup de perfecte tool voor jou. Het staat maximaal 5 projecten toe in zijn gratis abonnement. Voor grotere teams is het Team-abonnement, dat $ 9 per maand kost, goed. Voor deze prijs kun je onbeperkt projecten ontwerpen en rollen en machtigingen voor verschillende teamleden definiëren.


Moqups is een webgebaseerd platform dat u kan helpen bij het genereren van mockups voor mobiele apps, websites en video-interfaces. In één enkel platform kunt u wireframes, visuele ontwerpen en prototypes ontwerpen.

U krijgt kant-en-klare stencils, widgets en slimme vormen om in uw mockups op te nemen. U kunt ook aangepaste afbeeldingen importeren vanuit de cloud of uw lokale systeem. Beheer meerdere pagina’s efficiënt en bewerk objecten nauwkeurig om een ​​mockup te maken die tot op de pixel perfect is.

Prijzen:

Hun voordeligste abonnement is het Pro-abonnement, dat $ 20 per maand kost. U kunt maximaal 100 stoelen in dit abonnement kopen voor $ 3 per stoel.


Zoals de naam al doet vermoeden, kunt u met Fluid UI snel prototypes van uw project maken. Met deze tool kun je schaalbare en levensechte mockups genereren.

De ingebouwde componentenbibliotheek heeft meer dan 2.000 items. U krijgt speciale bibliotheken voor Material Design-, iOS- en Mac-systemen. U kunt ontwerpen van uw systeem uploaden om ook aangepaste bibliotheken te maken.

Interactieve mockups zijn in de mode. Met FluidUI kunt u muisacties, animaties en links aan uw ontwerp toevoegen om ze bijna perfect en boeiend te maken.

Prijzen:

Het Solo-abonnement kost $ 8,25 per maand, inclusief alle ingebouwde bibliotheken, 5 projecten en testen op het apparaat. Als u een licentie voor meerdere gebruikers wilt, kiest u voor het Pro-abonnement dat $ 19,08 per maand kost.


Breng je ontwerpen tot leven door levensechte mockups te maken met de Marvel-app. U krijgt een groot aantal ontwerp- en prototyping-tools in uw pakket. Je kunt niet alleen geweldige mockups ontwerpen, maar je kunt ze ook door de gebruiker testen.

De tool genereert automatische ontwerpspecificaties, zodat de ontwerpoverdracht soepel en pijnloos verloopt. Het beste van deze tool is dat het integratie met een aantal tools zoals Slack en Sketch mogelijk maakt. U kunt dus tegelijkertijd uw workflows ontwerpen en versterken.

Prijzen:

Het gratis abonnement is voor één gebruiker en beperkt tot één project. Een betere deal zou het Pro-plan zijn waarmee je onbeperkte projecten kunt maken voor $ 12 per maand. Als je teams met meerdere gebruikers hebt, ga dan voor de Team- of Team Plus-abonnementen.


Balsamiq is een van de meest populaire tools om interactieve mockups te maken. Met de kenmerkende handgetekende mockups kunt u de brede UI-elementen van uw ontwerp duidelijk weergeven.

U krijgt herbruikbare bibliotheken met drop-in componenten. Omdat de tool cloud-aangedreven is, krijg je geweldige offline ondersteuning en platformonafhankelijke functionaliteit. De desktopversie is gebruiksvriendelijk en intuïtief.

Prijzen:

Balsamiq-abonnementen worden in rekening gebracht op basis van cloudopslag. Alle plannen worden geleverd met een gratis proefperiode van 30 dagen, onbeperkte proefversies en gebruikers. Na de proefperiode kunt u plannen kopen op basis van het aantal projecten dat u wilt ontwikkelen.


Een andere webgebaseerde mockup-generator, Mockingbird, is gemaakt voor snelle prototyping. Met de editor voor slepen en neerzetten kunt u binnen enkele minuten van het ontwerpbord naar de mockup gaan.

Een opvallend kenmerk van deze tool is dat je meerdere mockups kunt koppelen, zodat je kunt zien hoe een live website of app zal werken. Met de samenwerkingstool kunnen verspreide teams naadloos samenwerken aan ontwerpen.

Prijzen:

Net als de andere tools in deze categorie, variëren de kosten van Mockinbird met het aantal projecten. Het goedkoopste abonnement kost $ 12 per maand en laat je 3 projecten maken. U kunt zich ook aanmelden voor een gratis proefperiode voordat u de tool koopt.


Of het nu gaat om websites of mobiele apps, Mockup Builder is de perfecte mockup-generator die er is. Het heeft alle basisfuncties plus enkele geavanceerde. Voor de prijs is het een extreem zakvriendelijke optie, vooral als je simplistische interfaces wilt bouwen.

Zodra u een visueel aantrekkelijke mockup hebt gemaakt met behulp van de componentrepository van de tool, kunt u uw project exporteren in PNG- of PDF-indeling. Eenvoudig delen houdt alle leden van het ontwerpteam op één lijn.

Prijzen:

Mockup Builder is een van de meest betaalbare tools in onze line-up. Voor slechts $ 63 per jaar kun je mockups bouwen voor één project met 3 reviewers en 15 schermen.


HotGloo wordt geleverd met een gebruiksvriendelijke interface en uitgebreide documentatie en tutorials om beginners te helpen. Het is geoptimaliseerd voor mobiel, wat betekent dat u uw ontwerpen overal en altijd kunt ontwerpen, beoordelen en testen.

De full-stack tool heeft een bibliotheek van 2.000 widgets en componenten, waardoor het een van de meest uitgebreide tools op deze lijst is.

Prijzen:

Alle plannen worden geleverd met een gratis proefperiode van 7 dagen. U krijgt de beste waarde met het TEAM-abonnement dat $ 27 per maand kost. Voor dit bedrag kunnen 10 gebruikers tot 10 projecten aanmaken met de tool.


Met InVision is het schrijven en delen van mockups een gemakkelijke taak. U krijgt volledige controle over de gedetailleerde details van uw project. De samenwerkingsfunctie helpt de beoordelingscycli te verkorten, aangezien auteurs en recensenten altijd op één lijn zitten.

Een van de beste onderdelen van InVision is de 30.000 sterke community van ontwerpers. Je kunt brainstormen en ontwerpideeën uitwisselen met andere ontwerpers.

Prijzen:

Met het GRATIS abonnement kun je een prototype voor altijd gratis maken. Alle abonnementen zijn inclusief dagelijkse gegevensback-ups en versleuteling.


Als u geweldige mockups voor uw mobiele apps wilt maken, moet u voor deze tool kiezen. Het is compatibel met Android- en iOS-platforms. De mockups worden goed weergegeven op de meeste mobiele apparaten.

De webplayer biedt u een realtime weergave van de werking en het uiterlijk van uw mobiele app, compleet met navigatie en lay-out. De samenwerkingsfuncties van de tool zijn vergelijkbaar met de beste.

Prijzen:

Wat Proto.io onderscheidt van hun concurrenten, is dat ze onbeperkte functies bieden in alle plannen. Daarnaast hebben ze speciale plannen voor scholen en non-profitorganisaties.


Origami Studio, oorspronkelijk gemaakt door Facebook, is een geweldige tool om mockups en prototypes te bouwen. U kunt gebruikmaken van de uitgebreide componentenbibliotheek en presentaties op volledig scherm.

U kunt Photoshop- en Sketch-ontwerpen importeren en eraan werken. Het heeft echter beperkte beoordelings- en commentaarmogelijkheden, wat samenwerking een beetje moeilijk maakt.

Prijzen:

Het is gratis.


Conclusie

Als het gaat om het kiezen van de beste site om mockups te genereren, geef dan altijd prioriteit aan gebruiksgemak, samenwerking en betrouwbaarheid. De meeste tools die in dit artikel worden behandeld, voldoen aan deze voorwaarden. U kunt zich aanmelden voor een gratis proefversie van een aantal tools en hun prestaties vergelijken voordat u een definitieve aankoopbeslissing neemt.

Door admin

Geef een antwoord

Het e-mailadres wordt niet gepubliceerd.