چه باید بدانیم
- با صفحه Home در نمای Plan ، به Window > بروید. Library > [MR] تمام صفحه پسزمینه ویدیو پوشه و ویجت را به صفحه بکشید.
- برای افزودن یک ویدیو، به File > افزودن فایل برای آپلود > پوشه ویدیو > باز کردن بروید.
Adobe Muse به شما امکان می دهد صفحات وب را با استفاده از گردش کار مشابه با انتشارات ایجاد کنید. شما نیازی به درک عمیق کدی که یک سایت یا صفحه را می سازد ندارید، اگرچه آشنایی با HTML5، CSS و جاوا اسکریپت ضرری ندارد. اگرچه ویدئوهای وب سنتی معمولاً از طریق HTML5 Video API اضافه میشوند، Adobe Muse همین کار را از طریق ویجتهایی انجام میدهد که HTML 5 مورد نیاز برای کارهای خاص را ایجاد میکنند اما از یک رابط زبان ساده در Muse برای نوشتن کد هنگام انتشار صفحه استفاده میکنند.
چگونه صفحه ای را برای ویدیوی پس زمینه در Adobe Muse CC آماده کنیم
با نصب ویجت، اکنون می توانید صفحه ای را ایجاد کنید که از ویدیو استفاده می کند.
- قبل از شروع، یک پوشه برای سایت Muse خود ایجاد کنید. در داخل آن پوشه، پوشه دیگری ایجاد کنید – ما از “media” استفاده میکنیم – و نسخههای mp4 و وبام ویدیوی خود را به آن پوشه منتقل کنید.
- هنگامی که Muse را راه اندازی می کنید، فایل > سایت جدید را انتخاب کنید.
- وقتی کادر گفتگوی Layout باز شد، Desktop را به عنوان Iitial Layout انتخاب کنید و عرض صفحه را تغییر دهید. مقادیرو Page Height به 1200 و 900 می رسد. روی OK کلیک کنید.
-
دوبار کلیک کنید Master Page در نمای Plan برای باز کردن صفحه اصلی. وقتی صفحه اصلی باز شد، راهنمای سرصفحه و پاورقی را به بالا و پایین صفحه منتقل کنید. شما واقعاً برای این مثال نیازی به سربرگ و پاورقی ندارید.
نحوه استفاده از ویجت ویدیوی پس زمینه تمام صفحه در Adobe Muse CC
استفاده از ویجت بسیار ساده است.
- اولین کاری که باید انجام دهید این است که با انتخاب View > حالت پلان به نمای پلان بازگردید.
- هنگامی که نمای پلان باز شد، روی صفحه اصلی دوبار کلیک کنید تا باز شود.
- پنل کتابخانه را باز کنید – اگر در سمت راست رابط باز نیست، Window > کتابخانه را انتخاب کنید - و پوشه [MR] Fullscreen Background Video را به سمت پایین بچرخانید.
- ویجت پوشه را به صفحه بکشید.
-
متوجه خواهید شد که گزینه ها از شما می خواهند نام نسخه های mp4 و webm ویدیوها را وارد کنید.نام ها را دقیقاً همانطور که در پوشه ای که آنها را در آن قرار داده اید وارد کنید. یک ترفند کوچک برای اطمینان از اینکه مرتکب اشتباه نمیشوید این است که نام ویدیوی mp4 را کپی کرده و در قسمتهای MP4 و WEBM قرار دهید. از منوی گزینه ها
یک ترفند دیگر: تمام کاری که این ویجت انجام می دهد این است که کد HTML 5 را برای شما بنویسد. شما می توانید این را بگویید زیرا در ویجت می بینید. در این حالت، میتوانید ویجت را از صفحه وب بر روی تخته قرار دهید و همچنان کار خواهد کرد. به این ترتیب، با محتوایی که در صفحه قرار می دهید تداخلی ایجاد نمی کند.
نحوه افزودن ویدئو و آزمایش یک صفحه در Adobe Muse CC
اگرچه کدی را اضافه کردهاید که ویدیوها را پخش میکند، Muse هنوز نمیداند آن ویدیوها کجا قرار دارند.
- برای رفع این مشکل، File > افزودن فایل برای آپلود را انتخاب کنید.
- وقتی کادر گفتگوی آپلود باز شد، به پوشه حاوی ویدیوهای خود بروید، آنها را انتخاب کنید و روی Open کلیک کنید.
- برای اطمینان از آپلود شدن آنها، پانل دارایی ها،را باز کنید و باید دو ویدیوی خود را ببینید. فقط آنها را در پانل بگذارید. نیازی به قرار دادن آنها در صفحه نیست.
-
برای آزمایش پروژه، File > پیش نمایش صفحه در مرورگر را انتخاب کنید یا، چون این یک صفحه است، را انتخاب کنید. فایل > پیشنمایش سایت در مرورگر. مرورگر پیشفرض شما باز میشود و ویدیو پخش میشود.
- در این مرحله، می توانید فایل Muse را به عنوان یک صفحه وب معمولی در نظر بگیرید و محتوا را به صفحه اصلی اضافه کنید، و ویدیو در زیر آن پخش می شود.
چگونه یک قاب پوستر ویدیو را در Adobe Muse CC اضافه کنیم
این همان وب است که در اینجا در مورد آن صحبت می کنیم، و بسته به سرعت اتصال، احتمال زیادی وجود دارد که کاربر شما صفحه را باز کند و در حین بارگیری ویدیو به صفحه خالی خیره شود. این چیز خوبی نیست. در اینجا نحوه مقابله با این ذره زشتی آمده است.
این یک "بهترین تمرین" است که یک قاب پوستری از ویدیو درج شود، که در حین بارگیری ویدیو ظاهر می شود. این معمولاً یک عکس با اندازه کامل از یک فریم از ویدیو است.
- برای افزودن قاب پوستر، یک بار روی Browser Fill در بالای صفحه کلیک کنید.
- پیوند تصویر را کلیک کنید و به تصویر مورد استفاده بروید.
-
در ناحیه Fitting ، Scale to Fill را انتخاب کنید و روی نقطه مرکزی در ناحیه Position. این اطمینان حاصل می کند که وقتی اندازه نمای مرورگر تغییر می کند، تصویر همیشه از مرکز تصویر بزرگ می شود.شما همچنین خواهید دید که تصویر صفحه را پر کرده است.
- یکی دیگر از ترفندهای کوچک این است که در صورتی که قاب پوستر کمی طول بکشد، یک رنگ پرکننده ثابت داشته باشید. برای انجام این کار، روی تراشه Color کلیک کنید تا Muse Color Picker باز شود. ابزار eyedropper را انتخاب کنید و روی رنگ غالب در تصویر کلیک کنید. پس از اتمام، روی صفحه کلیک کنید تا کادر محاوره ای پر کردن مرورگر بسته شود.
-
در این مرحله، می توانید پروژه را ذخیره کنید یا آن را منتشر کنید.
بخش پایانی این مجموعه به شما نشان می دهد که چگونه کد HTML5 را بنویسید که یک ویدیو را در پس زمینه یک صفحه وب اسلاید می کند.