01 nga 03
Përditësimi i fundit i Atomic.io përfshin kontenierë të lëvizshëm
Disa muaj mbrapa i tregova se si atomic.io mund të përdoret për të prototipuar lëvizjen . Një nga pikat kyçe që bëra në pjesë ishte "shfaqja e lëvizjes" në vend që ta linte atë në imagjinatën e klientit apo të ekipit është e rëndësishme. Në fakt, kjo është bërë kaq kritike sa që një kategori krejt e re e mjeteve UX / UI po shfaqet në skenë. Ato përfshijnë - Apple Keynote, Adobe Edge Animate, After Effects dhe UXPin , për të përmendur disa. Kec i ri në bllok është Atomic.io i cili ishte në beta të hapur kur kam shkruar për produktin.
Gjëja e zjarrtë në lidhje me betatet e hapura është që i japin prodhuesit të softuerit mundësinë për të mbledhur reagimet e përdoruesit në setin e funksioneve, duke përfshirë veçoritë që mungojnë, dhe pastaj t'i shtojnë ato në aplikacion dhe t'i testojnë ato para lëshimit komercial. Në rastin e atomit, një veçori që humba me të vërtetë ishte aftësia për të lëvizur përmbajtjen vertikalisht ose horizontalisht. Kjo mund të përfshijë gjëra të tilla si karta, shfaqje rrëshqitëse ose pothuajse çdo gjë që një përdorues do të rrëshqasë ose terhiq brenda kufijve të ndërfaqes së një aplikacioni ose faqeje.
Kjo duhet të ketë qenë një temë shumë e kërkuar nga përdoruesit sepse kontejnerët e shkyçur u prezantuan vetëm me aplikacionin këtë muaj dhe, duhet të pranoj, krijimi i përmbajtjes së rrotullueshme në prototip është i vdekur i thjeshtë për t'u mundësuar.
Ja se si ...
02 nga 03
Si të krijohet përmbajtja vertikale e lëvizjes në atom
Ju do të duhet që së pari të regjistroheni për një gjykim të lirë prej 30 ditësh dhe, në fund të asaj periudhe, do të paraqiteni me tre plane çmimi.
Gjëja e parë që duhet të dini është se të gjitha veprimet që do të bëni është në shfletuesin dhe aplikacioni ka për qëllim rreptësisht në Google Chrome. Sapo të hyni, do të merrni në faqen e Projekteve . Për të hapur aplikacionin, kliko butonin New Project .
Kur të shfaqet ndërfaqja do të shihni se ka një numër të kufizuar mjetesh, aftësinë për të shtuar faqe dhe shtresa në faqe, në tabelën e tabelave dhe mbi të djathtën, një panel pronash të ndjeshme ndaj kontekstit.
Në këtë shembull, fillova me një parazgjedhje iPhone 5 që është 320 x 568. Unë pastaj hap dosjen që përmban imazhet që do të lundronin dhe i tërhoqën ato në kanavacë. Ato u shtuan automatikisht në projekt dhe ju mund të shihni se janë në shtresa individuale nëse klikoni në skedën Shtresat . Pastaj zgjodha mjetin Arrow (Selection), zgjodha një imazh dhe e tërhoqa atë në një pozicion të ri në mënyrë që të shtoj një hapësirë midis tyre. Pastaj zgjodha të gjitha imazhet dhe klikova butonin Distribute Vertically në toolbar. Kjo shpërndan në mënyrë të barabartë imazhet.
Hapi i ardhshëm është që të zgjidhni të gjithë përmbajtjen që duhet të shkoni dhe të klikoni butonin e kontejnerit ose zgjidhni Krijo përmbajtjen e shkrimit nga butoni i grupit . Sapo të krijohet kontejneri - do ta shihni atë në panelin e Shtresave - klikoni enën dhe tërhiqni dorën lart në pjesën e poshtme të kanavacës . Klikoni butonin Preview në fund të panelit Properties dhe kjo do të nisë një dritare të shfletuesit. Përdorni rrotullën e lëvizjes së miut për të lëvizur përmbajtjen. Për t'u kthyer në projektin tuaj, klikoni butonin Edit në fund të djathtë të dritares së shfletuesit.
03 nga 03
Si të krijoni përmbajtje horizontale për rrotullim në atomik
Scroll horizontale është po aq e lehtë për të arritur.
Në këtë rast, zvarritën një sërë imazhe në kanavacë dhe i vendosën ato kundër njëri-tjetrit. Me imazhet e zgjedhura, unë pastaj kliko butonin Top Align për të siguruar që të gjithë të renditen me njëri-tjetrin.
Më pas e mbani shtypur butonin Shift dhe zgjodhët çdo shtresë në panelin Shtresat. Me imazhet e zgjedhura, kam klikuar butonin e kontejnerit dhe , në panelet e pronave, të zgjedhura Horizontale në sferën e Sjelljes.
Unë pastaj testuar projektin në një dritare Browser duke klikuar butonin Preview.
Megjithëse kam treguar se si të krijoni versione individuale të Scroll Vertical dhe Horizontal, për aq kohë sa vendosni përmbajtjen e shkrirë në një enë, mund t'i keni këto kontejnerë në zona të ndara të ekranit. Për shembull, një faqe në internet mund të ketë vertikalisht përmbajtjen e skedarit në një meny të anës dhe përmbajtjen horizontalisht të lëvizjes në një diapozitivësh në të njëjtën faqe. Në fakt, një enë mund të ketë si scrolling vertikale dhe horizontale për sende të tilla si një përzgjedhës imazhi që ka një duzinë apo më shumë miniatura.
Për të mësuar më shumë rreth kësaj karakteristike në atomic.io shikoni:
- Njoftimi i blogut
- Udhëzimi për rrotullimin e enëve
- Duke maskuar duke përdorur kontejnerët
- Zgjidhja e problemeve të kontenierëve të lëvizshëm