Postoji milijun načina za izradu prezentacije, ali Figma je podcijenjen alat za to. Značajka prototipa u Figmi omogućuje mnoštvo prilagodljivih opcija prijelaza. Ne samo da će vaši prijelazi oduševiti vašu publiku, već možete ugraditi dodatke za dodatni čar i zadržati svoju publiku angažiranom, čineći da se osjećate sigurni u svoje vještine.

Pokazat ćemo vam kako napraviti ubitačnu prezentaciju pomoću Figme; samo slijedite ovaj vodič.

1. Postavite svoj prvi okvir za prezentaciju

Otvorena Figma i kliknite Nova datoteka dizajna. Kliknite na Alat za okvir (F) za crtanje okvira ili za odabir unaprijed postavljenog okvira s desne strane pomoću Prezentacija > Slajd 16:9. Možeš izradite glavni predložak uštedjeti vrijeme.

Preimenujte svoj okvir dvostrukim klikom na plavi naslov u gornjem lijevom kutu. Postavite boju pozadine; iako ga uvijek možete promijeniti kasnije tako da označite sve okvire i promijenite boju ispune.

2. Dodajte tekst naslova

Koristiti Alat za tekst (T) i napišite svoj naslov. Koristite zasebne tekstualne okvire za zasebne retke, sa samo jednom ili dvije riječi po retku. Postavite svoje postavke teksta u

instagram viewer
Tekst izbornik s desne strane. Figma koristi Google fontove, pa biste mogli znati najbolje parove Google fontova.

3. Dodajte sliku

Možeš koristiti stock fotografiju ili snimite vlastitu relevantnu fotografiju. Da biste dodali sliku, nacrtajte pravokutnik pomoću Alat za pravokutnik (R). Vaša će slika sjediti u ovom obliku.

Kliknite pravokutnik i idite na Napunite i kliknite na obojeni kvadrat. Zatim kliknite Čvrsto > Slika > Odaberi sliku. Pronađite svoju sliku i kliknite Otvorena. Zadržite pokazivač iznad slike da biste otkrili 4 bijela kruga. Kliknite i povucite jedan krug prema unutra kako biste zaokružili kutove svoje slike.

Rasporedite svoje slojeve tako da slika bude straga, a tekst na gornjem sloju. Slojeve možete povući na ploči slojeva ili pomoću Cmd/Ctrl + [ poslati sloj natrag ili Cmd/Ctrl + ] donijeti sloj naprijed.

4. Napravite prvi prijelaz

Prvi prijelaz će otvoriti sliku i omogućiti da tekst naslova klizne u okvir. Prvo, duplicirajte prvi okvir tako da ga odaberete i pritisnete Cmd/Ctrl + D da ga dupliciram.

Na lijevom okviru smanjite sliku smanjenjem atributa visine u H okvir na oko 150, ostavljajući horizontalni prorez slike. Poravnajte ga po sredini odabirom obje slike preko okvira i klikom Option + V (Mac) ili Alt + V (Windows).

Da biste dovršili prijelaz slike, odaberite lijevu sliku. Zatim promijenite neprozirnost na 0% u desnom izborniku u okviru pored Pass Through ispod sloja. To će sliku učiniti nevidljivom prije nego što prijeđe i otvori se.

Kliknite prvi tekstni okvir i držite pritisnut Shift. Počnite povlačiti, a zatim držite pritisnuto Razmaknica i nastavite povlačiti tekst izvan okvira. Čini se kao da nestane kad izađe iz kadra. Bez dodavanja razmaknice, ovaj prijelaz neće raditi, ali ako držite razmaknicu prije povlačenja, samo će pomaknuti vaš okvir.

Učinite to ponovno za svoje druge ili sljedeće tekstualne okvire, ali ih povucite malo dalje ulijevo da dodate malo raznolikosti u prijelaz. Dok je tekst još uvijek odabran, smanjite neprozirnost sloja na 0% na isti način kao što ste prethodno učinili za sliku.

Za postavljanje prijelaza idite na Prototip. Odaberite lijevi okvir i kliknite na plavi krug koji se pojavljuje u sredini desne strane okvira. Povucite je tako da linija ide do vašeg drugog okvira.

U padajućem izborniku koji kaže Trenutak, Odaberi Pametna animacija. Zatim promijenite kutiju sa štoperica do 1000ms. Ovo će postaviti da vaš prijelaz traje jednu sekundu od klika miša. Ostale postavke trebale bi biti postavljene prema zadanim postavkama. Pazite da ne preimenujete naslove okvira nakon postavljanja prijelaza, inače se datoteke neće povezati.

Kliknite na igra gumb za testiranje vašeg prijelaza. Vrati se na Oblikovati za nastavak dizajna prezentacije.

5. Dodajte još slajdova

Za prijelaz sa slajda 1 na slajd 2, duplicirajte svoj krajnji desni slajd (Cmd/Ctrl + D). U novom okviru—slajdu 2—premjestite tekstualne okvire iz okvira koristeći prethodnu tehniku ​​(Shift + Opterećenje zatim Razmaknica nakon što ste počeli povlačiti). Pomaknite jedan tekstni okvir ulijevo, a drugi udesno od okvira. Postavite neprozirnost na 0% za oboje.

