Mockup-websteder, også kendt som online grafikredaktører eller designværktøjer, gør det muligt for brugere at skabe en række grafiske designs, illustrationer, bannere, logoer, præsentationer og mere direkte i en webbrowser uden at skulle installere specialsoftware på deres computer. Disse onlineværktøjer tilbyder normalt en række funktioner og skabeloner, der gør designoprettelsesprocessen nemmere.
I modsætning til prototyper, som faktisk skal fungere, er mockups statiske visuelle elementer beregnet til at vise designlayout, atmosfære, farve og overordnet æstetik. Nogle designere foretrækker at skabe hver eneste knap og ikon fra bunden, men hvis du vil springe videre eller lege rundt for at få inspiration, kommer hjemmesidelayouts og software forudindlæst med disse elementer og kan være nemmere at bruge end grafisk designsoftware.
Webstederne nedenfor hjælper dig med at oprette websiteskærmmodeller, appskærmmodeller, produktmodeller og mere. De fleste kommer med hjemmesidelayoutskabeloner eller UI-sæt, der giver dig mulighed for at designe ved hjælp af forudbyggede elementer såsom knapper. De er store tidsbesparende, hvis du nogensinde kommer i klemme og har brug for at aflevere et layout hurtigt. For hver vil vi analysere prisen, fordele og ulemper, samt hvem de anbefales til.
1. Adobe XD. Hjemmesider til at lave layouts
Adobe XD er Adobe-familiens svar på digital designsoftware. Den har alle de detaljer og nuancer, du ville forvente af firmaet bag Photoshop og Illustrator, men det giver også en lige så høj pris.
Men hvis du leder efter professionelle layouts med alle detaljerne, har Adobe XD dig dækket. Den håndterer hele designprocessen, inklusive interaktive prototyper, og kan endda integreres med anden Adobe-software, hvis du vil oprette eller tilpasse elementer i Photoshop eller Illustrator.
Det er også ret sofistikeret i sine funktioner med 3D-effekter, animationer og muligheden for at skabe et bibliotek af komponenter, et sted at gemme alle dine elementer såsom knapper og ikoner, så dit team kan bruge dem igen på et andet projekt (dette hjælper eksisterende kunder, hvis de ser de samme kontroller på et nyt produkt). Der er også specielle funktioner såsom Repeat Grid, som sparer tid, når du skal kopiere og indsætte et mønster igen og igen, og Padding, som beskytter pixelstørrelser, når du redigerer forskellige lag af de samme elementer.
omkostninger:
- $9,99/måned
- $99,99 om året (forudbetalt)
Fordele: Websites til at lave layouts
- Velegnet til hele designprocessen, inklusive interaktive prototyper
- sofistikerede funktioner: 3D-effekter, animation og komponentbibliotek
- Praktiske tidsbesparende funktioner: indrykning, gentagne mønstre og nem redigering
- Integreres med anden Adobe-software
Ulemper:
- overkill, hvis du bare vil have et enkelt og hurtigt layout
Anbefales til…
- folk, der er seriøse nok omkring digitalt design til at ønske top-tier software
- almindeligt design – nej til engangs- eller individuelle projekter
2. Fluid UI. Hjemmesider til at lave layouts
Selvom det er teknisk til prototyping, Flydende brugergrænseflade er robust nok til at skabe fantastiske mockups, der senere kan konverteres til interaktive prototyper. Dette er et glimrende valg for erfarne designere og designteams, der arbejder med hele omfanget af et projekt.
Den fleksible brugergrænseflade er ikke så brugervenlig som andre populære layoutwebsteder, som måske ikke appellerer til begyndere. Det har dog alle de professionelle funktioner, du har brug for til web- og appdesign, inklusive wireframes og et bibliotek med forudbyggede brugergrænsefladekomponenter og ikoner. En af dens fordele er dens samarbejdsværktøjer, som giver brugerne mulighed for at se, kommentere og redigere de samme filer fra hvor som helst i verden.
omkostninger:
- Gratis plan (1 projekt)
- 8,25 USD/måned (faktureres årligt) [Solo]
- $19,08 per måned (faktureres årligt) [Pro]
- $41,58 per måned (faktureres årligt) [Team]
Fordele: Websites til at lave layouts
- avancerede funktioner velegnet til professionelle
- lidt billigere end lignende mockup-websteder
- førsteklasses samarbejde
- stort indbygget komponentbibliotek
- mobilapps og enhedsskift gøre det nemmere at lave layouts til mobile enheder
Ulemper:
- indlæringskurve
Anbefales til…
- folk, der ønsker et fuldgyldigt designværktøj, men som stadig tager sig af deres budgettet
3. InVision. Hjemmesider til at lave layouts
InVision er en direkte konkurrent til Adobe XD og er endnu et alt-i-et mockup- og prototypeværktøj, også med et dyrt månedligt abonnement. InVision deler mange af de sofistikerede funktioner i Adobe XD, herunder præcise animationsværktøjer til prototyping, men er lidt mindre brugervenlig, når det kommer til effektivitet og strømlining af opgaver.
Det er også værd at bemærke, at InVision primært er et prototypeværktøj, så mange af dets funktioner er fokuseret på interaktivitet og effekter frem for statiske billeder. Den har dog alt, hvad du behøver for at skabe flotte layouts pixel-perfekt, inklusive integration med Photoshop og Sketch, og med den gratis Inspect-tilføjelse kan du nemt transformere ethvert design til udviklerkode. Og oven på det hele er der en evig gratis version.
omkostninger:
- Gratis version
- $7,95 per måned (faktureres årligt)
Fordele: Websites til at lave layouts
- Velegnet til hele designprocessen, inklusive interaktive prototyper
- avancerede funktioner såsom animation og interaktive effekter
- integreres med Photoshop og Sketch
- gratis version
Ulemper:
- brugervenligheden er lidt mere kompleks end Adobe XD
Anbefales til…
- mennesker, der primært har brug for et prototypeværktøj, men med mockup-funktioner
4. Mediemodifikator. Hjemmesider til at lave layouts
Lad os gå væk fra webstedslayout på professionelt niveau... langt væk fra hotellet. Mediemodifikator er i den anden ende af spektret: meget begrænset i funktioner og dybde, men ekstremt praktisk. Du kan Gratis download mockups direkte fra webstedet, men for at fjerne vandmærket og få versioner af høj kvalitet, skal du betale.
Mediamodifier ligner en online fotoeditor, men med forudindlæste app-skabeloner og hjemmesidelayout. De har også tusindvis af skabeloner til mere end bare digitale designs: t-shirts, kaffekrus, bogomslag osv. Alt du skal gøre er at finde en skabelon du kan lide, tilføje dit eget billede og... ja, det er alt hvad du kan gøre. Dette er en simpel hjemmeside med layouts til, når du har brug for noget hurtigt og nemt, men ikke til når du skal imponere nogen med grafik af høj kvalitet.
omkostninger:
- Gratis plan
- $9 per måned (faktureres årligt)
Fordele: Websites til at lave layouts
- let at bruge
- kan oprette layouts på få sekunder
- mange skabeloner at vælge imellem
Ulemper:
- blottede træk
- du skal betale for opløsning af høj kvalitet
- skal betale for at fjerne vandmærker
Anbefales til…
- når du bare har brug for noget enkelt og hurtigt
- du har allerede oprettet et billede, men du skal placere det på din telefon/skrivebords baggrund
- godt udvalg af baggrunde
5. MockFlow
Når vi taler om mockup-websteder, der er velegnede til hele designprocessen, nævner vi ikke rigtig mockups. MockFlow er et af de virkelig alsidige designværktøjer, der vil tage dig fra wireframes, gennem mockups og hele vejen til prototyper.
Ud over wireframing-kapaciteter tilbyder MockFlow også større fleksibilitet med yderligere tilføjelser i MockStore. Der kan du finde "tilbehør" såsom ekstra UI-pakker, yderligere hjemmesidelayoutskabeloner og specielle funktioner såsom brugerpersonas, designsystemer eller oversættere. MockFlow er også kendt for dets lette samarbejde og deling, hvilket gør det til en fantastisk løsning for teams. Hjemmesider til at lave layouts
Omkostninger: Hjemmesider til oprettelse af layouts
- Gratis plan
- 14 USD/måned (faktureres årligt) [Premium]
- 30 USD/måned (faktureres årligt) [TeamPack med 3 brugere]
Teknikere:
- fremragende wireframe-modelleringsevner
- MockStore tilbyder yderligere funktioner
- Bredt udvalg af UI-pakker og skabeloner via MockStore
Ulemper:
- Premium-planen koster mere end anden layoutsoftware, men koster mindre
Anbefales til…
- mennesker, der har brug for yderligere værktøjer såsom designsystemer eller storyboards
- store teams, der har brug for avancerede samarbejdsfunktioner
- simple engangsprojekter, der kan drage fordel af den gratis plan
6. Mockingbird. Hjemmesider til at lave layouts
Mockingbird er en god mellemvej mellem omfattende funktioner og forenklet brugervenlighed (selvom det er vurderet som et avanceret værktøj). Den mest attraktive funktion er den enkle WYSIWYG-editor, hvor du blot trækker og slipper elementer til den ønskede placering. Andre top mockup-websteder har træk-og-slip-editorer, men Mockingbirds brugergrænseflade er så enkel og ligetil, at den tydeligvis er rettet mod begyndere og nybegyndere.
Prisen er dog ikke så bekvem. Med en minimumspris på $11 pr. måned er dette et af de dyreste layoutwebsteder, på trods af at det faktisk ikke tilbyder noget. På den anden side er det samme pris for et hvilket som helst antal medarbejdere, så hvis du har et stort nok team, kan du retfærdiggøre omkostninger. Hjemmesider til at lave layouts
omkostninger:
- $11/måned (faktureres årligt): 3 projekter
- $17 // månedligt (faktureres årligt): 10 projekter
- $32/måned (faktureres årligt): 25 projekter
- $68 // månedligt (faktureres årligt): ubegrænsede projekter
Teknikere:
- yderst behagelig
- WYSIWYG interface
- gratis prøveversion online
Ulemper: Websteder til at skabe layouts
- dyrt
- Funktionssættet er ikke så robust som andre populære layoutwebsteder
Anbefales til…
- begyndere, der er skræmt af mere komplekse grænseflader
- store teams, der ikke har råd til individuelt medlemskab med andre mockup-websteder
7. MockupsJar. Hjemmesider til at lave layouts
MockupsJar er det samme gratis layout-websted som Mediamodifier: du vælger din skabelon og overlægger dit eget billede på den. Ligesom Mediamodifier tilbyder de et udvalg af stockfotos fra bærbare computere til krus og t-shirts, men i отличие от Mediamodifier, du kan downloade højkvalitetsversionen gratis. Hjemmesider til at lave layouts
MockupsJar har måske ikke så mange webstedsmockup-skabeloner som Mediamodifier, men muligheden for at uploade et billede af høj kvalitet uden at betale gør op for det. Du kan dog kun uploade 20 billeder i høj opløsning; derefter skal du enten betale eller downloade den i lav opløsning. Den gratis version har også reklame, men generelt er det ikke så slemt for et gratis mockup-websted.
Omkostninger: Hjemmesider til oprettelse af layouts
- Gratis plan
- 5 € / måned (betales månedligt)
Teknikere:
- let bare
- gratis plan tilbyder 20 billeder i høj opløsning
- ingen vandmærker
Ulemper:
- blottede træk
- skal skabe billeder andre steder
Anbefales til…
- folk, der kan lide Mediamodifier-platformen, men ikke ønsker at betale for at fjerne vandmærkerne
8.Moqups. Hjemmesider til at lave layouts
moqups er en anden alsidig digital designer til mockups, prototyper og selvfølgelig mockups. Deres editor er en fantastisk kombination af avancerede funktioner og elementer ledelse WYSIWYG velegnet til både begyndere og erfarne designere. De har dog kun to prisplaner, afhængigt af hvor mange brugere du har, så hold større end tre skal betale ekstra. Hjemmesider til at lave layouts
Brugere roser Moqups' evne til at lave flowcharts, hvilket ikke ligefrem er brugbart til layouts, men er godt for hele designprocessen. Selvom noget brugervenlighed kan være akavet, er det overordnet set et levedygtigt alternativ til andre generiske layoutwebsteder, især hvis du er lige så interesseret i wireframes og prototyper.
omkostninger:
- $16/måned (faktureres årligt) [Pro – 3 redaktører]
- $49/måned (faktureres årligt) [Ubegrænset - Ubegrænset redaktører]
Fordele: Websites til at lave layouts
- velafbalanceret værktøj til design af wireframes, prototyper og mockups
- Brugervenlig nok for begyndere, avancerede nok til eksperter
- Fantastiske planlægningsfunktioner såsom flowcharts, sitemaps og storyboards
Ulemper:
- på den dyrere side
Anbefales til…
- mennesker, der prioriterer mockups og prototyper på samme niveau som mockups
9. Smartmockups. Hjemmesider til at lave layouts
smarte mockups er i samme kategori som Mediamodifier og MockupsJar, men med bedre integration. Dette er en stor sag, hvis du har taget et skærmbillede i høj opløsning af forhåndsvisningen i Marvel-appen og bare vil placere den på en skrivebordsbaggrund. Smartmockups har også flere tilpasningsfunktioner end andre gratis hjemmesider med mockups, såsom at skifte farver, men denne funktion er kun tilgængelig med et betalt abonnement. Hjemmesider til at lave layouts
Som med andre gratis mockup-websteder, skal du ikke forvente for meget ud over at have dit billedoverlejring på skabelonens baggrund. Den betalte version har adgang til over 6000 billedskabeloner til en række forskellige baggrundsbilleder, herunder T-shirts, visitkort og digitale enheder. Den gratis plan tilbyder stadig omkring 800 layoutskabeloner, men du bliver nødt til at håndtere vandmærker.
omkostninger:
- Gratis version
- 9 dollars om måneden
Fordele: Websites til at lave layouts
- integreres med Marvel App, Dropbox, Figma, Unsplash og Canva
- den betalte plan giver dig mulighed for at tilpasse billedet
- hurtigt og nemt
Ulemper:
- Den gratis plan har vandmærker
- skal skabe billeder andre steder
Anbefales til…
- du arbejder primært i Marvel App, Canva eller Figma
Hvorfor ikke blive professionel?
Som vi sagde ovenfor, er det eneste formål med mockups at se godt ud. Hvis der er meget, der afhænger af succesen med din mockup - måske skal du vinde en utilfreds interessent eller pitche en idé til mere finansiering - så vil du helt sikkert have, at dit mockup ser perfekt ud. I så fald, hvorfor ikke overlade det i hænderne på en professionel. Hjemmesider til at lave layouts
Når du hyrer en freelance designer, lægger du dit design i hænderne på en ekspert, der forstår ins og outs af design. Du behøver ikke bekymre dig om softwarepriser eller indlæringskurver, fordi designeren vil tage sig af det for dig. Og med vores fællesskab af designere fra hele verden, er du sikker på at finde design med den stilden du skal bruge!
"АЗБУКА"
FAQ. Hjemmesider til at lave layouts.
1. Hvad er et mockup-websted?
Hjemmeside til oprettelse af layouts – dette er et onlineværktøj, som giver brugerne mulighed for at skabe designlayouts til forskellige projekter såsom websider, mobilapplikationer, trykte materialer og mere. Disse værktøjer giver typisk funktioner til at skabe og redigere grafik, tekst og andre designelementer.
2. Hvilke populære websteder til at lave mockups er der?
- Canva: Intuitivt værktøj med mange skabeloner og muligheder for at skabe grafik og trykte materialer.
- figma: Et samarbejdende interfacedesignværktøj, der giver dig mulighed for at arbejde i realtid med andre designere.
- Adobe XD: Et kraftfuldt værktøj til prototyping og design af brugergrænseflader.
- Skitse: Interfacedesignsoftware populær blandt app- og hjemmesidedesignere.
- InVision: Platform for interaktiv prototyping og designsamarbejde.
3. Hvilke funktioner tilbyder disse websteder?
- Skabeloner: En lang række færdige skabeloner til forskellige typer projekter.
- redigering: Værktøjer til redigering af tekst, grafik og andre designelementer.
- Samarbejde: Mulighed for at arbejde på et projekt i et team, udveksle kommentarer og feedback.
- Eksport: Mulighed for at eksportere layouts i forskellige formater (JPEG, PNG, PDF osv.).
- Prototyping: Funktioner til at skabe interaktive prototyper og teste brugeroplevelsen.
4. Hvordan vælger man en passende hjemmeside til at lave mockups?
- Projektmål: Bestem, hvad du skal bruge layoutet til (webdesign, mobilapp, trykte materialer osv.).
- funktionalitet: Tjek, om værktøjet tilbyder alle de funktioner, du har brug for.
- Brugervenlighed: Sørg for, at grænsefladen er intuitiv og nem at bruge.
- Kompatibilitet: Sørg for, at værktøjet er kompatibelt med andre programmer og formater, du bruger.
- Pris: Sammenlign prisen på forskellige værktøjer og vælg det, der passer til dit budget.
5. Hvilke fordele tilbyder mockup-websteder?
- bekvemmelighed: Evne til at arbejde online uden behov for at installere software.
- tilgængelighed: Få adgang til projektet fra enhver enhed og til enhver tid.
- Samarbejde: Nemt at samarbejde med teamet og kunderne.
- Spare tid: Lav hurtigt layouts ved hjælp af færdige skabeloner og elementer.
6. Kan jeg bruge de gratis versioner af disse websteder?
Ja, mange af disse websteder tilbyder gratis versioner med begrænsede funktioner. For eksempel:
- Canva: Gratis version med adgang til grundlæggende funktioner og skabeloner.
- figma: Gratis version til små teams med begrænsede projekter.
- Adobe XD: Gratis version med begrænsede prototypemuligheder.
7. Hvordan kommer man i gang med et websted for at lave layouts?
- Tilmeld dig: Tilmeld dig på det valgte websted og opret en konto.
- Udforsker grænsefladen: Gør dig bekendt med værktøjets grænseflade og grundlæggende funktioner.
- Vælg en skabelon: Vælg den rigtige skabelon til dit projekt eller start fra bunden.
- Oprettelse af et layout: Begynd at tilføje og redigere designelementer ved hjælp af webstedsværktøjer.
- Gem og eksport: Gem dit projekt og eksporter det i det ønskede format.
8. Hvilke tips vil hjælpe mig med at bruge disse websteder effektivt?
- Udforsk manualer og træningsmaterialer: Mange websteder tilbyder instruktionsvideoer og artikler for at hjælpe dig med at komme hurtigt op i hastighed.
- Eksperiment: Vær ikke bange for at prøve nye funktioner og eksperimentere med design.
- Brug skabeloner: Start med færdige skabeloner for at spare tid og få professionelt udseende resultater.
- Samarbejde: Inviter kolleger og kunder til at samarbejde og modtage feedback.