Izrada prototipa unutar skice 49 - Saznajte kako to radi i što možete učiniti do

Sketch 49 donosi kući jednu od najiščekivanijih i najtraženijih karakteristika - mogućnost stvaranja i dijeljenja brzih interaktivnih prototipa.

Tijekom godina nevjerojatna zajednica trećih proizvođača Sketcha učinila je Sketch nevjerojatno proširivim dizajnerskim alatima. Kao rezultat, možemo uživati ​​u desecima sjajnih popratnih proizvoda i prototipa za prototipiranje poput Protowire, Craft, Mirr, Principle, Framer, Flinto, Flow, Marvel, Atomic, Kite, Origami, CanvasFlip, Proto i ProtoPie, samo da nazovemo ime nekoliko.

„Bi li donijeli izradu prototipa na Sketchu?“ Možda je najčešće postavljano pitanje na forumima i tijekom sastanaka s dizajnom. Danas je Sketch na ovo pitanje odgovorio krupno i hrabro, „Da“.
Zavičajno prototipiziranje konačno je ovdje.

Jednostavnost stvari bila je konzistentna tema za Sketch i važan razlika između ostalih alata za dizajn i Sketch. Živimo u vremenu preopterećenosti informacijama, a to dolazi s rastućim popisom očekivanja i zahtjeva za dizajnere, programere i ljude proizvoda. Evolucija dizajna interakcije, pritisak da se brzo pošalju i ne budu sigurni, kao i želja za ponovnom uporabom komponenti potiču ideju da se radi više s manje ili se koristi jedan alat za mnoge važne svrhe.

Postoje namjenski alati za izradu prototipa za interakciju s naprednim mogućnostima animacije, značajkama vremenske trake i ključnih okvira te funkcijama olakšavanja. Prototipiranje unutar Sketch-a je jednostavno, ali fenomenalno! Još nećete pronaći napredne značajke animacije. To morate imati na umu kad istražujete ovu prvu verziju.

Dakle, što prototipiranje izgleda unutar Sketcha?

Tu je koristan vodič za početak rada koji možete pronaći pod Skica> Datoteka> Novo iz predloška> Vodič za izradu prototipa. Ukratko ćemo pogledati ove upute i značajke prototipa.

Nove ikone i prečice za izradu prototipa

Kad otvorite najnoviju verziju Sketch-a, možda ćete primijetiti ove ikone.

Pritisnite W da biste dodali vezu na sloj ili grupuPritisnite H za umetanje sloja žarišne točkeControl + F će sakriti / pokazati prototipiranjeCommand + P otvorit će Pregled

Slično slojevima simbola, slojevi veze i žarišne točke označeni su ikonom prilagođene mape na popisu slojeva na lijevoj strani.

Prikazivanje gumba s žarišnom točkom na popisu slojeva

Inspektor i animacije

Odabirom sloja otkrit će se novi odjeljak za prototipiranje u Inspektoru. Ovdje ćete moći stvarati i brisati Dodirne ciljeve. Nadalje, trenutno ćete moći odabrati između nekoliko osnovnih prijelaza na Artboardu:

❇ Bez animacije
← Animirana ploča s desne strane
↑ Animirana ploča s vrha
→ Lijeva animirana ploča
↓ Animirana ploča s dna

Veze i žarišta

Da biste stvorili prototip, trebat će vam najnovija verzija Sketch-a, kao i nekoliko ploča umjetničkih ploča u vašem dokumentu. Zatim možete spojiti slojeve ili simbole (što je vrlo moćno ako razmislite o ugnježđenim simbolima) s različitim pločama sa vezama i slojevima žarišne točke. Pogledajte donji primjer u kojem povezujemo sličicu s prikolicom na ploči programa Player s Animate Artboard odozgo.

Stvaranje veza i žarištaPritisnite H za umetanje sloja žarišne točke

Hotspot je vrsta sloja koja omogućuje crtanje oblika, cilja dodira preko dijela vašeg dizajna i povezivanje s umetničkom pločom. Što je još važnije, slojevi žarišne točke mogu pripadati unutar simbola gdje se može prevladati njihovo ciljno odredište. Možete vidjeti kako se svaka Hotspot može prilagoditi poništavanjem u donjem primjeru. Također možete pretvoriti vezu u žarišnu točku odabirom sloja i klikom na ikonu Stvori žarišnu točku u Inspektoru.

Slojevi vruće točke unutar simbola

pregled

Kad pregledate svoj prototip, možda ćete primijetiti i malu ikonu zastave. Ovo je oznaka početne točke i omogućuje vam odabir ploče s mjesta na kojem želite pokrenuti prototip. Posebno je korisno za dokumente s mnogim Artboardsima. Dakle, da biste postavili početnu točku, prvo morate pregledati ploču i kliknuti na ikonu zastave.

Pregled prototipa

Long Views aka Pomicanje matičnih ploča

Više nego često moramo prikazivati ​​sadržaj kao što su feedovi vijesti ili dugi detalji transakcija. U ovom slučaju možemo jednostavno stvoriti dulju Artboard kako bismo prikazali prikaz koji će se pomicati. Prilikom pregleda prototipa, dulje Artboards automatski se pomiču prema unaprijed zadanom Artboardu.

Pomicanje pogleda u pregledu skice

Povratne informacije i suradnja prototipa

Prototip u Sketch Cloudu

Nakon što definirate početnu točku i očistite svoj prototip, možete je podijeliti u Sketch Cloudu. Pomoću Sketch Clouda brzo možete pregledati i komentirati dizajne i prototipove. Vaše kolege i prijatelji moći će to učiniti jedinstvenom vezom.

Nadalje, ako demonstrirate prototip maloj publici, možete koristiti Sketch Mirror da biste pregledali svoj prototip na uređaju za koji je dizajniran. Sketch Mirror je aplikacija za konekciju za iOS koja omogućuje pregled dizajna gotovo u stvarnom vremenu na iPhoneu ili iPadu. Kada pokrenete Mirror na iOS-u, vidjet ćete obavijest o vezi u gornjem desnom kutu ili prozor Sketch. Kliknite da biste se povezali.

Sketch Mirror, aplikacija za iOS kolegama, za pregled dizajna i prototipa putem Wi-Fi iUSB Lightning kabela.

Verzija 49 donosi i zajedničke biblioteke na Sketch Cloudu i još mnogo toga. Pogledajte sve što je novo u ovom postu na blogu.

Dizajn + Sketch i Sketch App izvori posvećeni su vam pružiti ono najbolje iz Sketch-a. Otkrijte više od 3000 resursa od dizajnera i programera širom svijeta. Kada stvorite sljedeći Sketch dizajn ili prototip, razmislite o tome da ga podijelite sa zajednicom.