Za sliku, smanjite je i malo pomaknite izvan centra, a zatim postavite neprozirnost na 0%. To vam zapravo daje prazno platno za vaš drugi slajd. Sadržaj možete dodati na vrh nevidljivih elemenata s prethodnog slajda.

Dodajte veliku sliku u središte okvira. Da biste dodali neke ukrase na svoju sliku, upotrijebite a Figma dodatak za GIF-ove ili preuzmite GIF naljepnicu s Giphyja i povucite ga na vrh slike. Odaberite svoju glavnu sliku i sve GIF-ove i grupirajte ih zajedno (Cmd/Ctrl + G), to osigurava da će Smart Animate ispravno raditi.

Odaberite grupu i kopirajte je (Cmd/Ctrl + C). Zatim ga zalijepite na okvir slajda 1 (Cmd/Ctrl + V). Smanjite ga i postavite neprozirnost na 0%. Zatim premjestite ovaj sloj na stražnji dio (Cmd/Ctrl + [). To osigurava gladak prijelaz na sljedeći slajd.

Ići Prototip. Odaberite slajd 2 i kliknite plavi krug da biste ga povukli na slajd 3. Zadana postavka Figme u izborniku prototipa je korištenje prethodnih postavki, tako da bi sve trebale biti postavljene u skladu s prethodnim prijelazom. Vrati se na Oblikovati.

Dupliciraj zadnji slajd (Cmd/Ctrl + D). Ovaj slajd koristit će istu sliku kao i prethodni, ali ćemo je skalirati na jednu stranu okvira. Pomaknite sliku lijevo od okvira povlačenjem dok je držite Shift. Zadržite pokazivač miša na desnom rubu slike dok se ne pojave suprotne strelice, kliknite i povucite desni rub slike prema lijevo dok ne budete zadovoljni.

Ići Prototip i povežite dva okvira zajedno. Zatim se vratite na Oblikovati.

Dodajte naslov i tijelo teksta desno od skalirane slike i grupirajte ih zajedno. Kopirajte grupu teksta i zalijepite je na prethodni slajd. Kliknite i povucite grupu teksta desno od okvira kao i prije.

6. Dodajte maketu

Napravite maketu; provjerite naše vodič za izradu maketa pomoću dodataka u Figmi. Dodajte novi okvir, a zatim zalijepite svoju maketu na njega. Promijenite veličinu makete tako da stane u okvir.

Kopirajte maketu i zalijepite je na prethodni okvir. Promijenite mu veličinu tako da stane u dio slike, a zatim ga premjestite na stražnju stranu slojeva i postavite neprozirnost na 0%. Povežite okvire Prototip.

7. Dodajte oznake

Duplicirajte okvir za maketu. Dodajte naslov i opis kako biste objasnili dijelove svoje makete. Grupirajte tekst i imenujte ga. Onda možete stvoriti indikator mat stakla za vaše metke i crte. Grupirajte jednu liniju s jednim krugom. Poravnajte svoj indikator s onim što opisuje i dodajte svoj opis pored njega. Povežite okvire Prototip.

Duplicirajte okvir i dodajte još jedan indikator točke s onim što opisuje. Opet prototipirajte ovo. Duplicirajte svaki okvir po točki nabrajanja, tako da svaka točka prelazi sama.

8. Završite svoju prezentaciju

Duplicirajte zadnji slajd. Napišite posljednju riječ ili dvije i centrirajte je. Kopirajte tekst i zalijepite ga na prethodni slajd.

Smanjite tekst držeći K dok ga skalirate—to će vaš tekst zadržati formatiranim dok ga smanjujete. Stavite svoj tekst negdje pri vrhu makete i pošaljite sloj na stražnju stranu, ispod slike. Postavite neprozirnost na 0%. Vratite se na svoj posljednji slajd.

Premjestite sve ostale objekte izvan okvira metodom povlačenja. Prijelaz će sve pomaknuti prema stranama i vrhu dok se tekst pomiče prema dolje od vrha i širi. Veza se uvlači Prototip.

9. Podijelite svoju Figma prezentaciju

Svojoj prezentaciji možete pristupiti s bilo kojeg mjesta gdje se možete prijaviti na svoj Figma račun ili podijeliti URL s drugima kako bi ih mogli gledati s bilo kojeg mjesta. Da biste predstavili svoju konačnu prezentaciju s prijelazima, kliknite na igra gumb i prikazan na cijelom zaslonu.

Okvire možete spremiti i kao PDF-ove, iako ćete time izgubiti animirane prijelaze.

Podignite svoje prezentacije uz pomoć Figme

Ne samo da je ova prezentacija minimalistička, što neće preplaviti vašu publiku, nego su prijelazi profesionalni i čisti. Nije potreban stručnjak za UI/UX da biste koristili Figmu na način koji koristi vašim prezentacijama, bez obzira na vašu radnu ulogu. Predstavite s povjerenjem i bit ćete preplavljeni pitanjima o tome kako je vaša prezentacija napravljena.