Какво да знаете
- С Home страницата в изглед Plan отидете на Window >Library > [MR] Папка за фоново видео на цял екран и плъзнете изпълнимия модул към страницата.
- За да добавите видеоклип, отидете на Файл > Добавяне на файлове за качване > папка с видеоклипове > Отваряне.
Adobe Muse ви позволява да създавате уеб страници, като използвате работен процес, подобен на публикациите; нямате нужда от задълбочено разбиране на кода, който изгражда сайт или страница, въпреки че познаването на HTML5, CSS и JavaScript няма да навреди. Въпреки че традиционното уеб видео обикновено се добавя чрез HTML5 Video API, Adobe Muse постига същото чрез уиджети, които създават HTML 5, необходим за конкретни задачи, но използват интерфейс на обикновен език в Muse, за да напишат кода, когато страницата бъде публикувана.
Как да подготвите страница за фоново видео в Adobe Muse CC
С инсталираната джаджа вече можете да създадете страница, която ще използва видеоклипа.
- Преди да започнете, създайте папка за вашия сайт Muse. В тази папка създайте друга папка – използваме „ media” – и преместете вашите mp4 и webm версии на видеоклипа в тази папка.
- Когато стартирате Muse, изберете Файл > Нов сайт.
- Когато се отвори диалоговият прозорец Layout, изберете Desktop като Initial Layout и променете Page Widthи Page Height стойности до 1200 и 900 . Щракнете върху OK.
-
Щракнете два пъти върху Главна страница в плановия изглед, за да отворите Главната страница. Когато се отвори основната страница, преместете водачите на горния и долния колонтитул в горната и долната част на страницата. Наистина не се нуждаете от горен и долен колонтитул за този пример.
Как да използвате приспособлението за фоново видео на цял екран в Adobe Muse CC
Използването на приспособлението е изключително лесно.
- Първото нещо, което трябва да направите, е да се върнете към изгледа на план, като изберете Изглед > Режим на план.
- Когато се отвори плановият изглед, щракнете двукратно върху Началната страница, за да го отворите.
- Отворете панела Library – ако не е отворен от дясната страна на интерфейса, изберете Window > Library – и завъртете надолу папката [MR] Fullscreen Background Video.
- Плъзнете изпълнимия модул на папката към страницата.
-
Ще забележите, че Опции ви подканват да въведете имената на mp4 и webm версиите на видеоклиповете. Въведете имената точно както са изписани в папката, в която сте ги поставили. Един малък трик, за да сте сигурни, че няма да направите грешка, е да копирате името на mp4 видеоклипа и да го поставите в областите MP4 и WEBM от менюто Опции
Още един трик: Всичко, което тази джаджа прави, е да напише HTML 5 кода вместо вас. Можете да разберете това, защото виждате в джаджата. В този случай можете да поставите джаджата от уеб страницата върху картона и тя ще продължи да работи. По този начин това не пречи на съдържанието, което ще поставите на страницата.
Как да добавите видео и да тествате страница в Adobe Muse CC
Въпреки че сте добавили кода, който ще възпроизвежда видеоклиповете, Muse все още не знае къде се намират тези видеоклипове.
- За да коригирате това, изберете Файл > Добавяне на файлове за качване.
- Когато се отвори диалоговият прозорец Качване, отидете до папката, съдържаща вашите видеоклипове, изберете ги и щракнете върху Отваряне.
-
За да сте сигурни, че са качени, отворете панела Активи,и трябва да видите вашите два видеоклипа. Просто ги оставете в панела. Не е необходимо да се поставят на страницата.
- За да тествате проекта, изберете Файл > Преглед на страницата в браузъра или, тъй като това е една страница, Файл > Визуализация на сайта в браузъра. Вашият браузър по подразбиране ще се отвори и видеото ще се възпроизведе.
- В този момент можете да третирате файла Muse като обикновена уеб страница и да добавите съдържание към началната страница, а видеото ще се възпроизведе под нея.
Как да добавите рамка за видео плакат в Adobe Muse CC
Това е мрежата, за която говорим тук, и в зависимост от скоростта на връзката има голям шанс вашият потребител да отвори страницата и да гледа празен екран, докато видеото се зарежда. Това не е хубаво нещо. Ето как да се справите с тази гадост.
„Най-добра практика“е да включите постерна рамка на видеоклипа, която ще се появи, докато видеото се зарежда. Това обикновено е екранна снимка в пълен размер на кадър от видеоклипа.
- За да добавите рамката на плаката, щракнете веднъж върху Browser Fill в горната част на страницата.
- Щракнете върху връзката към изображение и отидете до изображението, което ще използвате.
- В областта Fitting изберете Scale to Fill и щракнете върху Централна точка в областта Позиция. Това ще гарантира, че изображението винаги ще се мащабира от центъра на изображението, когато размерът на прозореца за изглед на браузъра се промени. Ще видите също изображението да запълва страницата.
- Друг малък трик е да имате плътен цвят за запълване, в случай че рамката на плаката се появи известно време. За да направите това, щракнете върху чипа Color, за да отворите Muse Color Picker. Изберете инструмента капетка и щракнете върху преобладаващ цвят в изображението. Когато приключите, щракнете върху страницата, за да затворите диалоговия прозорец за попълване на браузъра.
-
В този момент можете да запазите проекта или да го публикувате.
Последната част от тази поредица ви показва как да напишете HTML5 код, който плъзга видеоклип във фона на уеб страница.
