5 fremragende værktøjer til at oprette UI mockups til websites og apps

Vi anbefaler: Programmet for korrektion af fejl, optimere og fremskynde Windows.

Uanset om du vil designe en mobilapp, Desktop-software eller simpelthen forsøge at designe et websted ved at oprette UI Mockups, kan du få de første visuelle billeder af dine fremtidige projekter og også præsentere design ideen til kunden på en bedre måde.

Oprettelse af UI Mockups er anderledes end Wireframing. Wireframing er som at skabe en blueprint for dit hus eller ingeniørprojekt, mens oprettelsen af ​​en Mockup kommer op med det faktiske kreative design (endelige udseende) af huset til kunderne.

At have adgang til et praktisk Mockup værktøj hjælper dig i UI design fase og også fremskynde hele processen.

Der er ingen mangel på UI Mockup værktøjer; Men med så mange muligheder at vælge imellem kan det blive forvirrende, hvad der er en, du skal begynde at bruge først.

Uanset om du er professionel på udkig efter at tilføje flere elværktøjer til hans nuværende arsenal, eller en nybegynder forsøger at hænde på Mockup designe for første gang, vil denne guide introducere dig til nogle af de bedste værktøjer til at oprette UI Mockups i 2019.

Hvad er de bedste værktøjer til at oprette UI mockups?

1

MockFlow

  • Pris - Gratis begrænset / Premium $ 19 månedlig plan - $ 14 per bruger-månedlig årlig plan

MockFlow er en premium cloud-baseret løsning, der tilbyder Wireframe, Prototyping og UI Mockup værktøjer til enkeltpersoner og organisation. Det kommer i både gratis og premium planer og kan også bruges på din pc.

Prissætningen er opdelt mellem årlige og månedlige planer. Sammenlignet med årlige planer er de månedlige planer ikke kun dyre, men går også glip af nogle funktioner. På årlige planer får du ikke bare en rimelig rabat, men får også 3 måneders gratis service, offline adgang og power-ups.

For at bruge værktøjet skal du tilmelde dig med en gratis konto. De gratis konti giver dig mulighed for at oprette et projekt i hver app, to korrekturlæsere pr. Projekt, begrænset udvalg af apps og ingen support. Den gratis konto giver dog en rimelig ide om brugen af ​​MockFlow.

MockFlow tilbyder offline adgang til Windows og Mac OS kørende computere. MockFlow-udvidelserne giver dig mulighed for at bruge værktøjet med apps som Microsoft Office, Google Chrome, Google Dokumenter, Slack, JIRA og meget mere.

MockFlow har seks grundlæggende funktioner, nemlig WireFrame og UI Mockups, Sitemap, StyleGuide, DesignCollab, Annotate Pro og Website Pro. For at oprette UI Mockups skal du bruge den første WireFrame-option fra instrumentbrættet og klikke på + -ikonet.

Begynd med at vælge den platform, du vil oprette mockup for, f.eks. IOS-enheder, smarte ure, websted, Microsoft-apps osv.

Redigeringspanelet er også delt mellem 6 faner. Fra fanen Element kan du trække og slippe forudformede objekter som Mobil ramme, ikoner, baggrundsbilleder, menu faner, checkout muligheder og mere, eller du kan bare starte fra en tom side, hvis du vil.

Objektene kan tilpasses yderligere med et enkelt dobbeltklik. Du kan gruppere flere elementer sammen for lettere bevægelse og skalering af brugergrænsefladen.

Andre faner i redigeringsprogrammet er sider, for at oprette flere sider for samme app, fanen Billeder, fanebladet Flow for at tilføje og kontrollere status for projekterne, Gem og Opstart-fanen for at tilføje flere apps og skabeloner.

MockFlow er et fremragende multifunktionsværktøj til oprettelse af UI Mockups og mere. Imidlertid betyder præmieplanerne, at det er for seriøse brugere, der kan gøre brug af mindst halvdelen af ​​den funktion, den har på tilbud.

Prøv MockFlow

  • Læs også: 10 bedste gratis 3D design software til begyndere og avancerede brugere
2

Balsamiq

  • Pris - Gratis 30 dages prøveversion / Online version starter ved $ 9 per måned / Offline version starter ved $ 89 evigvarende licens

Balsamiq er en moderne skybaseret løsning til UI-designere og -udviklere, der tilbyder en hurtig, tilgængelig, samarbejdsvillig wireframing. Hvis du foretrækker en offline-løsning, fik Balsamiq det også dækket.

Balsamiq tilbyder to versioner af værktøjet, online og offline desktop app til Mac og Windows-computere. Offline-versionen er et engangskøb, der koster $ 89 for en enkelt bruger. Online versionen starter ved $ 9 pr. Måned pr. Bruger med plads til to projekter.

Heldigvis kan du tilmelde dig gratis og bruge webapplikationen i 30 dage gratis med ubegrænsede wireframes og ubegrænsede brugere på tilbud.

Tilmelding til gratis prøvekontoen er let, men kræver, at brugerne bekræfter e-mailen. Når du er færdig, begynder du ved at oprette dit rum og give det et navn. Så fortsæt med at oprette dit første projekt.

Projekteditoren har en meget enkel og brugervenlig grænseflade. Alle egenskaber spredes pænt på værktøjslinjen. Sidene eller Wireframes vises på venstre side, og du kan tilføje flere sider ved at klikke på + -ikonet øverst.

Du kan begynde med at trække og slippe en skabelon til editoren eller starte fra bunden ved hjælp af grundlæggende redigeringsværktøjer. Brug indstillingen Flere kontroller til at søge efter flere skabeloner og ikoner fra biblioteket. Fra desktop applikationer og diagrammer til hardware og layout-brugergrænseflader har Balsamiq-biblioteket alt hvad du behøver for at skabe en Mockup og Wireframes med lethed.

