Share
Moderne teknologiutforming krever en høy grad av interaktivitet: Navigasjonsbjelker endres med brukerens rulleplassering, bokser utvides på klikk for å vise og skjule støttende informasjon, lister slettes og tømmes for ombestilling, etc. Designere må vurdere alle mulige brukerinteraksjoner til skape den mest strømlinede, intuitive brukeropplevelsen i sine produkter.
Deling og levering av interaktive design kan ta en rekke formater avhengig av hva du prøver å oppnå, og hvem du leverer til.
I dette innlegget går jeg gjennom ulike prototypiske tilnærminger, og beskriver i hvilken sammenheng man ville velge hver. Til slutt har de forskjellige metodene som er beskrevet nedenfor, tre aspekter du bør vurdere når du bestemmer hvilken rute du skal gå om bord på:
Jeg skal bruke illustrasjoner som viser nivåene av hver av disse for alle prototypemetoder vi dekker.
Den tidlige nettsiden var statsbasert: ved å klikke på en kobling tok jeg meg til en annen side, som hadde en samling lenker som tok meg til påfølgende sider og så videre. En forståelse av Javascript var et avansert ferdighetssett, og rammer hadde ennå ikke blitt utviklet som ville lette lettere bruk av språket. Som sådan var interaktive komponenter sjeldne. Designernes statiske leveranser passer til disse teknologiske produktene: Siden det var få interaktive, bevegelige komponenter, kunne designene være effektivt representert av statiske komposisjoner som ble opprettet i Photoshop, InDesign og andre utskriftslayoutverktøy.
Som teknologien har utviklet seg, har forståelsen av fordelene med en høyere grad av interaktivitet i brukeropplevelsen ført til at mer brukeropplevelsesdesign er betinget av interaksjon. Arten av statiske designverktøy gjør det imidlertid vanskelig å representere interaktive designideer gitt produktets mangel på interaktive komponenter. Til syvende og sist har dette ført til spredning av prototypingsverktøy for å effektivisere utarbeide interaktive designkonsepter.
Prototyper har to hovedfordeler som mangler i statiske resultater:
Som sådan kan de være en svært effektiv mekanisme for å levere designideer.
Men, avhengig av prosjektstrukturen og dens mål, kan statiske leveranser - "papirprototyper" - fortsatt være effektive i designprosessen. Hvis produktet er bedre representert gjennom en statsbasert informasjonsarkitektur, fungerer det for en, statisk leveranse perfekt. I tillegg, hvis lagstrukturen gir mye kommunikasjon mellom lag og en svært fleksibel iterativ design / utviklingsprosess, kan statiske leveranser være effektive. Når man skal bestemme hvilken vei som skal gå i gang, bør man vurdere kommunikasjonsstrukturen til organisasjonen, involverte interessenter og graden av interaktivitet som kreves i sluttproduktet når man bestemmer seg for å fortsette med statiske mockups eller robuste prototyper.
Papir prototypingLo-fidelity-prototyper forsøker å spenne gapet mellom restriksjonene for statiske komposisjoner og wireframes, som omfatter en leverbar som kan illustrere noen av de interaktive designkonseptene, men mangler raffinering av et ferdig produkt. Det visuelle designsystemet kan ikke være fullt konseptualisert, for eksempel, og designeren kan velge å representere informasjon i svart og hvitt ved hjelp av plassholdere for innholdet for å presentere en foreslått visjon om informasjonsarkitekturen.
Slike leveranser er populære blant designere som anser seg for seg fullstendig av en UX overtalelse, da de kan være mindre behagelige å forstå hvordan en informasjonsarkitektur oversetter til et visuelt designsystem. Disse typer prototyper blir ofte ledsaget av "visuelt utformede" statiske komposisjoner for å gi en mer robust representasjon av sluttproduktet.
Omvendt kan andre lo-fidelity-prototyper gi en høy grad av visuell designpolsk, men mangler robuste interaktive tilstander. Mange prototypingsverktøy lar designere enkelt definere "hit-områder", hotspots som på klikk tar brukeren til en annen side eller en del av designet. Dette er nyttig for visuelle designere, da de kan fokusere mer innsats på å skape de visuelle aspektene av et informasjonshierarki, og deretter sammenkoble deres design senere for å illustrere brukervennlighet. Imidlertid er etableringen av mer robuste og sofistikerte interaksjoner begrenset i denne designprosessen.
Både lofidelitet og papirprototyper krever derfor et høyt nivå av kommunikasjon mellom design, utvikling og sentrale interessenter, da resultatene bare er en tilnærming av ferdigproduktet. Enten er det visuelle eller interaktive designsystemet underrepresentert, og i siste instans står slike leveranser overfor mange av de samme risikoene som statiske komposisjoner: Misforståelse av designideer som resulterer i bortkastet utviklingstid, behovet for å presentere sofistikerte ideer muntlig eller skriftlig, bortkastet tid i møter som utarbeider underrepresenterte designideer, osv.
Et annet potensielt problem er overfragmenteringen av designideer, noe som kan resultere i en dårlig utformet design som mangler enhet. Så mye som organisasjoner elsker å segmentere ansvaret i separate roller (UI, UX, Visual, Interaction, etc.), er design en disiplin betinget av etableringen av
"Noe som er laget av mange deler og er en eller annen måte mer enn eller forskjellig fra kombinasjonen av sine deler" - Gestalt
I forbindelse med design resulterer overfragmenteringen av ansvar uten en enhetlig tilnærming til produktdannelse ofte i et dårlig konseptualisert produkt. Produktet kan bli forkrommet ved å skape interaksjon, grensesnitt, erfaring og visuell design i separate støvsugere.
Avhengig av konteksten kan lo-fidelity-prototyper være en god mekanisme for å levere design. De er ofte effektive når det gjelder å levere nye produkter innenfor et allerede etablert visuelt designsystem. Måten ulike interaksjoner presenteres visuelt, er allerede etablert, og måten brukeren flyter gjennom en applikasjon på, er hovedmålet for leveransen.
Lo-fidelity PrototypingVisning av hele et design-det visuelle, grensesnittet og opplevelsen av design-hi-fidelity-prototypen er den hellige grensen til interaktive designleveranser. I en høykvalitetsprototype kan interessenter, utviklere og brukere fullt ut interagere med leveransen, og gir en rekke fordeler til organisasjonen.
For det første sikrer høykvalitetsprototyper mer effektiv og effektiv kommunikasjon mellom avdelinger. Ofte spares tid da utviklere fullt ut kan forstå hvordan en samhandling er strukturert før de går på feil vei og sliter med verdifull utviklingstid. Aktørene setter pris på høykvalitetsprototyper, så vel som de fullt ut kan forstå de interaktive og visuelle designkonseptene i en konsolidert leverbar. Hi-fidelity-prototyper sparer derfor ressurser ved å sikre effektiv kommunikasjon av designideer til utviklere og interessenter.
En annen fordel ved å lage høykvalitetsprototyper er deres tilrettelegging av mer robust brukeropplevelsesforskning. En bruker kan fullt ut samhandle med prototypen, og illustrerer dermed hull i designen i sanntid. Mange hi-fidelity prototyper imøtekomme for introduksjon av analytics programvare til levererbar selv, samt gi ytterligere, støttende metoder for å gjennomføre brukerundersøkelser. Google Analytics kan innlemmes i html-genererte prototyper, for eksempel for å lette brukereksperimenter og A / B-testing. Endelig skaper muligheten til å innlemme brukertester tidligere i produktutviklingslivet en mer effektiv prosess og resulterer i et bedre produkt: Utviklingstiden spares når designen er modifisert før den begynner å bli bygget, og iterasjoner oppstår før den første utgivelsen av produkt.
Videre, avhengig av dine interessenter, kan en høykvalitetsprototype øke salgspotensialet, noe som derved direkte påvirker bedriftens bunnlinje. På CrossCap designer vi moduler for manipulering og analyse av markedsføringskampanjer hos verdens største forhandlere. Selge en klient på en bestemt modul - hvorav mange ennå ikke er utviklet - er mye lettere når klienten kan sette seg og fullt ut samhandle med det fremtidige produktet. Å levere hi-fidelity interaktive prototyper har derfor bidratt til selskapets bunnlinje ved å øke salget.
Det er mange fordeler med å produsere hi-fidelity interaktive prototyper. Dessverre mangler mange nåværende prototyperverktøy en sofistikert evne til å skildre både robuste visuelle og erfaringsdesignkonsepter. Dagens prototypingsverktøy er begrenset i deres omfang, og spesialiserer seg på den ene eller den andre. Axure har for eksempel en robust interaksjonsdesign suite som gjør det enkelt å manipulere elementer, men mangler den raffinement som er gitt i andre mer visuelt orienterte verktøy, for eksempel fargepaletter, avansert formmanipulering osv..
På den andre enden av spekteret ligger verktøy som Quartz Composer, som lett lar deg inkorporere sofistikerte visuelle designkomposisjoner, men illustrerer avanserte interaksjoner krever utarbeidet manipulering av oppdateringer og avansert kunnskap om verktøyet.
Origami the Quartz Composer toolkit fra FacebookMed tanke på dagens verktøy er mangelen på en helhetlig, gestalt-drevet tilnærming til å designe teknologi, noe som skaper høyfidelighetsprototyper, legger økt byrde på designavdelingen, da verktøy må masses forsiktig for å produsere ønsket resultat. For å lage høykvalitetsprototyper har vi for eksempel hatt hack inn i Axure for å injisere interaksjons-design-fokusert Javascript direkte inn i den genererte html. Bruke Skisse med framer.js har gitt lignende problemer, og krever en avansert arbeidsflyt som er betinget av en tverrfaglig tilnærming til design.
Vårt designteam fjerner disse hindringene ved å skape interaktive prototyper med høy fidelitet gjennom en flerdisipell lagstruktur: Vi har et team som spenner fra dyktige visuelle designere til kode-sentriske utviklere i fremtiden, pluss noen medlemmer som strekker seg mellom linjen mellom . Dette tillater hvert medlem å utnytte sin ferdighet sett i å bidra til en enkelt levererbar som er mer robust i naturen. Som et resultat, skaper lagstrukturen et høyere effektivitetsnivå, sparer tid og ressurser, og bidrar til salgspotensialet til våre produkter. Mens noen organisasjoner segmenterer designteamet og deres leveranser til forskjellige enheter (UI i Photoshop, UX i Axure, etc.) ligger vårt lags styrke i å forene varierende ferdighetssett under et enkelt mål og leverbare.
Hi-fidelity PrototypingDet er mange fordeler med å produsere hi-fidelity-prototyper ved utforming av teknologiske produkter: de sparer utviklings tid, skaper en mer effektiv kommunikasjon mellom avdelinger og interessenter, bidrar til en mer effektiv prosess og -avhengig av organisasjonens økte salgspotensial. I siste omgang bør din beslutning om hvilken rute du skal ta være avhengig av organisasjonen, interessentene, tidslinjen, leveransens natur, nivået på kommunikasjon mellom avdelinger og organisasjonens produktutviklingsfilosofi.
Effektiviteten av design er målt i utførelsen. Mens høykvalitetsprototyper letter gjennomføringen av designideer ved å gi mer effektiv kommunikasjon som resulterer i bedre ressursutnyttelse, er de på ingen måte det eneste kjøretøyet på veien for å skape et godt produkt. Når du vurderer hvilken rute du skal ta for å skape dine leveranser, bør du vurdere proffene og metodene til ulike metoder som er nevnt ovenfor, teamets ressurser og ferdighetssett, organisasjonsstruktur og filosofi, og hvem du leverer design til for å starte på det beste bane og skape det beste produktet.
I mitt neste innlegg vil jeg illustrere disse prototypiske tilnærmingene på høyt nivå med eksempler på hvert leverbart format for å veilede deg videre mot den rette veien for å ta med interaktive resultater.
Accentsconagua