Përmbajtje
- Bëni prototipin tuaj
- 01. Mjetet dhe pikëpamjet
- 02. Bëni të lëvizshëm
- 03. madeshtë bërë nga arna
- 04. Grupi i shtresave
- 05. Bërja e lidhjeve
- 06. Ndërtoni famën tuaj
- 07. Riemërto shtresën tënde
- 08. Ndryshimi i errësirës
Quartz Composer është një mjet i fuqishëm me grafikë lëvizje nga Apple, i përdorur fillimisht për gjithçka, nga grafika e transmetuar te mbrojtësit e ekranit. It’sshtë një mjet vizual jo-linear - funksionon duke lidhur pika dhe ide, sesa duke shkruar kod ose duke përcaktuar korniza fikse.
Megjithëse nuk u krijua fillimisht për punën e dizajnit të ndërveprimit, fleksibiliteti dhe shpejtësia e tij e bëjnë atë një mjedis ideal për dizajnerët.
Ndërtoni faqen tuaj me këto 60 udhëzime të shkëlqyera WordPress
Origami është një paketë mjetesh për QC, e zhvilluar nga Facebook, që e bën prototipizimin më të lehtë duke përmbledhur modelet dhe konceptet e zakonshme të përdorura nga dizajnerët e ndërveprimit.
Prototipizimi me QC është i shpejtë: ju mund të ndryshoni një përbërje (të ndryshoni vlera, të bëni lidhje të reja midis riparimeve, të ndërroni një imazh të ri) gjatë fluturimit, pa pasur nevojë të rikompiloni ose të prisni që ai rezultat të hyjë në fuqi në prototipin tuaj.
Bëni prototipin tuaj
Kjo e bën QC shumë më të shpejtë se një mjedis kodi që varet nga rimbushja, ose një mjet i bazuar në video që kërkon ri-interpretim.
Edhe pse ky udhëzues ju çon drejt një prototipi përfundimtar në një mënyrë të drejtpërdrejtë, është shumë më e zakonshme që dizajnerët të luajnë në QC, duke kaluar porte të ndryshme me vlera të ndryshme. Ndërtimi i aftësive në QC kërkon kohë.
Ky udhëzues ka për qëllim t'ju prezantojë me këtë mjet të fuqishëm, t'ju japë një pikënisje për eksplorimin në të ardhmen dhe të vendosni një themel për ndërtimin dhe praktikimin.
Ne do të mbulojmë bazën e krijimit të kompozimeve: duke punuar me imazhe, tranzicione, animacione, ndërprerës dhe ndërveprimet më të thjeshta. Për të filluar, do të duhet të merrni QC dhe Origami duke ndjekur udhëzimet në origami.facebook.com.
01. Mjetet dhe pikëpamjet
Kur krijoni një përbërje të re Kompozitor Quartz (QC), do të paraqiteni me një Redaktor dhe një dritare Viewer. Redaktori është një pamje rrjeti që mban arna - tani për tani, vetëm një Pastrim.
Shikuesi do të jetë bosh, pasi gjithçka që është në dokumentin tonë është një fushë e qartë me të zezë. Ndërsa futni më shumë copëra në Redaktor, do të shihni azhurnimin e Viewer në kohë reale.
02. Bëni të lëvizshëm
Futja e patch-it të Telefonit të Origami është hapi i parë në çdo përbërje QC të lëvizshme. Për të futur një copë toke, shtypni cmd + Enter për të dalë në dritaren e Bibliotekës. Shkruani 'Phone' në kokën e shtypit dhe shtypni butonin Enter për të futur copën në Editor. Do të shihni një iPhone të bardhë që shfaqet në Viewer. Ndiqni të njëjtat hapa për të futur rregullimet e Grupit të Shtresave dhe Dimensioneve të Telefonit.
03. madeshtë bërë nga arna
Arnimet janë paraqitje të funksionalitetit, të dhënave ose imazheve. Ata marrin input dhe sigurojnë dalje përmes 'petëve' të lidhura me 'portet' e etiketuara. Të dhënat rrjedhin nëpër këto porta nga e majta në të djathtë.
Lidhni portën e gjerë Pixels në Përmasat e Telefonit me portën përkatëse në Grupin e Shtresave duke klikuar në pikën në patch-in e parë dhe pastaj duke klikuar në pikën në të dytën (gjithashtu mund të tërhiqni midis portave për t'i lidhur ato). Pastaj mund të lidhni Portën e Imazhit të Layer Group me portën e Ekranit të Telefonit.
04. Grupi i shtresave
Layer Group është një copë makro që sheshon shtresat dhe përmbajtjen brenda tij në një imazh të vetëm - mendojeni si një objekt i zgjuar në Photoshop. E gjithë puna jonë pasuese do të zhvillohet brenda kësaj patch-i. Klikoni dy herë në patch për ta hapur. Ju mund të riktheheni në heirarkinë tuaj në çdo kohë duke shtypur butonin Redakto Prindin në shiritin tuaj të mjeteve.
05. Bërja e lidhjeve
Tani që jemi në Grupin tonë të Shtresave, tërhiqni skedarin PhotoGrid.png në dritaren e Redaktorit. Ju do të shihni një fotografi të shtresës së imazhit dhe shtresës në Editor dhe do të shihni vetë imazhin që shfaqet brenda Viewer. Do të vini re se arnimet e Imazhit dhe Shtresës janë të lidhura përmes portave të tyre të Imazhit.
Mund të tingëllojë e komplikuar, por në të vërtetë ka shumë kuptim. Imazhe individuale në QC mund të lidhen me shumë shtresa, ose mund të vendosni t'i ekzekutoni ato përmes filtrave ose rregullimeve të tjera para se t'i lidhni ato me një shtresë.
06. Ndërtoni famën tuaj
Për t'u njohur me mënyrën e funksionimit të Shtresave në Quartz Composer, zgjidhni patch Layer nga hapi i mëparshëm dhe shtypni cmd + T për të parë parametrat e patch. Luaj paksa me portat e Pozicionit X, Pozicionit Y dhe Opacity për të kuptuar sesi lëvizin dhe sillen shtresat në ekran.
Ju do të vini re se QC punon në një sistem të rrafshit koordinativ me 0 që është në qendër të ekranit dhe se Opacity punon në një sistem dhjetor, duke filluar nga 0 në 1.0. Kur të keni mbaruar së luajturi, vendosni pozicionet përsëri në 0 dhe Opacity përsëri në 1.
07. Riemërto shtresën tënde
Riemërtoni shtresën tuaj duke klikuar dy herë në titull. Riemërtoni atë 'Photo Grid'.
08. Ndryshimi i errësirës
Vendosni dy rregullime të Tranzicionit dhe lidhni portat e progresit të daljeve të tyre përkatësisht me portat e Opacity dhe Alpha të shtresës Photo Grid. Ne do të përdorim arna të Tranzicionit për të zhvendosur vlerat e Opacity dhe Alpha të rrjetit fotografik, siç shihet në daljen përfundimtare.
Faqja tjetër: më shumë se si të ndërtoni një prototip me Quartz Composer
