Wireframes vs Mockups
När du designar en ny webbsida eller lägger till en ny funktion för din produkt är det viktigt att skapa både trådramar och mockups - men vad är skillnaden? Kort sagt är en wireframe en lågtrohet, minimalistisk inställning till ett konceptkoncept. Det fokuserar på kärnlayouten och funktionerna som en ny sida kommer att ha, men lämnar all blixten till mockupen. Mockups är högre trovärdighet och inkluderar färg, riktigt språk och sanna ikoner. En wireframe bestämmer hur en mockup ska se ut, och en mockup bör vara en exakt, statisk representation av slutprodukten.
wireframes
prototyper
3 Skillnader mellan Wireframes och Mockups
-
Färg
Den första stora skillnaden mellan wireframes och mockups är färgens display. Vid trådframställning är det bäst att avsiktligt vara dyster med ditt färgschema, eller bättre, men håll det helt svart och vitt. Att lämna färg ur dina trådramar hjälper till att undvika distraktioner när man planerar och fokuserar på generell sidlayout och design. För mockups, gör motsatsen. Spela med olika färgscheman och hitta den som du vill använda med din slutprodukt. Mockup-färger ska pop och locka användaren. -
Stil
Nästa stora skillnad är den allmänna stilen. Trådramar tenderar att vara mycket nätverksorienterade, med de flesta objekten lika stora eller proportionella med varandra. Även om det fortfarande är bra att följa det allmänna nätet när man skapar en mockup, är det okej att lossa reglerna lite. Lita på dina ögon och vad du tycker ser bättre ut. Sammantaget bör wireframes hålla sig till strikta riktlinjer, medan mockups kan ha mer smidighet för vad formgivaren tycker är den bästa passformen. -
Språk
Slutligen är en stor skillnad mellan wireframes och mockups det språk som används. Vid wireframing är det bäst att använda falsk eller platshållare som Lorum Ipsum . Återigen är anledningen till att detta görs så att produktutvecklingslaget inte distraheras av webbsidans kopia och istället fokuserar på den allmänna designen. För mockups, ta med den riktiga kopia du vill se på sidan. Genom att inkludera verklig kopia i mockups ger du både dig själv och utvecklingsgruppen en uppfattning om hur texten verkligen ska göra på slutprodukten och hur mycket utrymme det tar upp.
Vanliga Frågor om Wireframes vs Mockups
Vad är den största skillnaden mellan en wireframe och en mockup?
En wireframe är en grundläggande visuell representation som beskriver strukturen och funktionaliteten för ett projekt, medan en mockup är en mer detaljerad visuell representation som visar hur projektet kommer att se ut och fungera.
När ska jag använda en wireframe kontra en mockup?
Använd en trådram i de tidiga stadierna av designprocessen för att fastställa den grundläggande layouten och strukturen för ett projekt. Använd en mockup senare i processen för att förfina designen och lägga till mer specifika visuella element.
Behöver jag både en wireframe och en mockup?
Det beror på projektets komplexitet och teamets behov. I vissa fall kan en trådram räcka för att kommunicera designidéer, medan i andra kan en mockup vara nödvändig för att visa hur den slutliga produkten kommer att se ut och fungera.
Kan wireframes och mockups användas för både webbplatser och appar?
Ja, wireframes och mockups kan användas för både webbplatser och appar, såväl som andra typer av digitala produkter som mjukvaruapplikationer och digitala gränssnitt.
© 2024 - Clever Prototypes, LLC - Alla rättigheter förbehållna.
StoryboardThat är ett varumärke som tillhör Clever Prototypes , LLC och registrerat i US Patent and Trademark Office