Hur bör produktchefer använda trådramar?

Wireframes förbises ofta när vi skyndar oss att få ut nya funktioner, men de kan vara ett viktigt verktyg för produktchefer för att samla in feedback, snabbt utveckla idéer och prototypa komplexa arbetsflöden utan särskilt mycket extraarbete. 

Jag har befunnit mig mellan produktledning och UX-design under större delen av min karriär och har upptäckt att wireframes är ett viktigt verktyg i produktdesignprocessen. Även om de är ett utmärkt sätt att visualisera idéer och skapa prototyper med låg detaljnivå, är de också bra för att skapa samsyn mellan team.

Vad är en wireframe?

Balsamiq, skaparna av ett av marknadens mest populära wireframeverktyg, beskriver en wireframe som ”ett schema eller en ritning” som hjälper dig och dina kollegor att tänka på strukturen hos det ni bygger.

Låt oss titta lite närmare på den definitionen. Som en ritning hjälper en wireframe till att fastställa grunderna för den slutliga produkten – oavsett om det gäller webbsidor, mobilappar eller avancerade webbapplikationer.

I stället för att fokusera på de finare detaljerna i produktens användargränssnittsdesign, såsom färger, typsnitt och stilar, hjälper wireframen till att flytta fokus till stora strukturella överväganden som layout, informationsarkitektur och funktionalitet på hög nivå. Designelement är naturligtvis viktiga, men om du fokuserar på dem för tidigt i processen kan det distrahera dig från att upptäcka stora strukturella problem som senare blir huvudvärk i produktutvecklingsprocessen.

En viktig egenskap hos en bra wireframe är att den har låg detaljnivå, vilket innebär att den kan vara så enkel som några rutor i ett designsamarbetsverktyg, eller till och med en teckning på en whiteboard eller klotter på baksidan av en servett. Platshållare för många UI-element, såsom foton och text, används flitigt eftersom fokus ligger på sidans övergripande layout snarare än på innehållets detaljer. 

Wireframes behöver inte vara perfekta – de ska vara grova och smidiga. 

Produktchefer förstår vikten av att förmedla betydelse, och ofta är den enklaste metoden den bästa.

Vem använder det?

Wireframes är ett utmärkt produktledningsverktyg genom att överbrygga de många tvärdisciplinära samtal som produktchefer hamnar i.

Alla i ett produktteam, inklusive produktchefer, designers och utvecklare, kan dra nytta av wireframeprocessen.

I stället för att koncentrera all kommunikation till ord som kan missförstås erbjuder en wireframe ett snabbt sätt att se den avsikt du siktar på. Visa människor vad du menar i stället för att bara försöka förklara det i text.

Ju mer varierad feedback du får på wireframen, desto fler idéer kan du utvärdera – det spelar ingen roll om det är produktchefen, designern eller utvecklaren som skapar wireframen, så länge ni alla använder den för att främja samarbetet. 

Vem ansvarar för wireframes?

I vissa organisationer kan det skapa förvirring att ta reda på vem som ska vara ”ansvarig” för att skapa wireframes. Om ditt team har designers rekommenderar jag att ni diskuterar vem som bör ansvara för att skapa wireframen. I slutändan bör det vara ett verktyg som alla använder – det är bara ännu ett sätt att hjälpa till att kommunicera idéer tydligt, vilket skapar starkare team. 

Inte bara för interna intressenter

Eftersom trådskisser betraktas som lågupplösta och oförfinade kan det vara lätt att anta att trådskisser bara är till för intern kommunikation, men glöm inte att de är ett utmärkt sätt att underlätta samtal med kunder, testare och andra externa intressenter. 

Varför bör produktchefer använda trådskisser?

Trådskisser förenklar din kommunikation 

Det gamla talesättet ”en bild säger mer än tusen ord” stämmer verkligen! Att kunna skriva framhålls ofta som en viktig färdighet för produktchefer, och jag håller helt med! Men av gammal vana kan det ofta bli vår standardmetod för kommunikation, även när det finns enklare sätt. Om du snabbt sätter ihop en trådskiss kan du spara mycket av den tid som du annars skulle ha lagt på att formulera text. 

Trådskisser hjälper dig att förstå komplexa användarflöden

Trådskisser ger dig ett konkret sätt att utforska idéer som du behöver omvandla till användarberättelser eller krav. Dolda begränsningar blir synligare, och nya möjligheter som kanske hade missats visar sig också när du börjar föreställa dig en lösning på ett mer konkret sätt. 

Trådskisser är billiga

En fantastisk sak med trådskisser är att de ger dig och produktutvecklingsteamet en mycket enkel möjlighet att testa idéer utan att behöva överinvestera i detaljrik design eller kod av produktionskvalitet.

Om du står inför något som verkar komplicerat eller till och med riskfyllt att bygga, välj den billiga vägen och sätt ihop några snabba trådskisser för att genomföra tidiga användbarhetstester. Det kan vara allt som krävs för att faktiskt utvärdera om en idé är värd att investera i eller inte.

Ytterligare en färdighet som kan utveckla din karriär inom produktledning

Att ha en god förståelse för bästa praxis inom användarupplevelse är en viktig yrkesfärdighet för en produktchef, så att bli bekväm med trådskisser som ytterligare ett verktyg du kan använda är ett utmärkt sätt att fräscha upp dina attraktiva färdigheter inom produktledning. 

