Predstavitev oblikovanja je ena od osrednjih zahtev pri razvoju aplikacij. Razvijalci so odvisni od tvojih oblikovanj, da uspešno uresničijo aplikacijo. V tem priročniku ti bom pokazal, kako lahko svoja oblikovanja enostavno preneseš v InVision, tako da ima tvoja ekipa oblikovalcev vedno dostop do najnovejših različic. S pomočjo InVisiona zagotoviš, da so tvoje ideje optimalno vizualizirane in komunikacije, hkrati pa lahko preprosto vnašaš spremembe.

Najpomembnejši vpogledi

  • InVision omogoča enostavno sinhronizacijo in predstavitev oblikovanj.
  • Svoja oblikovanja lahko izvozite neposredno iz Sketch-a in jih naložite v InVision.
  • Orodje ponuja različne načine za ogled in interakcijo s prototipi.
  • Funkcije povratnih informacij in komentarjev podpirajo sodelovanje med oblikovalci in razvijalci.

Navodila po korakih

Korak 1: Ustvari nov projekt v InVisionu

Najprej odpri InVision in ustvari nov projekt. Izberi možnost, da ustvariš „Prototip“ in se odloči za predlogo iPhone, da svoja oblikovanja optimalno predstaviš za mobilne naprave. Kot ime projekta izberi „Mobility Stream Udemy“ in klikni na „Ustvari“.

Pripravite profesionalne oblike z InVision

Korak 2: Izvoz oblikovanj iz Sketch-a

Ko je projekt nastavljen, uvozi svoja oblikovanja iz Sketch-a. Pri tem postopku moraš zagotoviti, da izbereš prava artboarde in jih naložiš v InVision. Datoteke lahko preprosto povlečeš in spustiš v InVision projekt. Pomembno je, da izbereš pravo obliko izvoza iz Sketch-a, da se izogneš težavam.

Profesionalno oblikovanje s InVision

Korak 3: Namesti InVision plugin

Za poenostavitev postopka sinhronizacije bi moral uporabiti InVision plugin za Sketch. Namesti plugin, prijavi se s svojim InVision računom in aktiviraj možnost sinhronizacije. To ti omogoča prenos sprememb oblikovanja neposredno iz Sketch-a v tvoj InVision projekt, brez da bi datoteke moral ročno nalagati.

Profesionalno oblikovanje z InVision

Korak 4: Dodaj vmesnike artefaktom

Zdaj lahko ustvariš uporabniški vmesnik svoje aplikacije in interaktivno oblikuješ posamezne zaslone. Klikni na gumbih v načinu izdelave, da ustvariš točke vročine, ki simulirajo navigacijo v aplikaciji. Izbereš lahko različne prehode, kot so „Slide in“ ali „Instant“, da realistično prikažeš uporabniško izkušnjo.

Poklicno oblikovanje z InVision

Korak 5: Določi prehode

Ko si dodal interakcije, je pomembno, da določiš prave animacije za prehode med zasloni. Pri tem lahko izbereš tip animacije, ki bo učinkoval ob prehodu na drug zaslon. Poskrbi, da so ti detajli jasno in natančno predstavljeni razvijalcem, da lahko uresničijo želeno vedenje.

Profesionalno predstavitev oblikovalskih rešitev z InVision

Korak 6: Določi barve in ozadja

Prav tako bi moral poskrbeti, da so vse barve ozadja in stilistični detajli pravilni. Pogosto se pozabi določiti barve ozadja v Sketch datotekah. Preveri vsak zaslon in se prepričaj, da so ozadja, ki si jih predvidel v oblikovanju, tudi prikazana v InVisionu. Poskrbi, da vse skupaj izgleda harmonično.

Oblikovanje profesionalno z InVisionom

Korak 7: Sinhronizacija in posodobitev

Ko si opravil vse spremembe, je čas, da vse sinhroniziraš. Shrani spremembe v Sketchu in klikni na gumb za sinhronizacijo v pluginu. To bo avtomatsko posodobilo tvoje nove zaslone in prilagoditve v InVisionu. Upoštevaj, da ta postopek lahko traja nekaj časa.

Poklicno oblikovanje z InVision zagotavljanje

Korak 8: Zbiranje povratnih informacij

Izkoristi funkcijo komentarjev in povratnih informacij v InVisionu, da razjasniš splošna vprašanja o svojih oblikovanjih. Neposredno v prototipu lahko dodaš komentar, ki ga lahko odgovori drugi člani ekipe. To je še posebej koristno, da se prepričaš, da tvoje oblikovanje ustreza navodilom in da so vsa pričakovanja izpolnjena.

Profesionalno oblikovanje z InVision

Korak 9: Zaključek predstavitve

Na koncu bi moral testirati svoja oblikovanja in se prepričati, da vse deluje brezhibno. Preveri vse točke vročine, ki si jih ustvaril, in simuliraj interakcijo, da pridobiš izkušnje iz uporabniške perspektive. Tako se prepričaš, da je celotna slika usklajena, preden jo predstaviš svoji ekipi ali razvijalcem.

Povzetek - Uspešno predstavitev oblikovanj v InVisionu

V tem priročniku si se naučil, kako svoja oblikovanja korak za korakom predstaviti v InVisionu. Izvedel si, kako enostavno je delati z InVisionom in kako lahko povečaš učinkovitost svojih prenosov oblikovanj. Natančna priprava in uporaba koristnih funkcij ti bosta pomagala uspešno oblikovati svoje projekte in svoji ekipi razvijalcev zagotoviti potrebne informacije.

Pogosto zastavljena vprašanja

Kako namestim InVision plugin za Sketch?Prenesi plugin z InVision spletne strani in upoštevaj navodila za namestitev.

Kako sinhroniziram oblikovanja iz Sketch-a z InVisionom?Shrani svoja prizadevanja in klikni na gumb za sinhronizacijo v InVision pluginu, da naložiš oblikovanja.

Katera ozadja bi morala biti uporabljena v oblikovanjih?Uporabi edinstvene barve ozadja za vse zaslone, da se prepričaš, da se pravilno prikazujejo v InVisionu.

Ali lahko povratne informacije zbiram neposredno v InVisionu?Da, lahko dodaš komentarje k svojemu prototipu in prejmeš povratne informacije od drugih članov ekipe.

Kaj lahko naredim, če animacije ne delujejo pravilno?Preveri izbiro prehodov in preizkusi vsak zaslon, da se prepričaš, da vse deluje, kot si želiš.