Vissa människor samlar frimärken, andra spårar tåg; Jag har blivit besatt av wireframing programvara.

Jag har försökt och förälskat mig i otaliga applikationer, från Balsamiq till Härmfågel till FlairBuilder . Trots att alla har känt som sann kärlek, har tiden blivit borttagen, och jag befinner mig flirta med ett annat verktyg.

De ser alla så lockande ut, men med tiden ser jag deras brister. Kanske är jag bara för noga. Kanske är mina behov alltför ovanliga. Vad jag verkligen vill ha är ett verktyg som passar hur jag gör saker, snarare än att jag måste passa verktyget.

Har du ett eget favoritframställningverktyg? Ser du ens behovet av en? Om så, går du för alla klockor och visslar eller bara en snabb och smutsig lösning?

FlairBuilder
Applikationer som FlairBuilder blir allt kraftigare, men ibland alltför komplexa.

Varför samarbeta med wireframing med kunder?

För mig är wireframing en samarbetsupplevelse. Det är inte något jag gör ensam i ett mörkt rum. Snarare delar jag processen med mina kunder.

Jag tror på att sitta runt ett bord med kunden och slänga ut nyckelsidor i wireframe-format. Detta har fyra fördelar:

  1. Engagerar klienten
    Genom trådframställning med klienten känner de sig till en del av processen, och det bidrar till att skapa en solid arbetsförhållande.
  2. Skyddar fart
    Genom trådframställning tillsammans, undviker du oändliga revisioner. Att skapa en solid riktning för nyckelsidor händer om några timmar.
  3. Åtar sig kunden
    Om klienten är involverad i att skapa wireframesna känner de en känsla av ägande över dem och webbplatsen. Lösningen blir lika mycket deras idé som din. Följaktligen är de mindre benägna att avvisa designen senare.
  4. Ser som en vanlig referens
    Att skapa trådramar säkerställer att alla förstår dem. Trådramarna fungerar som en gemensam referensram för alla genom hela projektet.
wireframing med klienten
Wireframing med kunden har många fördelar.

Processen är dock inte utan sina utmaningar.

Letar du efter en snabb och smutsig lösning

På många sätt är trådframställning själv mycket lättare. Du har tid att tänka, tweak och förfina. Detta är svårt att göra med en klient i rummet. Collaborative wireframing handlar om att snabbt hysa upp idéer och diskutera dem. Så, du behöver ett verktyg som underlättar det målet.

Ditt trådverktyg måste vara:

  • Snabb att använda
    Ingenting är sämre än en klient som sitter omkring som du desperat slår mot ett trådverktyg för att visa en idé.
  • Lätt att revidera
    I en samarbetsprocess leder diskussionen dig till att prova massor av subtila olika metoder. Du måste kunna ändra trådramen snabbt.
  • Lätt att förstå
    Wireframes måste vara tydliga och beskrivande. Kunderna har inte fördelen av vår erfarenhet av att arbeta med wireframes och kan därför lätt förväxlas.
  • YRKESMÄSSIG
    En idé kan billigare av presentationen. Det hjälper om verktyget kan producera en wireframe som ser ut som en väl övervägd, högkvalitativ lösning.
Exempel Keynote Wireframe
Trådverktyget ska se professionellt ut och ändå vara tillräckligt flexibelt för att möjliggöra snabb iteration.

Traditionellt har collaborative wireframing sessioner gjorts med penn och papper, men det är inte alltid den bästa lösningen.

Varför inte penna och papper?

Förse mig inte fel. Pen och papper erbjuder ett antal fördelar för samverkande trådframställning, och det kommer alltid att ha en plats. Faktum är att jag skulle gå så långt som att säga att de flesta samarbetande wireframing sessioner bör börja med penna och papper.

Det stora med penna och papper är att det är inkluderande och snabbt. Vem som helst kan hämta en penna och börja scribbling; Det kräver ingen speciell skicklighet. Och hela rummet kan börja skissa samtidigt; Det finns ingen enda person med sin hand på musen.

Penna och papper känns också disponibla. Screwing upp på en bit papper och kasta den i facket känns lätt och bär ingen stor känsla av förlust. Detta är avgörande i de tidiga stadierna av trådframställningsprocessen.

