Hõbevalge nagu Silverlight :)

Struktuur

Esimene, mis peale Sketchflow prototüübi projekti loomist silma hakkab, on Sketchflow Map. Sketchflow kaardi peal on näha, kuidas rakenduse erinevad osad omavahel seotud on – millisest vaatest millisesse liikuda saab. Kui vaateid on palju, siis võib neid gruppeerida määrates neile erinevaid värve. Seda sama kaarti näeb hiljem ka klient (SL puhul veebilehitsejas) prototüüpi üle vaadates.

Visandamine

Iga kord, kui lisame kaardile uue vaate, luuakse taustal selle kohta üks XAML fail, neid faile muutes muudame siis reaalselt prototüüpi ennast. See käib väga sarnaselt tavalise SL rakenduse loomisele – tuleb lihtsalt tööriistade seast õiged elemendid töölauale lohistada. Lisaks on tervitatav ka see, et kui vaja võib ka XAML koodi muuta, vaevalt muidugi, et mõni disainer seda väga teha tahaks Selleks, et visand liiga peen välja ei näeks ning klient ei hakkaks arvama, et rakendus juba valmis on. Selleks on Sketchflow-ga kaasas WigglyLines stiil, mis teeb kõikide elementide väljanägemise selliseks lapiskuks, lohakaks kritselduseks. Silverlight ja stiilid töötavad aga teatavasti nõnda, et siis kui hiljem on vaja, et rakendus näeks viimistletud välja, siis on vaja teha ainult paar hiireklikki ja vana kritseldus asendada õige disainiga.

Navigatsioon

Liikumaks rakenduse ühest osast teise, piisab sellest, et valime vaates mõne objekti või nupu, teeme sel paremkliki ning valime valikust Navigate to vaate nime, mida järgmisena näitama peaks. Minnes tagasi kaardi juurde, siis sealt võime valida ükskõik millise ühendusjoone ning täpsustada, milline animatsioon peaks nende vaadete vahel liikumisele kaasnema. Siis on peenem, kliendile kindlasti meeldib

Kokkuvõte

Sketchflowga võib väga kiiresti saada päris hea tulemuse – poole tunniga võib saada struktuuri ning kõik vaated  paika ning esimese tagasiside kätte, kas see on umbes see, mida vaja. Siis edasi võib juba minna enam detailidesse – lisada näidisandmeid ning kujundada täpselt välja kõik andmelistid, toodete nimekirjad jne. Näidisandmed ongi need, millega järgmine postitus Sketchflow seerias tegeleb.

Expression Blend 3 tõi uue võimalusena interaktiivsete prototüüpide loomise kasutades SketchFlowd. Sektchflow on eraldi projektimall Blendis, millega on väga lihtne teha Silverlight ja WPF rakenduste prototüüpe, mis ei näe välja nagu valmis tooted, kuid samas sisaldavad mõningast funktsionaalsust. Seega ei aja klienti segadusse ja küsima “Kas see nupp ei peaks olema sama tooni sinist nagu meie logo?”, vaid laseb keskenduda olulisele – funktsionaalsusele. Sest prototüübid näevad laias laastus välja nagu kritseldused paberil.

Ei paista nagu toode oleks juba valmis.

Kuidas erineb tavalisest prototüübist?

Aga miks mitte siis kritseldada paberile, kui erilist vahet ei ole? No tegelikult on vahe küll. Esiteks on võimalik edasi anda navigatsiooni ning rakenduse voogu. Olles lihtsa kasutajaliidese valmis kritseldanud lohistanud, saame paari hiireklikiga määrata rakenduse voo – kui vajutatakse siia nupule, näita järgmist vaadet/ekraani/lehte ja muide tee kena fade in animatsioon ka juurde. Klient saab reaalselt rakenduse läbi klõpsida ning mõistab paremini, kuidas meie asjast aru saime ja kas see on see, mida ta tahab (ja vajab?).

Tagasiside

Lisaks saab igasuguse tagasiside anda otse rakendusesse, kirjutades kommentaare, kritseldades värvilisi ringikesi ja kõike muud, mis ühele PHB-le meeldida võiks. Seda saab anda kohe! Ei pea hiljem avama mailirakendust, kirjutama tüütuid tervitusija hüvastijätte…ja meenutama, mis seal kõik valesti oli. Tee prototüübi uurimise käigus lihtsalt nupule ring ümber ja kirjuta juurde, ei see siia ei lähe. Kõik. Hiljem ühe nupuga export feedback ja manusega arendajale kaasa. Kõik. Arendaja impordib tagasiside Blendi ja saab aru, sest kontekst säilib.

Kuidas erineb see tavalisest rakendusest?

Kui juba Blendis möllama peab, kas siis ei oleks lihtsam võtta päris projekt ning alustada sellega? Prototüübi viskame ju niikuinii ära aga seda saaks vähemasti hiljem edasi arendada…

Esiteks tavalise SL/WPF rakenduses prototüüpimisel kaob kogu see tagasiside osa ära, enam ei saa juurde kritseldada, tagasisidet eksportida ning hiljem Blendi importida.

Teiseks kuigi tundub, et mis see ka ära ei ole nuppudele sündmused külge ja veidi koodi, et vaated vahetuks. Kui see nii lihtne ja kiire protsess oleks, siis me ju ei prototüübikski, iga “prototüüp” oleks valmis rakendus…

Kolmandaks, erinevalt paberile või Photoshopi kritseldatud prototüübile ei pea SketchFlow prototüüpi ilmtingimata ära viskama. Minimaalselt kõik vaated ja paigutuse saab taaskasutada, lihtsalt stiil, mis paneb kõik väljanägema nagu kritseldused asendame, kliendile sobiva disainiga ja näidisandmete asemele kirjutame koodi, mis päris andmetega ühendub ja valmis. Seega aeg, mis kulub tõlkele Photoshop -> XAML hoiame kokku ja miskit tõlkes kaduma ka minna ei saa.

Meil on dokumenti vaja

Jah dokumenti on ka vaja, millele raha küsides toetuda, aga isegi selle teeb Blend meie eest ära, valime menüüst File -> Export as Microsoft Word ja meil on kõik vaated, veasituatsioonid ja muu loogiliselt sturktureerituna ühes failis, saab mõnusasti pakkumisele kaasa pista.

Kõik ongi nii roosiline?

See, kas kõik ongi nii roosiline, selgub siis kui on valmis kogu Sketchflow postituste sari, mis siin blogis nüüd iga nädal ilmuma hakkab. Stay tuned