Søk
Close this search box.
Søk
Close this search box.
ANNONSE

Designverktøyene som forbedrer nettbutikken

Netthandel

Brukeropplevelsen i nettbutikken kan formes og styres tidlig ved hjelp av gode designverktøy. Her er verktøyene som kan brukes til å lage skisser for hvordan nettbutikken din vil se ut.

ANNONSE

Jeg vil først gå gjennom noen gratisprogrammer, for deretter gå gjennom verktøy som koster penger.

Du trenger ikke kunne kode for å lage skissene. Penger og tid kan dermed være spart. Gode verktøy tillater deg å utvikle ideer og se det store bildet, slik at du unngår å gjøre feil eller satse på feil løsning. Det er mye enklere å jobbe konkret når du har en skisse og kartlegger hva du eller en leverandør trenger å gjøre før konkrete utviklingsarbeidet starter.

Hvert enkelt program kommer med ulikt spekter av funksjonalitet. Finn ut hva ditt prosjekt har behov for, og legg listen deretter. Enkelte programmer er kun til enkle trådskisser, mens andre vil tillate å jobbe med prototyper online og samhandle med flere brukere.

Cacoo (gratis)

Med Cacoo kan du enkelt lage skisser av nettbutikken til nettsteder og smarttelefoner. Cacoo har en stor verktøypalett med mange funksjoner som kommer integrert i den plattformen som er gratis. Du kan oppgradere til en betalings-løsning som gir flere muligheter, om du ønsker det.

Begrensninger: Gratis-kontoen lar deg kun eksportere det endelige prosjektet i PNG-format. Det kan fungere for de som ikke jobber med store kunder og som trenger dette kun som et verktøy for  utvikle ideer.

Framebox (gratis)

Framebox er et solid, gratis og nettbasert verktøy for svært enkel skissedesign. Programmet inneholder noen dra-og slipp elementer og lar deg dele prosjektet som en unik nettadresse. Du kan også gi dine elementer titler og beskrivelser for å forklare sin funksjon.

Gliffy

Gliffy er et verktøy som minner mye om en slags begrenset, nettbasert versjon av betalings-verktøyet, Visio. Gratisløsningen lar deg lage fem enkle skisser og bruke 2 MB lagringsplass. Det er nok til å bruke til små prosjekter eller gjøre designtester.

Verktøyet inkluderer dra- og slippelementer, samarbeid online, muligheten for å eksportere bilder og spore versjoner. Men det er ingen muligheter for å lage prototyper.

Pencil Project (gratis)

Pencil Project er et solid og gratis verktøy, basert på åpen kildekode. Det har funksjoner som inkluderer flersidige dokumenter, objekt import, samt samhandling. Verktøyet lar deg skalere og rotere elementer. Programmet tilbyr ulike maler, og gir deg muligheten til å eksportere til HTML, PNG, Openoffice.org dokument, Word-dokument og PDF.

Balsamiq Mockups

Skisse-verktøyet Balsamiq mockups er en favoritt blant webdesignerne. Balsamiq inneholder mange dra-og-slipp-elementer, fra knapper til lister. Den grunnleggende forutsetningen bak dette verktøyet er å at skissene skal være grove og ligge på et skissenivå. Hver skisse er stylet som en håndtegning. Dette for at man skal oppmuntre til så mange tilbakemeldinger som mulig på et tidlig stadium i prosjektet, og ikke gi føringer for designet.

Axure

I tillegg til å lage mock-ups, gjør Axure det mulig å legge til layout og lage en interaktiv prototype. Wireframing-verktøyet inkluderer sitemaps og ulike "widgets" i form av ulike interaksjons elementer. Du kan også se designet på telefonen med en innebygd delingsfunksjon.

iPlotz

Det Flash-baserte verktøyet iPlotz lar deg lage klikkbare trådskisser med dra-og-slipp-komponenter. Programmet har også et tillegg som inkluderer muligheten til å legge til oppgaver og notater.

UXPin

UXPin er et verktøy med funksjoner som funksjonell prototyping, dra-og-slippbibliotek og deling av URLer .Verktøyet legger også til rette for samarbeid ”live”, samt og chatting, Just Proto lar deg lage egendefinerte elementer og legge dem til en brukerbiblioteket.

Pidoco

Pidoco er ganske lik Axure, ved at verktøyet omfatter et bibliotek av ulike dra-og-slipp-elementer, så vel som muligheten til å legge til flere sider og lag. Dine prototyper kan deles på nettet med andre, og omfatter funksjoner for samarbeid, tilbakemeldinger og diskusjon. Du kan vise dine prototyper på telefonen, eller laste ned programmets app.