Dina färdigheter inom trådskissande kan visa potentiella arbetsgivare att du vet hur man går från koncept till riktiga produkter. 

Hur kan produktchefer använda trådskisser effektivt?

Användartester och återkoppling från intressenter

Att tidigt få bekräftelse på dina idéer är alltid en god praxis. Trådskisser gör idéer mer konkreta och gör det enklare för människor att ge dig återkoppling under dina användarundersökningar. Detta gäller oavsett om du samlar in återkoppling från interna intressenter eller pratar direkt med användare.

Låt inte det faktum att de ser ofärdiga ut hindra dig från att be om återkoppling på dem. Människor uppskattar att du ber om deras synpunkter i de tidiga stadierna av produktdesignprocessen. 

Trådskisser ger dina specifikationer sammanhang

Många av dagens populära verktyg för produktdesign och trådskisser har inbyggda integrationer som kopplar användarberättelser och krav direkt till de senaste versionerna av dina trådskisser. Genom att inkludera visuellt material i dina specifikationer och användarberättelser kan du ge dina ord ytterligare sammanhang, så glöm inte att ta med det.

Bästa praxis

• Håll det enkelt: Att använda trådskisser effektivt innebär att du inte överinvesterar i att få dem att se perfekta ut – du bör inte sikta på en högupplöst trådskiss. Om du märker att du lägger för mycket tid på att finslipa din process för att skapa trådskisser, ta en paus och återkom med nya ögon. Påminn dig själv om att du försöker se hur de stora delarna av en idé kan sättas samman. De finare detaljerna kan komma senare när du itererar.
• Uppmuntra andra att använda trådskisser: Det kan vara svårt att beskriva komplexiteten i produktarbetsflöden. Uppmuntra andra att visa dig vad de menar med hjälp av trådskisser, så att ni tillsammans kan skapa den vanan. Du kanske tycker att det blir enklare att prata igenom komplex interaktionsdesign eller tekniska problem när ni alla använder ett visuellt hjälpmedel som stöd för samtalet i realtid. 

Vilka verktyg för trådskisser kan jag använda?

Min första rekommendation är att ta en titt på vad du redan har till hands. Papper fungerar när du bara behöver skriva ner en snabb idé, men när du vill skapa något som enkelt kan uppdateras och delas med andra finns det lyckligtvis gott om kostnadsfria verktyg för att skapa wireframes att välja mellan. För att komma igång ännu snabbare kan AI-verktyg för att skapa wireframes generera inledande layouter utifrån instruktioner eller krav.

Med många förbyggda UI-element som du kan dra och släppa sparar dessa verktyg mycket tid. De flesta har också mallar som du kan utgå från, så både nybörjare och experter på wireframes kan komma igång snabbt.

Även om vissa av verktygen är specifikt inriktade på wireframes kan andra verktyg för UI-design, som används för att skapa mer avancerade interaktiva mockuper, fortfarande användas. Här är bara ett litet urval av verktyg som du kan ta en titt på:

• Balsamiq: Ett av de äldsta och mest populära verktygen som är särskilt inriktade på wireframes är Balsamiq. De håller medvetet sina verktyg och visuella element enkla, så att du kan fokusera mer på funktionaliteten du arbetar med i stället för att distraheras av utformningen.
• Figma: Figma är ett utmärkt verktyg för att skapa komplexa visuella designresurser, men kan också enkelt användas för att bygga enklare layouter och wireframes.
• Miro: Även om Miro inte är ett designverktyg i egentlig mening har det ett mycket friare arbetssätt där du kan använda olika verktyg, från post-it-lappar till tankekartor. Med inbyggda funktioner för wireframes kan det vara ett enkelt sätt att börja skapa dina wireframes med låg detaljnivå.
• Framer – Om du behöver mer än statiska wireframes låter Framer dig bygga interaktiva prototyper med animationer och övergångar. Det är ett utmärkt alternativ för team som vill testa användarinteraktioner tidigt i designprocessen.
  
  P.S. Ta en titt på alternativ till Framer och andra programvaruverktyg för wireframes.
  
• Whiteboardtavla Om du arbetar på kontoret får du inte glömma att snabba skisser på en whiteboardtavla omgiven av dina kollegor kan vara ett snabbt och enkelt sätt att iterera kring en idé! Arbetar du på distans? Verktygen ovan är utmärkta för virtuellt samarbete!

Relaterad läsning: De 10 bästa verktygen för wireframes för att designa appar och webbplatser

Wireframes kan göra dig till en bättre produktchef

Att vara flexibel i dina arbetssätt och i de verktyg du använder kommer alltid att göra dig till en självsäker och respekterad produktchef. Wireframes är ett viktigt verktyg i din verktygslåda, så glöm inte att använda dem för att hjälpa dig att kommunicera dina tankar och idéer samt samla in feedback tidigt och ofta. 

Att se wireframen som ett kommunikationsverktyg undanröjer frågan om vem som äger den och riktar fokus mot det som är viktigast – att skapa samsyn i dina team, samla in och dela feedback samt skapa tydlighet för dem du arbetar med. 

För fler insikter och tips om hur du utvecklar dina färdigheter som produktchef kan du prenumerera på nyhetsbrevet från The CPO Club.

Relaterad läsning: Produktchef inom digital transformation: Så får du det att fungera

Ta även en titt på: De bästa mockupverktygen för produktchefer