Cinemagraphs في تصميم الويب
إذا كنت تقرأ أيًا من تقارير اتجاهات تصميم الويب التي لا تعد ولا تحصى والتي صدرت في وقت سابق من هذا العام ، فمن المحتمل أنك تقرأ عن الوعد الذي ورد في أجزاء سينمائية كبيرة الحجم ، يتم وضعها بشكل بارز على الصفحات الرئيسية في كل مكان. إذن أين هم؟
في حين أن بعض الشركات التي تستخدمها في مجال الأزياء تستخدمها على مواقعها على شبكة الإنترنت ، فإن قسم السينما قد هبط إلى حد كبير لعرض المقالات التقديمية وصفحات الرديت.
حسناً ، أنا أقول كفى لقد حان الوقت أن ترتفع فصول سينمائية وتأخذ مكانها الصحيح كصفحة أبطال الويب التي من المقرر أن تصبح.
لماذا فصول السينما تعمل
فكرة اتباع اتجاه التصميم على شبكة الإنترنت لمجرد أنه كان متوقعا لم يكن لي حقا تحمسني. ولكن ماذا لو كان بإمكانك في الواقع أن تقود هذا الاتجاه؟ وماذا لو كان لها غرض بالفعل ، وحلت مشكلة في نفس الوقت؟
عين الإنسان يحب الحركة.
عندما يتعلق الأمر بفصول السينما ، فإن جميع العبارات المذكورة أعلاه صحيحة. على الرغم من أنه تمت مناقشته بالتأكيد (بل وحتى توقعه كتوجه في تصميم الويب) ، إلا أن القليل جدًا من المواقع تستخدمه بالفعل. ونتيجة لذلك ، فإنها لم تقترب حتى من الوصول إلى كتلة حرجة ، لذلك لا يزال يفتن معظم مستخدمي الويب.
ليست صورة فوتوغرافية ، وليس فيديو ، فصول سينمائية هي حلوى متأصلة في العين لأنها تخدع المشاهد فقط لفترة كافية لجعلها تأخذ نظرة ثانية. في عصر ADD الذي نعيش فيه اليوم ، فإن أي شيء يمكنك استخدامه لإيقاف المستخدم مؤقتًا - حتى ولو للحظة واحدة فقط - يُعد فوزًا صغيرًا لسبب واحد مهم جدًا:
كنت قد حصلت على انتباههم.
لطالما كانت إحدى الطرق الفعالة بشكل خاص لجذب بعض الاهتمام على موقع الويب هي الفيديو. عين الإنسان يحب الحركة. لكن الفيديو البطل الكبير (حتى لو كان قصيرًا) ضخم جدًا. بالتأكيد يمكنك ضغطها في غضون بوصة واحدة من عمرها ، ولكن بعد ذلك تبدو فقط مضغوطة. أو يمكنك تركها بمفردها وتعاني من عواقب صفحة ويب بطيئة التحميل.
ولكن باستخدام فقرة سينمائية ، يمكنك توفير الكثير من عرض النطاق الترددي في حين لا تزال تلبية تلك الحاجة للحركة. في الواقع ، أنت ترفع مستوى الرهان ، لأنه يمكنك الاستفادة من الجانب الجديد من فقرة سينمائية - الناس لا يرونهم في كثير من الأحيان ، ويعجبون عندما يفعلون.
والآن ، بعد أن عرفت لماذا تستحق أجزاء السينما مكانًا مهمًا على الويب ، دعنا نلقي نظرة على مستوى عالٍ لكيفية إضفاء الحيوية على الحياة.
غليندفون موتورز تستخدم فقرة سينمائية في منطقة البطل لتعبّر عن الحالة المزاجية وتميزها كعلامة تجارية متميزة بين منافسيها.
الخيار 1: استخدام فقرة سيناريو موجودة مسبقًا
هناك العديد من الحالات التي تكون فيها الاستعانة بمصطلح CG جاهزًا مقبولًا ، أو حتى تفضّل صنعها بنفسك. أود أن أقول إنه إذا كان بإمكانك العثور على ما تحتاج إليه ، وأنه في ميزانيتك للحصول على حقوقه ، فهذا هو الطريق. والسؤال الوحيد هو: أين تجد ذلك؟
الخبر السار هو أن لديك خيارات سيتم تحديدها إلى حد كبير حسب ميزانيتك ، (أو العميل الخاص بك) ، ولكن هناك العديد من المصادر هناك. هناك حتى عدد قليل حر منها للإختيار من. ومع ذلك ، إذا كان لديك ثمانين دولارات لإنفاقها ، فإن Shutterstock لديها مجموعة لائقة من CGs عالية الوضوح.
(نصيحة: ليس لديهم قسم سينمائي مستقل ، لذلك عليك فقط البحث عن المصطلح "cinemagraph" ، بالإضافة إلى مصطلحات البحث الأخرى في قسم "لقطات الفيديو".)
إذا تمكنت من العثور على ما كنت تتخيله ، فستحتاج على الأرجح إلى ضغط الملف إلى درجة معينة. أكثر على ذلك قليلا.
الخيار الثاني: اصنع بنفسك
بيت القصيد من استخدام CG بدلا من الفيديو هو أنه من المفترض أن يكون قليلا من العقل.
ربما لم تتمكن من العثور على ما صورته. أو ربما كنت مجرد DIY'er يموت ، وأنا أحترم لك ذلك. إذن ، كيف يعمل أحد على صنع فقرة سينمائية من الصفر؟
أولا ، أنه يساعد على الحصول على المعدات المناسبة والخطة. إليك ما أوصي به للبدء:
- كاميرا يمكنها تصوير الفيديو
- حامل ثلاثي القوائم
- نموذج و / أو أي الدعائم اللازمة
- كمبيوتر
- الوصول إلى برنامج تحرير الفيديو (اختياري)
- الوصول إلى Adobe Photoshop أو برنامج تحرير أفلام cinemagraph أكثر تخصصًا ، مثل flixel
هذا ما ستحتاجه لعمل فقرة سينمائية. ولكن لكي تكون فعالة ، ستحتاج إلى فكرة رائعة.
ما الذي يجعل البطل العظيم سينمائية؟
على الرغم من أن الموضوع العام لمفهوم CG الخاص بك سوف يتم تحديده بشكل كبير من خلال موقع الويب نفسه ، إلا أن هناك بعض النقاط العالمية التي يجب وضعها في الاعتبار عند تحديد المشهد. تأكد من:
- أبقها خفية: إن الهدف الكامل من استخدام CG بدلاً من الفيديو هو أنه من المفترض أن يكون قليلاً من العقل. بعض من أفضل CGs لا تزال تبدو كذلك ، ثم مفاجأة المشاهد بحركة خفية. عند التحدث عن الدقة ، تأكد من أن التركيب العام ليس مشغولًا بشكل مفرط أو ملونًا إذا كنت تكتب نصًا و CTA أعلى منه. تذكر ، يجب على CG اللعب قبالة هذه العناصر ، وليس يصرف لهم. بالحديث عن هذا الموضوع…
- اترك مساحة للبطل الحقيقي: تأكد من أنك تعرف أين تريد أن يظهر عنوانك الرئيسي ، والخط الفرعي ، والزر الحث على اتخاذ القرار داخل فقرة السينما. سيؤثر هذا على المكان الذي تضع فيه الإجراء الرئيسي في التكوين.
- أبقها مثبتة: بطبيعة الحال ، لدى CG بعض الحركة ، ولكن المشهد العام يحتاج إلى أن يكون شديد التباين بشكل صحيح للحركة. يجب أن يساعد الحامل ثلاثي القوائم في حركة الخلفية واستقرار الكاميرا. إذا كان الهدف من عينيك هو الانتقال من جانب إلى آخر ، تأكد من أنها تحافظ على رأسها في نفس الوقت.
- اجعله قابلاً للتشغيل: نظرًا لأنك تريد أن يكون الملف صغيرًا نسبيًا ، ستحتاج إلى تكرار الإجراء بحيث يتكرر بأقصى قدر ممكن من السلاسة. خطة لهذا عند وضع المشهد. من الناحية المثالية ، ينبغي أن يتطابق الموقف الأول بشكل وثيق للغاية مع الموضع النهائي ، مع إغلاق الحلقة.
- استخدم شخصًا إن أمكن: أظهرت الدراسات أن الصور مع الناس فيها تحافظ على انتباه الناس أكثر بكثير من تلك التي لا تفعل ذلك. هذا ينطبق أيضا على CGs. نقاط إضافية إذا تمكنت من جعل النموذج الخاص بك يبحث في اتجاه CTA. وقد أظهر هذا لرسم عين المستخدم هناك أيضًا.
بعد الانتهاء من وضع جميع العناصر في مكانها ، حاول تصوير ما يقرب من 20-30 ثانية من الفيديو ، وتكرار الحركة المرتجعة عدة مرات ، مع الاحتفاظ بخمس ثوانٍ تقريبًا من حفظ الأشياء تمامًا. هذا يجب أن يمنحك لقطات الخام بما فيه الكفاية لتحويلها إلى سينمائية لافتة للنظر.
وضعها معا
بينما لن أذهب إلى عملية خطوة بخطوة لتحويل الفيديو إلى فقرة سينمائية ، فهناك العديد من الخيارات المتاحة أمامك. يمكنك التخلص من $ 299 لاستخدام برنامج تصميم cinemagraph مخصص ، ولكن يمكنك وضع CG لطيفة معا باستخدام برنامج فوتوشوب ، (التي أظن أنك تستخدمها بالفعل.)
ضغط الملف
سواء أكنت تقوم بعمل CG من نقطة الصفر ، أو قمت بإنشاء مصدر موجود ، فأنت تريد التأكد من تحميله بسرعة. سواء كان ملف الإخراج النهائي هو صورة gif أو فيديو (الذي أوصي به) ، سيعتمد ضغطك على عاملين منفصلين:
- جودة
- الطول
أنا شخصياً أحاول أن أذهب لأعلى جودة ممكنة في أي صورة كبيرة أو صورة أو سينمائية. في رأيي ، التضحية بجودة أي ملف يهدف إلى صنع مثل هذا التأثير المرئي هو عار. من أجل موازنة ذلك ، أحاول جعل حلقة فقرتي قصيرة قدر الإمكان.
سيؤثر هذا الإجراء على مدى قصر الحلقة - فالرأس الذي يمر به القطار قد يكون أقصر بكثير من نظرة العين البطيئة المتعمدة والتي قد تبدو تشنجًا إلى حد ما إذا تكررت بسرعة كبيرة. خذ المثال التالي من وكالة الويب النهاية العميقة . بما أن كل ما نحتاجه هنا هو أن تتطابق سيارة قطار واحدة مع الجيل التالي من أجل حلقة سلسة إلى حد ما ، فقد تمكنت من قطعها إلى حوالي ثانية واحدة.
على الرغم من أنني تمكنت من الإبقاء على الإجراء مقتضباً للغاية ، ما زلت أعلم أنه يمكن تقليل حجم الملف لحمل أسرع. انتهى بي الأمر باستخدام ضاغط فيديو مجاني عبر الإنترنت يسمى ClipChamp . كنت قادراً على ضغط الفيديو لأسفل من عدة ميغابايت إلى 319 كيلو بايت svelte. تذكر أن معظم المستخدمين سينتقلون من موقعك بعد الانتظار لمدة ثلاث ثوانٍ فقط ، لذلك من المفيد أن تكون سريعًا.
وإذا تركت نتائجك النهائية مصنّعة باستخدام أدوات من الانضغاط الشديد ، فيمكنك دائمًا استخدام خدعة مجربة وصحيحة تم استخدامها على مقاطع الفيديو البعيدة غير الكاملة - قم بحجبها بشبه شفاف تراكب منقوشة .
هل تهتم برؤية كيف استخدم الآخرون أفلام سينمائية كصور البطل؟ لدي بعض الأخبار الجيدة والسيئة - ليس هناك الكثير مما يمكن إظهاره ، وهو الخبر السيئ. لكن الخبر السار هو ، إذا كنت ستضع هذه الخطة موضع التنفيذ ، فستكون في طليعة ما يتوقع أن يكون اتجاهاً كبيراً.
في ما يلي بعض الأزواج التي تمكنت من العثور عليها عبر الويب:
الذوق المذهل [ملاحظة المحرر: تم إيقاف هذا الموقع.]
افكار اخيرة
لا يمكن لفقرة سينمائية أن تثير فقط مشروعًا مملًا بخلاف ذلك ، بل يمكن أن تؤثر على نجاحه أيضًا. إذا قمت بدمجها مع عنوان رئيسي قاتل وعبارة تحث على اتخاذ إجراء ، يمكنك جذب انتباه مستخدميك. ما تفعله بهذا الاهتمام متروك لك.