Visio

Visio er et Microsoft-basert verktøy der styrkeen ligger i tekniske diagrammer snarere enn Wireframing; Men for de som allerede er vant med andre Microsoft-programmer som Word eller Excel, vil grensesnittet være veldig kjent. Viseo tilbyr et tilleggsverktøy som Swipr, som lar deg lage og eksportere en brukbar HTML prototype.

OmniGraffle

OmniGraffle har vært en favoritt hos Mac-brukere lenge. Nå er det også laget en sømløs overgang til iPad.  Dette er et verktøy som du kan bruke til å teste ut ideer og lage trådskisse, diagrammer eller andre designskisser raskt. Du velger kun hvilken dokumenttype du ønsker, deretter gjør verktøyet det kontekstuavhengig. Du kan dermed samkjøre elementene i skissene dine.

Protoshare

Protoshare er et nettbasert verktøy, med fokus på samarbeid og deling. Det inkluderer et bibliotek med dra-og-slipp-elementer, et områdekart, samt muligheten til å bruke egendefinerte css-filer og sette inn egne elementer. I motsetning til enkelte andre verktøy, det kan du ikke eksportere skissene som en PDF.

Mockflow

Verktøyet Mockflow lar deg lage arbeidsprototyper, og har fokus på samarbeid og deling. Programmet inkluderer funksjoner som en sitemap-generator for sider og mapper, versjonssporing, bilde- og komponent samlinger, chat og HTML5-eksport.

Mockingbird

Mockingbird er et web-basert verktøy som du kan bruke til å lage, linke sammen sammen, forhåndsvise og dele trådskisser for din nettbutikk eller applikasjon. Grensesnittet er rent og brukervennlig, med dra og slipp-elementer, interaktiv sidelinking, smart tekststørrelse-justering, og muligheten til enkelt å dele mockups med andre via en direkte kobling.

Denim

Demin er en desktop app som støtter skissearbeidet og lar deg designe på ulike nivåer. Det er et effektivt verktøy for tidlig brainstorming og skissearbeid. Denim er et godt verktøy når det kommer til å lage elementer som kan gjenbrukes eller overganger mellom sider, noe som resulterer i en mer interaktiv opplevelse. Demin er et enkelt, men effektivt verktøy.

Website Wireframe

Website Wireframe er et veldig enkelt og web-basert verktøy for å lage skisser i løpet av noen få minutter. Skissene kan sendes via e-post, direktemeldinger, eller mobiltelefon via en link. Deretter kan skissene enkelt oppdateres basert på tilbakemeldinger, diskusjon, ideer og forslag.

Dette er ikke programmet for den sofistikerte eller kresne brukeren, men for den som trenger et enkelt og effektivt verktøy; et alternativ til verktøy med en høyere læringskurve.

Adobe Muse

Adobe Muse er Adobepakkens visuelle designverktøy som mange grafiske designere bruker, blant annet til å designe nettsteder.

Verktøyet er intuitivt å bruke, og når du oppretter nettsteder med Muse, får du et gratis webhotell på kjøpet, slik at du kan se resultatene online med en gang. Adobe lar deg også teste ut beta programvaren gratis, før du bestemmer deg for om du vil kjøpe programmet. Muse er et ganske intuitivt program å bruke, og du kan opprette test-sider som du for eksempel kan dele med de som har behov for å se på prototypene på nett.

Adobe Fireworks

Adobe Fireworks lar deg designe skisser og prototyper for web, samt apper. Ulike symboler og maler er inkludert, noe som er bra når man skal lage raske skisser. Programmet utvikler CSS-filer gjennom hele prosessen. Disse kan dupliseres til den endelige versjonen.

Adobe InDesign

Det er veldig enkelt å lage en mock-up av et nettsted i form av en interaktiv PDF med Adobe InDesign. Ved å sette sammen en skisse av animasjoner, video og objekter, kan du enkelt og raskt visualisere konseptet. Programvaren inneholder også muligheten til å opprette biblioteker av sideelementer, slik at du kan lage samlinger av ulike brukergrensesnitt.

Adobe Photoshop

Adobe Photoshop egner seg til å lage en rask skisse, men kommer til kort hvis man har behov for et stort utvalg av elementer i grensesnittet. Programmet lar deg gruppere ulike elementer og å jobbe i lag, noe som gir en svært rask prosess dersom man er vant med Adobe sine programmer.

Kilder: Adobe, The Creative Bloq, Mashable, Codecondo

Les også: Dyrt å utvikle plattform for netthandel i Norge

Del artikkel: