Частка 3, як стварыць фонавае відэа

01 з 05

Даданне відэа ў Adobe Muse

Фон відэа лёгка дадаваць у Muse дзякуючы свабоднаму віджэту.

Сапраўды цікавы аспект Adobe Muse з'яўляецца тое, што яна дазваляе ствараць вэб-старонкі, выкарыстоўваючы падобны тэхналагічны працэс, які выкарыстоўваецца, каб выкласці публікацыі. Вам не трэба глыбокае разуменне кода, які кампілюе сайт ці старонку, але знаёмства з HTML5, CSS і JavaScript не пашкодзіць.

Хоць традыцыйныя вэб-відэа, як правіла, дадаецца праз выкарыстанне HTML5 Video API, Adobe Muse выконвае тое ж самае праз тое, што ён называе «віджэтаў». Фішкі стварыць HTML 5, неабходны для выканання канкрэтных задач, але выкарыстаць інтэрфейс звычайнага мовы ў музе, каб напісаць код, калі старонка будзе апублікаваная.

У гэтым практыкаванні мы будзем выкарыстоўваць віджэт, які вы можаце спампаваць, бясплатна, ад Muse рэсурсаў. Калі загрузкі віджэтаў, усё, што вам трэба зрабіць, гэта адкрыць файл .zip і двойчы пстрыкніце файл .mulib ў тэчцы Full-Screen Video. Гэта дазволіць ўсталяваць яго ў вашу копію Adobe Muse.

02 з 05

Як падрыхтаваць старонкі для фону відэа ў Adobe Muse CC

Мы пачнем са стварэннем аа новага сайта і налады памераў старонкі.

Пры ўсталёўцы віджэтаў, зараз вы можаце стварыць старонку, якая будзе выкарыстоўваць відэа.

Перад тым, як пачаць, стварыце тэчку для вашага сайта Muse. Унутры гэтай тэчкі стварыце іншую тэчку - я выкарыстоўваю «СМІ» - і перамясціць mp4 і WebM версію відэа ў гэтую тэчку.

Пры запуску Muse абярыце Файл> Стварыць сайт. Калі дыялогавае акно Layout адкрываецца выберы Працоўны стол у якасці зыходнага макета і змяніць значэнне вышыні старонкі Шырыні і старонкі 1200 і 900. Націсніце кнопку ОК.

Двойчы пстрыкніце на майстар-старонку ў акне плана, каб адкрыць старонку Master. Калі майстар-старонка адкрываецца перамясціць верхні і ніжні калантытула вядзе да верхняй і ніжняй частцы старонкі. Вы сапраўды не патрэбныя калантытул для гэтага прыкладу.

03 з 05

Як выкарыстоўваць увесь экран Background Video Widget ў Adobe Muse CC

Усё, што вам трэба зрабіць, гэта дадаць відэа імёны і хай віджэт справіцца з астатнімі.

Выкарыстанне фішкі мёртвы проста. Першае , што вам трэба зрабіць , гэта вярнуцца да плана View, выбраўшы Выгляд> Plan Mode. Калі план View адкрываецца двойчы пстрыкніце на галоўнай старонцы , каб адкрыць яго.

Адкрыйце панэль Library - калі яна не адкрыта на правай баку інтэрфейсу выберыце Window> Library - ды круціць ўніз [MR] тэчку Поўнаэкранны фону відэа. Перацягнуць віджэт ў тэчку на старонку.

Вы заўважыце , што параметры папросіць вас ўвесці імёны mp4 і WebM версіі відэа. Увядзіце імёны дакладна так, як яны напісаныя ў тэчцы, дзе вы размясцілі іх. Адна маленькая хітрасць , каб пераканацца , што вы не зробіце памылку, каб скапіяваць імя mp4 відэа і ўставіць яго ў MP4 і WebM абласцей меню Options.

Яшчэ адзін трук: Усё гэта віджэт робіць гэта напісаць код HTML 5 для вас. Вы можаце сказаць , што гэта таму , што вы бачыце <> у віджэце. У гэтым выпадку, вы можаце змясціць віджэт ад вэб-старонкі, на мантажным стале, і яна будзе працаваць. Такім чынам, гэта не перашкаджае з любым зместам вы будзеце размяшчаць на гэтай старонцы.

04 з 05

Як дадаць відэа і тэставанне старонкі ў Adobe Muse CC

Ther відэа прайграваецца пры тэставанні сайта або старонкі.

Хаця вы дадалі код, які будзе гуляць відэа, Muse яшчэ не мае ні найменшага паняцця, дзе гэтыя відэа размешчаныя. Каб выправіць гэта, выберыце Файл> Дадаць файлы для загрузкі. Калі дыялогавае акно загрузкі адкрываецца перайдзіце да тэчцы , якая змяшчае відэа, выберыце іх і націсніце кнопку Адкрыць. Для таго, каб гарантаваць , што яны былі загружаныя, адкрыйце панэль Assets , і вы павінны ўбачыць вашыя два відэа. Проста пакіньце іх у панэлі. Яны не павінны быць размешчаныя на гэтай старонцы.

Для тэставання праекта абярыце Файл> Папярэдні прагляд старонку ў браўзэры або, таму што гэта адна старонка, Файл> Папярэдні прагляд сайта ў браўзэры. Ваш браўзэр па змаўчанні будзе адкрываць і відэа - у маім выпадку трапічнага залевы - пачне гуляць.

На дадзены момант, вы можаце разглядаць файл Muse як звычайны вэб-старонку і дадайце кантэнт на галоўнай старонку, і відэа будзе гуляць пад ім.

05 з 05

Як дадаць відэа Плакат кадр у Adobe Muse CC

Заўсёды дадавайце плакат кадра да любога відэа праекта.

Гэта вэб-мы гаворым тут і, у залежнасці ад хуткасці падлучэння, ёсць добры шанец, ваш элемент можа адкрыць старонку і быць гледзячы на ​​пусты экран, у той час загрузкі відэа. Гэта не вельмі добрая рэч. Вось як змагацца з гэтым трохі гадасці.

Гэта «Лепшая практыка», каб уключыць плакат кадр відэа, якое будзе адлюстроўвацца ў той час загрузкі відэа. Гэта, як правіла, поўнапамерны здымак экрана кадр з відэа.

Каб дадаць плакат кадра націсніце адзін раз Browser штрыхоўкі ў верхняй частцы старонкі. Націсніце на спасылку на малюнак і перайдзіце да выявы , каб выкарыстаць. У Фиттинге вобласці, абярыце Scale для запаўнення і націсніце на цэнтральную кропку ў галіне Position. Гэта дазволіць забяспечыць малюнак заўсёды будзе маштабавацца ад цэнтра малюнкаў пры змене памеру акна прагляду браўзэра. Вы таксама ўбачыце выява запаўнення старонкі.

Яшчэ адна маленькая хітрасць, каб па крайняй меры, мець цвёрдае-ня белый- колер залівання толькі ў тым выпадку, плакат кадр займае некаторы час, каб з'явіцца. Для гэтага націсніце на чып колеру, каб адкрыць Muse Color Picker. Абярыце прыладу піпетка і націсніце на пераважнага колеру ў малюнку. Калі скончыце, націсніце на старонцы, каб закрыць дыялогавае акно Browser Fill.

На дадзены момант, вы можаце захаваць праект або апублікаваць яго.

Заключная частка дадзенай серыі паказвае вам , як напісаць код HTML5 , які слізгае відэа ў фонавым рэжыме вэб - старонкі.