Esitluse tegemiseks on miljon viisi, kuid Figma on selle jaoks alahinnatud tööriist. Figma prototüübi funktsioon võimaldab palju kohandatavaid üleminekuvalikuid. Teie üleminekud mitte ainult ei lumma teie vaatajaskonda, vaid saate lisada ka pistikprogramme, et luua lisapisa ja hoida kuulajaskonda kaasatud, pannes teid oma oskustes kindlalt tundma.
Näitame teile, kuidas teha Figma abil tapvat esitlust; lihtsalt järgige seda juhendit.
1. Seadistage oma esimene esitlusraam
Avatud Figma ja klõpsake Uus kujundusfail. Klõpsake nuppu Raami tööriist (F), et joonistada oma raam või valida eelseadistatud raam paremalt kasutades Esitlus > Slaid 16:9. Sa saad looge põhimall et aega kokku hoida.
Nimetage raam ümber, topeltklõpsates vasakus ülanurgas sinisel pealkirjal. Määrake taustavärv; kuigi saate seda alati hiljem muuta, tõstes esile kõik raamid ja muutes täitevärvi.
2. Lisage pealkirja tekst
Kasuta Tekstitööriist (T) ja kirjutage oma pealkiri. Kasutage eraldi ridade jaoks eraldi tekstivälja, kus rea kohta on ainult üks või kaks sõna. Määrake oma tekstieelistused jaotises
Tekst menüü paremal. Figma kasutab Google'i fonte, nii et võite soovida teada parimad Google'i fontide paarid.3. Lisa pilt
Sa saad kasutage stock fotot või tehke oma asjakohane foto. Pildi lisamiseks joonistage ristkülik, kasutades nuppu Ristküliku tööriist (R). Teie pilt istub sellisel kujul.
Klõpsake ristkülikut ja minge lehele Täida ja klõpsake nuppu värviline ruut. Seejärel klõpsake Tahke > Pilt > Vali pilt. Leidke oma pilt ja klõpsake Avatud. Hõljutage kursorit pildi kohal, et kuvada 4 valget ringi. Pildi nurkade ümardamiseks klõpsake ja lohistage üks ring sissepoole.
Paigutage oma kihid nii, et pilt oleks taga ja tekst ülemisel kihil. Kihid saate lohistada kihtide paneelil või kasutades Cmd/Ctrl + [ kihi tagasi saatmiseks või Cmd/Ctrl + ] kihi ette toomiseks.
4. Loo esimene üleminek
Esimene üleminek avab pildi ja võimaldab pealkirja tekstil raami sisse libiseda. Esiteks dubleerige esimene kaader, valides selle ja vajutades Cmd/Ctrl + D selle dubleerimiseks.
Vasakpoolses raamis vähendage pilti, vähendades kõrguse atribuute H kasti umbes 150-ni, jättes pildile horisontaalse pilu. Joondage see keskele, valides mõlemad pildid üle raami ja klõpsates Opunkt + V (Mac) või Alt + V (Windows).
Pildi ülemineku lõpuleviimiseks valige vasakpoolne pilt. Seejärel muutke läbipaistmatus 0%-ni parempoolses menüüs, mis asub kihi all valiku Pass Through kõrval. See muudab pildi enne üleminekut ja avamist nähtamatuks.
Klõpsake esimest tekstikasti ja hoidke all Shift. Alustage lohistamist, seejärel hoidke ka all Tühikuklahv ja jätkake teksti raamist välja lohistamist. Tundub, et see kaob korra kaadrist välja. Ilma tühiku lisamiseta see üleminek ei tööta, kuid kui hoiate enne lohistamist tühikuklahvi all, liigutab see ainult teie raami.
Tehke seda uuesti oma teise või järgnevate tekstikastide puhul, kuid lohistage neid veidi vasakule, et üleminekut muuta. Kui tekst on endiselt valitud, vähendage kihi läbipaistmatust 0% -ni samamoodi nagu varem pildi puhul.
Ülemineku määramiseks minge aadressile Prototüüp. Valige vasakpoolne raam ja klõpsake nuppu sinine ring mis kuvatakse raami parempoolse külje keskel. Lohistage seda, nii et joon läheb teie teise kaadrini.
Rippmenüüs, mis ütleb Kohene, valige Nutikas animatsioon. Seejärel vahetage kasti stopper kuni 1000 ms. See määrab teie üleminekuks ühe sekundi pärast hiireklõpsu. Muud sätted peaksid olema vaikimisi määratud. Veenduge, et te pärast ülemineku seadistamist raamide pealkirju ümber ei nimetaks, vastasel juhul ei saa failid ühendust luua.
Klõpsake nuppu Mängi nuppu oma ülemineku testimiseks. Mine tagasi Disain esitluse kujunduse jätkamiseks.
5. Lisage rohkem slaide
Slaidilt 1 slaidile 2 üleminekuks kopeerige parempoolseim slaid (Cmd/Ctrl + D). Uues raamis – slaidis 2 – teisaldage tekstikastid raamist välja, kasutades eelmist tehnikat (Shift + Vedama siis Tühikuklahv pärast seda, kui olete lohistama hakanud). Liigutage üks tekstikast raamist vasakule ja teine paremale. Määrake mõlema jaoks läbipaistmatuseks 0%.
Kujutise jaoks vähendage seda ja nihutage seda veidi keskelt välja, seejärel määrake läbipaistmatuseks 0%. See annab teile teise slaidi jaoks tühja lõuendi. Saate lisada sisu eelmise slaidi nähtamatute varade peale.
Lisage raami keskele suur pilt. Pildi peale kaunistuste lisamiseks kasutage a Figma pistikprogramm GIF-ide jaoks või laadige Giphyst alla GIF-kleebis ja lohistage see pildi peale. Valige oma põhipilt ja kõik GIF-id ning rühmitage need kokku (Cmd/Ctrl + G), tagab see, et Smart Animate töötab korralikult.
Valige grupp ja kopeerige see (Cmd/Ctrl + C). Seejärel kleepige see 1. slaidi raamile (Cmd/Ctrl + V). Vähendage seda ja määrake läbipaistmatuseks 0%. Seejärel liigutage see kiht taha (Cmd/Ctrl + [). See tagab sujuva ülemineku järgmisele slaidile.
Minema Prototüüp. Valige slaid 2 ja klõpsake sinist ringi, et lohistada see 3. slaidile. Figma vaikimisi prototüübi menüüs on kasutada eelmisi sätteid, seega tuleks need kõik seadistada vastavalt eelmisele üleminekule. Mine tagasi Disain.
Kopeeri viimane slaid (Cmd/Ctrl + D). See slaid kasutab sama pilti, mis eelmine, kuid me skaleerime selle kaadri ühele küljele. Liigutage pilti raamist vasakule, hoides seda lohistades Shift. Hõljutage kursorit pildi paremas servas, kuni ilmuvad vastassuunalised nooled, klõpsake ja lohistage pildi paremat serva vasakule, kuni olete rahul.
Minema Prototüüp ja ühendage need kaks raami kokku. Seejärel minge tagasi juurde Disain.
Lisage skaleeritud pildist paremale pealkiri ja kehatekst ning rühmitage need kokku. Kopeerige tekstirühm ja kleepige see eelmisele slaidile. Klõpsake ja lohistage tekstirühma raamist paremale nagu varem.
6. Lisa makett
Loo makett; vaadake meie juhend maketide loomise kohta Figma pistikprogrammide abil. Lisage uus raam ja seejärel kleepige sellele oma makett. Muutke maketi suurust, et see sobiks raamiga.
Kopeerige makett ja kleepige see eelmisele kaadrile. Muutke selle suurust, et see mahuks pildiosa sisse, seejärel liigutage see kihtide taha ja määrake läbipaistmatuseks 0%. Ühendage raamid sisse Prototüüp.
7. Lisa sildid
Kopeeri maketiraam. Lisage maketi osade selgitamiseks pealkiri ja kirjeldus. Rühmitage tekst kokku ja nimetage see. Siis saate luua mattklaasi indikaator täppide ja joonte jaoks. Rühmitage kokku üks rida ühe ringiga. Joondage oma indikaator sellega, mida see kirjeldab, ja lisage oma kirjeldus selle kõrvale. Ühendage raamid sisse Prototüüp.
Kopeerige raam ja lisage veel üks täppinäidik koos sellega, mida see kirjeldab. Selle prototüüp uuesti. Dubleerige iga kaader täppide kohta, nii et iga täpp läheb üle üksi.
8. Lõpetage oma esitlus
Kopeeri viimane slaid. Kirjutage üks või kaks viimast sõna ja asetage see keskele. Kopeerige tekst ja kleepige see eelmisele slaidile.
Vähendage teksti hoides K skaleerimise ajal – see hoiab teie teksti vormindatuna, vähendades selle suurust. Asetage tekst maketi ülaosa lähedale ja saatke kiht taha, pildi alla. Määrake läbipaistmatuseks 0%. Minge tagasi viimase slaidi juurde.
Teisaldage kõik ülejäänud objektid raamist välja, kasutades lohistamismeetodit. Üleminek libiseb kõik väljapoole külgede ja ülaosa suunas, kui tekst liigub ülevalt alla ja laieneb. Link libiseb sisse Prototüüp.
9. Jagage oma Figma esitlust
Saate oma esitlusele juurde pääseda kõikjal, kus saate oma Figma kontole sisse logida või URL-i teistega jagada, et nad saaksid vaadata kõikjal. Lõpliku esitluse koos üleminekutega esitamiseks klõpsake nuppu Mängi nuppu ja kuvatakse täisekraanirežiimis.
Saate kaadreid salvestada ka PDF-failidena, kuigi te kaotate animeeritud üleminekud seda tehes.
Suurendage oma esitlusi Figmaga
See esitlus pole mitte ainult minimalistlik, mis ei koorma teie publikut üle jõu, vaid ka üleminekud on professionaalsed ja puhtad. Pole vaja kasutajaliidese/UX-eksperti, et kasutada Figmat viisil, mis toob kasu teie esitlustele, olenemata teie ametikohast. Esitlege enesekindlalt ja teid uputavad küsimused selle kohta, kuidas teie esitlus tehti.