Emellertid har trådframställning på penn och papper några nackdelar:

  • Inte lätt att revidera
    När idéer flyger runt och du skriver ett element efter varandra, kan penn- och papperstrådar bli rota snabbt. Du är ofta tvungen att skriva om en sida från början, vilket fördröjer processen.
  • Inte alltid klart
    Med så många revisioner och skribbar blir trådramar ofta förvirrande. De tenderar också att sakna detaljer i mjukvaregenererade trådramar, vilket ger en hel del frågor obesvarade.
  • Ser inte professionell ut
    Om du inte är en bra artist, kommer de flesta av dina trådramar att se ut som ravningar av en förfalskad psykopat (eller är det bara jag?). Detta kan värdera värdet av de bakomliggande idéerna.
Pen och papper wireframe
Pennor och papperstrådramar kan se rörigt och förvirrande ut för den oupplästa klienten.

Enligt min erfarenhet innehåller en bra samarbetande wireframing-session en blandning av både pappers- och mjukvarubaserade trådramar.

Så, med många mjukvarulösningar som är för långsamma och papper misslyckas i andra avseenden, vad är lösningen?

Keynote till räddningen

Efter mycket experiment har jag avgjort på Keynote som mitt föredragna verktyg. Jag misstänker att PowerPoint är lika bra, men som Mac-användare är mitt val Keynote.

Keynote är lätt att använda, och många människor är redan bekanta med det. Bäst av allt, äger de allra flesta oss redan det, vilket sparar lite pengar.

Jag älskar det eftersom det gör det enkelt att kasta wireframes tillsammans och sedan snabbt ändra dem som tankegången ändras.

Bäst av allt kan Keynote wireframes se väldigt professionellt och ge stor klarhet.

För att uppnå detta behöver du en bra mallmall, en som innehåller alla de element som normalt visas på en webbplats (text, bilder, sökrutan, etc.). Det är så enkelt en fråga om att kopiera och klistra in dem på dina sidor.

Några bra videor där ute visar dig hur man skapar egna anpassade element. Om du är lat som jag har ett antal människor gjort det hårda arbetet för dig. För en nominell avgift kan du köpa Keynote och PowerPoint-mallar som innehåller alla de webelement du någonsin kommer att inkludera i en wireframe.

Keynotopia
keynotopia

Keynote UX
Keynote UX

Keynote Kung-Fu
Keynote Kung-Fu

Men fördelarna slutar inte där.

En bonus

Det sätt du presenterar wireframes är avgörande. Även om du arbetar tillsammans, är chansen att inte alla intressenter kommer att vara i rummet.

Många wireframing-applikationer kräver att användare laddar ner ett program eller installerar ett plug-in innan de kan se filen. Inte så med Keynote.

Keynote är redan en vanlig applikation, men det har också några bra exportalternativ. Du kan spara wireframes i både HTML och PDF. Båda alternativen bibehåller länkarna mellan sidor, så användaren kan klicka på "webbplatsen".

Ännu bättre, Keynote låter dig spela in en voiceover och spara wireframe som en QuickTime-video. Detta gör att du kan prata intressenter genom wireframe och förklara ditt tillvägagångssätt, se till att de förstår det tänkande som gick in i den slutliga trådramen.

Keynote exportalternativ
Keynote tillåter dig att exportera wireframe i PDF och HTML och till och med som en film med röstberättelse.

Naturligtvis är ingen lösning perfekt. Keynote är inte silverkulan av trådframställning.

begränsningar

Enligt min upplevelse lider Keynote av två problem som ett trådverktyg.

Den första är sidstorlek. Med andra trådverktyg kan du ändra sidstorlek i flygningen, Keynote gör inte (åtminstone inte utan att snedvrida elementen). Dimensionerna måste också vara desamma över alla sidor. Detta kan vara frustrerande om du inte planerar förbi. Jag kommer runt detta problem genom att göra alla sidor enorma; men den här lösningen är långt ifrån perfekt och skapar problem vid export.

Den andra frågan är att Keynote inte tillåter komplicerad interaktion, trots att länken mellan sidorna. Det kan inte visa JavaScript-driven funktionalitet, så vanlig på webbplatser idag. Naturligtvis, inte heller penna och papper. Och i en samverkande wireframing-session skulle du normalt inte behöva visa denna nivå av interaktiva detaljer. Om du gör det skulle du förmodligen bli bättre med ett mer komplext prototyperverktyg.