3. osa Kuidas luua taustokujutist

01, 05

Video lisamine Adobe Muse'ile

Tänu vaba vidinale on Muse'is taustokuivi lihtne lisada.

Adobe Muse tõesti huvitav aspekt on see, et saate luua veebilehti sarnase töövoo abil, mida kasutatakse väljaannete väljaandmiseks. Te ei vaja sügavat arusaamist saidi või lehe loomisel olevast koodist, kuid HTML5, CSS ja JavaScript tundmine ei kahjusta.

Kuigi traditsiooniline veebivideo lisatakse tavaliselt HTML5 Video API-i kasutades, täidab Adobe Muse seda, mida ta nimetab "vidinateks". Vidinad loovad spetsiifilistele ülesannete jaoks vajalik HTML 5, kuid kasutavad lihtsa keele liidest Muse'is koodi kirjutamiseks lehe avaldamise ajal.

Selle treeningu käigus kavatseme kasutada vidinat, mille saate tasuta alla laadida Muse Resourcesilt. Kui vidina allalaaditav on kõik, mida vaja teha, on avada .zip-fail ja topeltklõpsake faili .mulib kausta Full-Screen Video. See installib selle Adobe Muse koopiasse.

02 of 05

Kuidas Adobe Muse CC-i taustpildi lehte ette valmistada

Alustame uue veebisaidi loomisest ja lehe mõõtmete seadistamisest.

Kui installitud vidin on, saate nüüd luua selle lehe, kus videot kasutatakse.

Enne kui alustate, looge Muse saidi kaust. Selle kausta sees luuakse teine ​​kaust - ma kasutan " meediat " - ja teisaldan oma mp4- ja veebimälude versioonid sellesse kausta.

Käivitades Muse, valige File> New Site . Kui avaneb paigutuse dialoogiboks, valige Töölauast esialgne paigutus ja muutke lehe laiuse ja lehekülje kõrgus väärtusi 1200 ja 900 . Klõpsake nuppu OK .

Master-lehekülje avamiseks topeltklõpsake Plaani vaates Master-lehte. Kui avaneb põhimängija, liigutage päise ja jaluse juhised lehe üla- ja alaosale. Selle näite jaoks ei vaja tõesti päist ja jalustit.

03 of 05

Kuidas kasutada Adobe Muse CC-i täisekraani taustfilmi vidinat

Kõik, mida pead tegema, on lisada videomänge ja lase vidal ülejäänud osas käituda.

Vidina kasutamine on surnud lihtne. Esimene asi, mida peate tegema, on naasta plaani vaatele, valides View> Plan Mode . Kui avaneb plaani vaade, avaneb topeltklõps avalehel .

Avage raamatukogu paneel - kui see ei ole avatud liidese paremal küljel, valige Aken> Raamatukogu - ja keerake [Fullscreen Background Video kausta ] [MR] alla. Lohistage vidin kausta lehele.

Märkad, et valikud paluvad teil sisestada videote mp4- ja veebimagistrite versioonide nimesid. Sisestage nimed täpselt nii, nagu need on kirjutatud kaustas, kuhu paigutasite. Üks väike trikk, et veenduda, et te ei tee viga, on mp4-video nime kopeerimine ja kleepimine menüüs Valikud MP4- ja WEBM- aladele.

Veel üks trikk: kõik see vidin on HTML-koodi 5 koodi kirjutamiseks. Seda saate seda öelda, kuna näete vidinas olevat <> . Sellisel juhul võite paigutada vidina veebilehest papipartiini ja see töötab ikkagi. Nii ei häiri see lehel olevat sisu.

04 05

Kuidas lisada videot ja testi lehte Adobe Muse CC-s

Kui videot proovite saidi või lehe, mängib see video.

Kuigi olete lisanud koodi, mis esitab videoklippe, pole Muse endiselt aimugi, kus need videod asuvad. Selle parandamiseks valige Fail> Lisa failid üleslaadimiseks . Kui avaneb dialoogiboks Laadi üles, liikuge oma videotega kausta, valige need ja klõpsake käsku Ava . Selleks, et tagada nende üleslaadimine, avage varade paneel ja peaksite nägema oma kahte videot. Lihtsalt jäta need paneelisse. Neid ei pea lehele panema.

Projekti testimiseks vali menüükäsk Fail> Eelvaate leht brauseris või kuna see on üks leht, siis käsk File> Browser Site Preview . Teie vaikebrauser avaneb ja video - minu puhul troopiline vihma sadam - hakkab mängima.

Siinkohal saate Muse-faili käsitleda tavalise veebi-lehina ja lisada sisule avalehele ja video selle all.

05 05

Kuidas lisada videopilti raam Adobe Muse CC-s

Lisage ükskõik millisele videoprojektile alati posteriraami.

See on veeb, millest me siin räägime, ja sõltuvalt ühenduse kiirusest on hea võimalus, et teie kasutaja võib lehte avada ja videot laadides videot vaigistada. See pole hea asi. Siin on, kuidas tulla toime selle natuke närviga.

See on "parim tava", mis sisaldab video posterraami, mis kuvatakse videopilti laadimisel. Tavaliselt on see video täispikad pildiraamid.

Plakati raami lisamiseks klõpsake lehe ülaosas brauseri täitmisel üks kord. Klõpsake linki Image ja liikuge kasutatud pildile. Paigaldamise alal valige Scale to Fill ja klõpsake positsiooni alal Center point . See tagab, et brauseri vaatepordi suurus muutub pildi keskel. Näete ka seda, et pilt täidab lehte.

Veel üks väike trikk on, et vähemalt on tahke ja valge värviga värv ainult siis, kui plakati kaadris ilmub veidi aega. Selle tegemiseks klõpsake Muse Color Pickeri avamiseks Värvilahendust. Valige silmapilgutusriist ja klõpsake pildil domineerivat värvi. Kui olete lõpetanud, klõpsake lehel brauseri täitmise dialoogiboksi sulgemiseks.

Sel hetkel saate projekti salvestada või selle avaldada.

Selle seeria viimane osa näitab teile, kuidas kirjutada HTML5-koodi, mis libistab videot veebi lehe taustale.