For at ændre objektegenskaberne skal du vælge objektet, og de relevante indstillinger vises i højre rude.

Udviklerne kan invitere klienter til at lave en præsentation ved at sende et link via e-mail. Du kan også tilføje dine teammedlemmer til projektet og tildele hver enkelt medarbejder en rolle.

Derudover tilbyder Balsamiq også integration med forretningsapps som Google Drive, Confluence og Jira. UI-designressourcerne på hjemmesiden er nyttige for både erfarne og nybegyndere.

Balsamiq er et fremragende værktøj og med offline og online software suite er det utvivlsomt en af ​​de bedste i branchen. Kombiner det med gratis 30 dages gratis prøveperiode, og du får nok tid til at vurdere værktøjet, før du køber.

Prøv Balsamiq

  • Læs også: 8 fantastiske software til at oprette hæfter og styre marketingspil
3

MockPlus

  • Pris - Gratis prøveperiode / $ 59 om året Individuel licens / $ 199 evig licens / Team plan starter på $ 299 pr. År

For dem der søger et fleksibelt værktøj til at skabe mockups og prototyper til hver skærmstørrelse og platform, er MockPlus et godt valg. Det er en offline-applikation og er tilgængelig til Windows, Mac, Android og iOS-enheder.

MockPlus bruges af nogle af de førende navne i teknologibranchen, herunder Microsoft og IBM. Der er en 7-dages gratis prøveperiode for at prøve værktøjet, før du køber.

MockPlus brugergrænsefladen er godt indrettet og ser moderne ud. Det giver en god plads og rummer ikke arbejdsområdet med unødvendige værktøjer. Det har også en multi-vindue mulighed for at bruge softwaren i flere vinduer for bedre produktivitet.

Du kan nemt opbygge interaktive prototyper ved blot at trække og droppe prædesignede komponenter til editoren. Biblioteket er udstyret med over 3000 ikoner og næsten 200 forudindrettede komponenter for at komme i gang med alle understøttende træk-og-slip-funktionalitet.

Prototyperne kan testes straks ved hjælp af QR-koden genereret af appen. Derudover kan projekterne udgives på internettet for at få kommentarer fra kunder og teammedlemmer ved at dele et weblink til prototypen.

MockPlus udmærker sig ved hvad det gør, og funktionerne og funktionerne i denne prototypesoftware gør det til et ideelt værktøj til UI og UX-designere uanset deres ekspertise.

Download MockPlus

  • Læs også: 9 feature-rich software til at skabe interaktive tidslinjer på pc
4

Moqups

  • Pris - Gratis prøveversion / starter på $ 19 per måned - Personlig plan

Moqups er en skybaseret webapp, der giver dig mulighed for at oprette wireframes, mockups, diagrammer og prototyper og samarbejde i realtid med andre teammedlemmer.

Det er et premium værktøj med personlige og holdkonti. Den gratis prøveperiode kræver, at du registrerer en konto og tilbyder 5 MB lagerplads med et projekt begrænset til 300 objekter.

Brugergrænsefladen ligner MockFlow, men værktøjerne og layoutet er forskellige. Når du har lavet et nyt projekt, kan du trække og slippe elementer fra fanen Stencil.

Du kan tilføje flere sider til projektet, tilpasse konturer, oprette skabeloner, uploade og tilføje billeder, gennemse fra det store bibliotek med ikoner og tilføje kommentarer til projektet.

Objekterne kan redigeres for at ændre størrelse, rotere, justere og style. Grupperingsfunktionen gør det nemt at gruppere flere objekter for lettere bevægelse.

Når Mockup er klar, kan du eksportere til Google Drev, Dropbox eller din computers lokale PNG-, PDF- eller HTML-format.

Moqups er et nemt at bruge værktøj til wireframing og til at lave diagrammer og mockups på ingen tid. Tilmeld dig den gratis konto og tag værktøjet til et spin for at se, om det er noget, der opfylder dit krav.

Prøv Moqups

Konklusion

Uanset om du er en professionel brugergrænseflade designer eller bare en nybegynder, ved at vide, hvilke værktøjer der skal bruges til at oprette UI Mockups er vigtigt. Hvis du leder efter et wireframing værktøj, så vil jeg anbefale dig at prøve Wireframes.cc.

Det er en web-baseret app med minimalistisk design og en håndfuld funktioner til at skabe enkle og effektive wireframes til apps eller hjemmesider. Efter alt er det ikke altid bedre.

Men for UX / UI-designer, der leder efter funktionsrige Mockup-værktøjer, bør du prøve alle ovenstående anbefalede værktøjer. Alle disse værktøjer tilbyder en gratis prøveversion eller en grundlæggende gratis konto uden nogen begrænsninger for at komme i gang.

Du kan bruge lidt tid med hvert af disse værktøjer, før du beslutter dig for den, der kontrollerer de fleste kasser i din must-have liste.

At vide, at ikke et værktøj nogensinde vil kunne imødekomme alles behov, vi forsøgte at medtage de bedste værktøjer til at oprette UI Mockups, der kan imødekomme de fleste designers behov.

Lad os kende din yndlings mockup- og wireframing-software, eller hvis du mener, at vi har udelukket et værdigt alternativ i denne liste i kommentarerne nedenfor.

Anbefalet

Løs: Wmiprvse.exe-problemer på Windows 10
2019
Sådan repareres Windows 10 opdateringsfejl 0xca00a000 i 7 nemme trin
2019
FIX: Min Windows-computer undlader at genkende min iPod
2019