5 online værktøjer til produktion af wireframes og mockups

Youtube som mockup via Mockflow.com

Hvad enten du er webdesigner, informationsarkitekt eller projektleder på udvikling af en ny hjemmeside, er det en god ide at indlede designfasen med etablering af wireframes og mockups.

Wireframing er den proces, der kortlægger hjemmesidens overordnede struktur og layout. Her skaber man konsistens i sitets overordnede look and feel og man fastlægger det endelige grid, hvori elementer som billeder og takst skal placeres. Ved at anvende wireframes i indledningen af et projekt kan den simplificerede repræsentation af slutproduktet fungere som en proces til forventningsafstemning og endeligt beslutningsgrundlag.

Wireframes er den helt grove skitse af layoutet og ligger derfor inden mockup-stadiet, hvor designet gradvist udvides med flere detaljer. Tidligere blev de fleste wireframes også lavet på en papirblok, men efterhånden anvendes der specialiseret software og hostede løsninger i stedet, som funktionsmæssigt understøtter formålets nødvendige funktioner og evalueringsprocesser.

Wireframes og mockups

Oversigt over de førende hostede værktøjer til arbejdet med wireframes og mockups

Mockability

http://www.mockabilly.com/

Mockability er både et prototypeværktøj til iPhone apps og en app i sig selv. Du uploader og arrangerer dine designs til app'en, angiver den ønskede interaktivitet og derefter kan du afspille og præsentere din prototype som var det en rigtig app. Den fulde version koster $7.

MockFlow

http://www.mockflow.com/

Opret dine wireframes og mockups via en simpel drag-n-drop struktur og inviter derefter kunder og samarbejdspartnere til evaluering med rige kommenteringsmuligheder. MockFlow er gratis at anvende, men vil du slippe for begræsninger, kan du få det hele for $5/md.

Mockingbird

http://gomockingbird.com/

Med sin intuitive brugerflade og rimelige prisstruktur er Mockinbird et populært værktøj til online wireframing. Det er hurtigt at komme igang og så du kan invitere samarbejdspartnere med inden for. Priser fra $9 - $85/md.

Naview

http://www.naviewapp.com/

Naview tilbyder et brugervenligt redskab til opsætning, testning og fælles evaluering af navigationsstrukturen i dit nye design. Du kan importere regneark med menupunkterne og behøver ikke kende til kodning. Naview har en gratis version og det dyreste abonnement koster $119/md.

Wirify

http://www.wirify.com/

Wirify er et bookmarklet til din browser, der lader dig se alle hjemmesider som wireframes ved et enkelt klik. Det gør det nemmere at ignorere indhold og html, men istedet fokusere på struktur og layout. Med Wirify Pro kan du eksportere wireframes direkte til wireframe software som OmniGraffle or Balsamiq.

Gode wireframe blogs

Arbejder du professionelt med wireframes, eller er du interesseret i at vide mere om best practise, gode værktøjer, se eksempler eller downloade skabeloner og design kits, vil jeg anbefale følgende blogs:
I ♥ wireframes
Wireframes Magazine