قسمت 3 نحوه ایجاد ویدئو سابقه

01 از 05

افزودن ویدیو به Adobe Muse

ویدئو پس زمینه به راحتی می توانید در Muse با یک ویجت رایگان اضافه کنید.

جنبه واقعا جالب Adobe Muse این است که به شما امکان می دهد صفحات وب را با استفاده از یک جریان کاری مشابه به آنچه که برای انتشار مجلات استفاده می کنید، ایجاد کنید. شما نیاز درک عمیق از کد ایجاد یک سایت یا صفحه، اما آشنایی با HTML5، CSS و جاوا اسکریپت صدمه دیده است.

اگرچه ویدئو های سنتی وب معمولا از طریق استفاده از API HTML5 Video اضافه می شوند، Adobe Muse همان چیزی را از طریق آنچه "ویجت ها" می نامد انجام می دهد. ابزارک ها HTML 5 را برای وظایف خاص ایجاد می کنند، اما در Muse از یک رابط زبان ساده استفاده می کنند تا وقتی که صفحه منتشر می شود، کد را بنویسد.

در این تمرین، ما قصد داریم از ویجت استفاده کنیم که به صورت رایگان از Muse Resources می توانید دانلود کنید. هنگام دریافت ویجت، همه چیزهایی که باید انجام دهید این است که فایل zip را باز کنید و فایل .mulib را در پوشه تمام صفحه فیلم دوبار کلیک کنید. این کار را به کپی خود از Adobe Muse نصب خواهد کرد.

02 از 05

چگونه می توان یک صفحه برای ویدیو پس زمینه در Adobe Muse CC تهیه کرد

ما با ایجاد یک سایت جدید aa و تنظیم ابعاد صفحه شروع می کنیم.

با استفاده از ویجت، شما هم اکنون می توانید صفحه ای ایجاد کنید که از ویدیو استفاده می کند.

قبل از شروع، یک پوشه برای سایت Muse خود ایجاد کنید. داخل آن پوشه یک پوشه دیگر ایجاد کنید - من از « رسانه » استفاده می کنم - و نسخه های mp4 و webm شما را به آن پوشه منتقل می کند.

وقتی Muse را اجرا می کنید، File> New Site را انتخاب کنید. هنگامی که کادر محاوره ای لایه باز می شود، دسکتاپ را به عنوان لایه اولیه انتخاب کرده و عرض صفحه و ارتفاع صفحه را به 1200 و 900 تغییر دهید . روی OK کلیک کنید

برای باز کردن صفحه اصلی، روی صفحه Master در صفحه Plane دوبار کلیک کنید. هنگامی که برگه اصلی باز می شود، سرصفحه و پاورقی را به بالا و پایین صفحه هدایت می کند. شما برای این مثال واقعا نیازی به Header و Footer ندارید.

03 از 05

نحوه استفاده از ویجت ویدئو پس زمینه تمام صفحه در Adobe Muse CC

همه چیزهایی که باید انجام دهید این است که نام های ویدئویی را اضافه کنید و بگذارید ویجت بقیه را اداره کند.

با استفاده از ویجت مرده ساده است. اولین کاری که باید انجام دهید این است که با انتخاب View> Plan Mode به View Plane بروید . هنگامی که نمایش برنامه باز می شود، روی صفحه اصلی دوبار کلیک کنید تا آن را باز کنید.

پانل کتابخانه را باز کنید - اگر در سمت راست رابط کاربری باز نکنید، پنجره> کتابخانه را انتخاب کنید و پوشه تصویر زمینه [MR] تمام صفحه را بچرخانید . ویجت را به پوشه به صفحه بکشید.

گزینه های شما را متوجه خواهیم کرد که نام نسخه های mp4 و webm فیلم ها را وارد کنید. نام دقیقا همانطور که در پوشه ای که در آن قرار داده اید نوشته شده است. یک ترفند کوچک برای اطمینان از این که اشتباه نکنید کپی کردن نام موزیک ویدیو mp4 است و آن را در قسمت های MP4 و WEBM منوی گزینه ها قرار دهید .

