Hjemmesider til at lave layouts

Mockup-websteder, også kendt som online grafiske redaktører eller designværktøjer, giver brugerne mulighed for at skabe forskellige grafiske designs, illustrationer, bannere, logoer, præsentationer og mere direkte fra deres 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 dets funktioner med 3D-effekter, animationer og muligheden for at oprette et komponentbibliotek, et sted at gemme alle dine elementer som knapper og ikoner, så dit team kan bruge dem igen i et andet projekt (dette hjælper med at gentage kunder, hvis de se de samme kontroller på det nye 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 også er opmærksomme på deres budget

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 omkostningerne. 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å annoncer, 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 WYSIWYG-kontroller, 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 baggrunde, 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!

  «АЗБУКА»