یک ترفند دیگر: تمام این ویجت این است که کد HTML 5 را برای شما بنویسید. شما می توانید این را بگوئید زیرا در ویجت <> مشاهده می کنید. در این مورد، شما می توانید ویجت را از صفحه وب بر روی صفحه نمایش قرار دهید و همچنان کار خواهد کرد. به این ترتیب آن را با هیچ محتوایی که در صفحه قرار می دهید، تداخل نکنید.

04 از 05

چگونه برای اضافه کردن ویدئو و تست یک صفحه در Adobe Muse CC

هنگامی که شما سایت یا صفحه را آزمایش می کنید، ویدئو حرکات پخش می شود.

اگرچه کد اضافه شده ای که فیلم ها را پخش می کند، Muse هنوز نشانه ای از این ویدیو ها ندارد. برای رفع این، File> Add Files To Upload را انتخاب کنید . وقتی کادر محاوره ای آپلود باز می شود، به پوشه ای که حاوی ویدیوهای شما است، حرکت می کند، آنها را انتخاب کرده و بر روی Open کلیک کنید. برای اطمینان از اینکه آنها آپلود شده اند، پانل دارایی را باز کنید و شما باید دو ویدیو را مشاهده کنید. فقط آنها را در پنل نگه دارید. آنها لازم نیست در صفحه قرار داده شوند.

برای آزمایش پروژه، File> Preview Page در مرورگر را انتخاب کنید یا، زیرا این یک صفحه است، File> Preview Site in Browser . مرورگر پیش فرض شما باز خواهد شد و ویدئو - در مورد من باران گرمسیری - شروع به بازی می کند.

در این مرحله می توانید فایل Muse را به صورت یک صفحه وب منظم و محتوای آن را به صفحه اصلی اضافه کنید و ویدیو زیر آن را پخش کنید.

05 از 05

چگونه برای اضافه کردن قاب پوستر ویدئو در Adobe Muse CC

همیشه یک طرح پوستر برای هر پروژه ویدئویی اضافه کنید

این وب است که در اینجا صحبت میکنیم و بسته به سرعت اتصال، شانس خوبی است که کاربر بتواند صفحه را باز کند و در هنگام بارگیری ویدیوها روی یک صفحه خالی تماشا کند. این چیز خوبی نیست. در اینجا چگونگی مقابله با این کمی ترس و وحشت است.

این "بهترین تمرین" است که شامل یک قاب پوستر از ویدیو است که در هنگام بارگیری ویدیو ظاهر می شود. این معمولا یک عکس روی صفحه نمایش کامل از یک قاب از ویدیو است.

برای اضافه کردن قاب پوستر یک بار در مرورگر پر کنید در بالای صفحه کلیک کنید. روی لینک تصویر کلیک کنید و به تصویر مورد استفاده بروید. در قسمت Fitting ، Scale to Fill را انتخاب کنید و روی نقطه مرکز در منطقه موقعیت کلیک کنید. این امر اطمینان حاصل می کند که همیشه تصویر از مرکز تصویر در هنگام تغییر اندازه مرورگر مرورگر تغییر می کند. شما همچنین می توانید تصویر را پر کنید صفحه را پر کنید

یک ترفند کوچک دیگر این است که حداقل یک رنگ جامد و بدون رنگ سفید داشته باشید فقط در صورتی که کادر پوستر به نظر می رسد. برای انجام این کار بر روی تراشه رنگ کلیک کنید تا Muse Color Picker باز شود. ابزار eyedropper را انتخاب کنید و روی رنگ غالب در تصویر کلیک کنید. پس از پایان، بر روی صفحه کلیک کنید تا کادر محاوره ای مرورگر را ببندید.

در این مرحله می توانید پروژه را ذخیره یا آن را منتشر کنید.

قسمت نهایی این مجموعه به شما نشان می دهد چگونه کد HTML5 را بنویسید که ویدیو را به یک پسزمینه وب تبدیل می کند.