كيفية تصميم قصص قوية على الهاتف المحمول

ليس من الضروري دائمًا سرد القصص بتنسيق "ذات مرة ...". الق نظرة على الأفلام ، على سبيل المثال. يتم سرد بعض القصص بترتيب زمني بينما يقفز البعض الآخر حول جدول زمني. هناك قصص يتم سردها من منظور بطل الرواية بينما يسمح البعض الآخر للمشاهدين برؤية القصة من وجهة نظر الجميع. بالإضافة إلى ذلك ، يمكن أن تكون القصص حزينة أو مضحكة أو درامية أو كل ما سبق.

هناك الكثير من الاختلاف في كيفية سرد القصة. هناك شيء واحد مشترك بينهم جميعًا:

إنهم بحاجة إلى جذب القارئ بطريقة ما إلى السرد.

يعد سرد القصص أداة قوية جدًا لمواقع الويب ، ولكن نفس القواعد تنطبق. لا يهم كيف تروي القصة - إنها تحتاج فقط إلى جذب الزائر إليها.

اليوم ، سأوجهك عبر تقنيات سرد القصص المختلفة وأعطيك بعض الأفكار حول كيفية تصميم هذه الأنواع من الروايات في مواقع الويب الخاصة بالهاتف المحمول أو PWAs.

كيفية تصميم قصص قوية على الهاتف المحمول

يعتبر سرد القصص أداة رائعة لمواقع الجوال.

أحد أسباب ذلك هو أن الشاشة الأصغر تجبرك على أن تكون أكثر إيجازًا في السرد . هذا يعني أنه يمكنك جذب الزائرين بسرعة أكبر إلى ذروة قصتك ، مما يؤدي إلى تسريع وقتهم للتحويل.

سبب آخر يجعل رواية القصص تعمل بشكل جيد على الهاتف المحمول هو أنه من الأسهل جذب الزائرين إلى القصة. كل ما عليك فعله هو إعطاء موقعك إحساسًا يشبه الكتاب وسيصبحون مغمورون فيه بسرعة.

علاوة على ذلك ، يمكنك حقًا السماح للعناصر المرئية بإجراء معظم الحديث وتقليل القصص المطولة التي قد يرغب مؤسسو الشركة في سردها عن شركاتهم.

هناك صناعة واحدة ، على وجه الخصوص ، أعتقد أنها تقوم بعمل استثنائي في سرد ​​القصص بهذه الطريقة ، وهي صناعة البيرة والكحول. إذا فكرت في الأمر ، فإن هذه الأنواع من الشركات لا تستطيع ببساطة دفع منتجاتها إلى وجوه المستهلكين. فيما يلي بعض الأسباب:

1. "دعنا نثمل" ليست نقطة بيع قوية جدًا أو فريدة من نوعها. لكن القصة التي تجذب العميل وتجعله جزءًا من السرد يمكن أن تكون كذلك.
2. لمنع شلل التحليل الذي يأتي مع اختيار نوع واحد من الخمور أو البيرة من عشرات الخيارات المماثلة ، تستخدم العلامات التجارية القصص لتمييز نفسها.
3. يمكنك بناء علاقات طويلة الأمد ومخلصة مع العملاء بشكل أكثر فعالية عن طريق تحويل منتجاتك إلى تجارب فريدة من نوعها.

خلاصة القول : عند إنشاء مواقع للمنتجات أو الخدمات في أماكن شديدة التنافسية ، يمكن أن يكون سرد القصص بمثابة تغيير حقيقي للعبة. فيما يتعلق بكيفية تحقيق ذلك من خلال التصميم ، فلنلقِ نظرة على بعض أساليب سرد القصص الأكثر شيوعًا والأمثلة التي تُظهر كيف يتم سحبها.

الطيران الجن

ما نوع القصة التي يرويها الموقع؟
الرحلة الموجهة

ما أنواع الأعمال التي تستفيد من هذا النوع من سرد القصص؟
يعتبر هذا النوع من أسلوب سرد القصص هو الأفضل للشركات الجديدة التي لديها عنصر قوي للعلامة التجارية. بهذه الطريقة ، فإن الشركة ليست مجرد عمل آخر مشابه يدخل الفضاء. إنه يقدم شيئًا أكثر إمتاعًا وجاذبية يشجع العملاء المحتملين على القفز طوال الرحلة - حتى في اليوم الأول.

تعد "التميمة" واحدة من أفضل الطرق لإنجاح هذا النوع من سرد القصص لأنها أصبحت دليل الزوار لاستكشاف الموقع وكل ما تقدمه.

فكر في فلو من بروجريسيف ، وويليام شاتنر عن برايسلين أو أولد سبايس جاي. في المرة الثانية التي ترى فيها هذه التعويذات ، لا يسعك إلا أن تتساءل عن نوع "المغامرة" التي سيأخذونك إليها بعد ذلك. إنها طريقة رائعة لبناء متابع مخلص.

كيف تبدو طريقة سرد القصص في The Guided Journey؟
في حالة Aviation Gin ، لم يمنح المالك المشارك Ryan Reynolds قوته النجمية فحسب ، بل أيضًا حس الفكاهة الذي اشتهر به العلامة التجارية.

عند دخول موقع الهاتف المحمول ، فإن وجه رينولدز هو أول ما يراه الزوار:

الفيديو (والاقتباس المضحك تحته) هو ما تتوقعه من رينولدز ، وهو يكسر النكات بينما يقدم للزائرين عالمًا سخيفًا ربما يكون قد ابتكره على الفور. إنها أيضًا قصيرة إلى حد كبير وستترك بلا شك الزوار يفكرون:

حسنًا ، حسنًا ، يجب أن أجرب هذا الجن.

قم بالتمرير لأسفل مرة واحدة ، وستجد هذه الدعوة للتواصل مع رينولدز من خلال النشرة الإخبارية للطيران Gin:

على الرغم من أنها تقلل قليلاً من روح الدعابة لدى رينولدز ، إلا أنها تواصل تصويره كطيار لهذه الرحلة التي على وشك القيام بها. وإذا كنا نعرف أي شيء عما يريده مستخدمينا ، فهذه خطوة رائعة. لا يتدلى رينولدز أمامهم فقط بإعلانات عرضية (كما تفعل العديد من الشركات مع المتحدثين الرسميين). لقد تم تضمينه بالفعل في التجربة.

علاوة على ذلك ، أنشأت شركة Aviation Gin بقية موقع الويب لتلعب مثل الرحلة ، مع مسرحيات ماكرة على الكلمات والرسومات ذات الصلة.

تم إنجاز هذا الموقع المكون من صفحة واحدة بشكل جيد من البداية إلى النهاية ، ويرجع جزء كبير منه إلى القصة التي التزموا بها:

• نحن الجن للطيران.
• رايان رينولدز سيأخذك إلى وجهتك.
• ألا تريد أن تأتي معك للرحلة؟

إنها قصة رائعة. وبالنسبة لأولئك الذين لا يعرفون من هو Ryan Reynolds ، فإن موقع الويب المزوَّد بتشبيهات الطيران والتلاعب بالألفاظ يجب أن يكون كافيًا لجذبهم أيضًا.

باكتو نافيو

ما نوع القصة التي يرويها الموقع؟
الحكاية الغامرة

ما أنواع الأعمال التي تستفيد من هذا النوع من سرد القصص؟
هذه طريقة فعالة أخرى لرواية القصص إذا كنت تبني موقعًا لعمل جديد. في هذه الحالة ، على الرغم من ذلك ، لا توجد شخصية واقعية يمكنها أن تأخذهم في رحلة العلامة التجارية. بدلاً من ذلك ، عليك الاعتماد على قوة العلامة التجارية وقدرتك على تصميم شيء يشعر بأنه غامر.

سيكون هذا مفيدًا بشكل خاص إذا لم تكن الشركة موجودة لفترة طويلة ولم يكن لديك الكثير من التاريخ أو الأوسمة للاستفادة منها. فقط تأكد من أن لديك تركيزًا واضحًا على قصتك ، حتى لا يحاول الزوار الخروج عن المسار الذي أنشأته لهم.

كيف تبدو طريقة سرد القصص الغامرة؟
لبناء قصة غامرة على موقع ويب للجوّال ، عليك تأطيرها على أنها مغامرة. بهذه الطريقة ، لا يفكر الزوار حتى في زر القائمة. بدلاً من ذلك ، فهم مستعدون للعب مع بعضهم ويسمحون لك بنقلهم عبر الموقع.

يعالج Pacto-Navio هذا النوع من رواية القصص بشكل جيد. هناك عدد من الأسباب وراء نجاح ذلك أيضًا.

أولاً ، يحتوي كل جزء من القصة على صفحة كاملة مخصصة:

هذه ، على سبيل المثال ، هي الصفحة الرئيسية. في البداية ، كل ما يراه الزائر هو البوصلة ، ولكن بعد ذلك تتحرك اليدين من الشرق (فرنسا) والغرب (كوبا) لترمز إلى البلدين اللذين يأتي منهما الروم.

هذا سبب آخر يجعل هذا الموقع يبدو غامرًا جدًا. منذ البداية ، ينقل موقع الويب الزوار بنشاط من نقطة الدخول إلى وجهتهم. وأنا أعني هذا حرفيا .

الموقع مليء بالرسوم المتحركة. إنها ليست ساحقة أو غير ضرورية. كل عنصر من العناصر المتحركة (حتى الانتقالات بين تقلبات الصفحة الأفقية) دقيق ولكنه مناسب.

يجب أن يجعل تصميم الموقع ككل الزائرين يشعرون وكأنهم يقرؤون قصة ملحمية عن المغامرة. لكن هذا موقع على شبكة الإنترنت. ليس كتابًا يقتصر على سرد قصة على الصفحات.

يتيح موقع الجوال Pacto-Navio للزوار تحديد الوقت الذي يريدون التوقف فيه واستكشاف المزيد. وعندما يفعلون ذلك ، يتم الكشف عن المزيد من القصة:

بمعنى ما ، يعد هذا النمط من مواقع الويب - حيث يتم تمثيل كل صفحة ببطاقة واحدة ويمكن قلبها مثل صفحات الكتاب - من أكثر الطرق جاذبية لسرد قصة.

يتم تقديم كل صفحة والرسم المقابل في وقت واحد. بعد ذلك ، عندما يختار الزائرون استكشاف المزيد ، يتم سرد القصة لفترة وجيزة بينما تحافظ الرسوم المتحركة الصغيرة على تركيزهم على الانتقال إلى أسفل الصفحة. تشعر حقًا أنك تقرأ كتابًا.

صموئيل ادامز

ما نوع القصة التي يرويها الموقع؟
رسالة حب

ما أنواع الأعمال التي تستفيد من هذا النوع من سرد القصص؟
إذا سبق لك أن قرأت كتابًا أو شاهدت فيلمًا يلعب فيه الموقع المادي (عادة ما تكون المدينة) دورًا في القصة ، فأنت تعرف مدى عاطفية التجربة التي يمكن أن تصبح.

خذ أيًا من أفلام وودي آلن ، على سبيل المثال. تم تعيين العديد منهم في مدينة نيويورك أو في المدن الخصبة في جميع أنحاء أوروبا - ويبدو الأمر كما لو أن المدن نفسها هي شخصيات. الشيء نفسه ينطبق على الكتب. يقوم ستيفن كينج بهذا كثيرًا ، مثل فندق Overlook Hotel في The Shining أو Shawshank Prison في The Shawshank Redemption . تلعب الأماكن دورًا مهمًا مثل الأشخاص في القصص.

صدق أو لا تصدق ، هذا شيء يمكنك القيام به مع موقع الجوال الخاص بك إذا كان نشاطًا تجاريًا له روابط قوية بمنطقة جغرافية.

كيف تبدو طريقة سرد القصص في Love Letter؟
صموئيل آدامز مصنع جعة له علاقات عميقة مع بوسطن ، ماساتشوستس.

يميل الأشخاص من بوسطن إلى أن يكونوا أبطالًا مخلصين بشدة للعلامات التجارية والشركات المحلية - والعلاقة التي تربطهم بمصنع الجعة هذا لا تختلف. لهذا السبب ليس من المستغرب أن يكون موقع Samuel Adams على الويب مخصصًا لـ:

1. مدينة بوسطن ،
2. أهل بوسطن.

فكر في الأمر كرسالة حب لجميع الأشياء في بوسطن.

يبدأ موقع الجوال بما يلي:

لا يوجد ذكر لبيرة صموئيل آدمز في صورة البطل هذه. هذه عبارة تحث المستخدم على اتخاذ إجراء: نخب شخصًا ما .

يُظهر هذا الفيديو فنانين كوميديين يشربون نخب الأشخاص الذين غيروا حياتهم ويمكّنونهم من فعل ما يفعلونه. إنها حقًا طريقة صادقة لبدء الناس في رحلتهم مع Samuel Adams.

بعيدًا عن الصفحة ، يشرح مصنع الجعة سبب قيام الكوميديين بإعداد هذه الخبز المحمص في المقام الأول:

لكن ليس الأشخاص المشهورون فقط هم الذين طلبت العلامة التجارية المشاركة في الخبز المحمص الجماعي. الفيديو التالي هو قصيدة لمدينة بوسطن وسكانها.

يرى الزائرون سكان بوسطن المشهورين (مثل Big Papi من Boston Red Sox يعطون حبهم واحترامهم للمدينة) ، لكن ليس فقط الشخصيات البارزة هي التي تتحدث في الفيديو:

بالإضافة إلى مشاهدة اللقطات الجميلة لمدينة بوسطن ، يمكنك رؤية الأشخاص الحقيقيين في المدينة. يظهر في لقطة الشاشة أعلاه أحد الناجين من تفجير ماراثون بوسطن. ولكن يمكنك أيضًا رؤية فريق من التجديف يتجه إلى نهر تشارلز ، وصالون حلاقة وأشخاص يمارسون الملاكمة في صالة الألعاب الرياضية.

بالتأكيد ، يمكن رؤية زجاجات بيرة Sam Adams في الخبز المحمص الذي يقدمه الناس ، لكنه لا يزال مقطع فيديو مؤثرًا وقصيدة جميلة لمدينة بوسطن. ولأن هذا الموقع منفصل تمامًا عن متجر Samuel Adams ، فإنه يساعد في الحفاظ على تركيز الناس على مشروع الخبز المحمص والمشاعر الإيجابية القادمة منه.

شركة Wintrip Brew

ما نوع القصة التي يرويها الموقع؟
الرواية المصورة

ما أنواع الأعمال التي تستفيد من هذا النوع من سرد القصص؟
هناك الكثير من الأمثلة على الروايات المصورة والكتب المصورة التي أصبحت فيما بعد أفلامًا أو برامج تلفزيونية مشهورة:

• الموتى السائرون
• الحراس
• مدينة الخطيئة
• V للثأر
• شبح في وعاء

والحق يقال ، لن يعمل هذا النمط من رواية القصص مع معظم العلامات التجارية لأنه يتطلب أن تكون العلامة التجارية منفعلة أو مظلمة أو تدفع الحدود حتى تعمل. كما يحتاج أيضًا إلى علامة تجارية تركز بنسبة 100٪ على منتجها. هذا لا يعني أنه لا يمكن أن يكون لها قصة أصلية أو ملهمة لترويها ، لكن إيقاع قصة كهذه يجب أن يظل مركزًا حقًا على ما تبيعه.

إذا كان هذا شيئًا تعمل معه ولديك القطع الإبداعية لتصميم موقع يمثل الصفحات الدرامية سريعة الخطى لرواية مصورة ، فهذه طريقة رائعة لجذب انتباه جمهورك وجذب انتباهه.

"

كيف تبدو طريقة سرد القصص المصورة؟
لا توجد طريقة واحدة لتصميم مواقع الويب باستخدام طريقة سرد القصص هذه. هذا بسبب وجود تباين كبير في طريقة تصميم الروايات المصورة والكتب المصورة. باتمان ، على سبيل المثال ، مظلمة ومزاجية. الحراس يدورون حول التصميم القديم المبالغ فيه. وبعد ذلك ، هناك The Walking Dead الذي يشعر بالكآبة.

عليك أن تقرر نوع "الحافة" التي تريد أن تعطيها لموقعك. لكن هناك شيء واحد مؤكد: يجب أن يكون هناك تباين صارخ بين الظلام والنور.

هذا هو موقع الجوال لشركة Wintrip Brew Co .:

إذا لم تكن تعرف أي شيء أفضل ، فقد تعتقد أن هذا كان موقعًا لرواية مصورة أو حتى لعبة فيديو.

ولكن هذه بالفعل هي الطريقة التي ترحب بها Wintrip Brew Co. بزوارها - وهي انطباع أول رائع. بعد كل شيء ، من الذي سيواجه مشكلة تصميم صفحة رئيسية لتبدو وكأنها رواية مصورة إذا لم يحذو باقي الموقع حذوه؟

لا يوجد سبب يمنع الزوار من الاستمرار في التعثر على هذا المسار.

كل شبر من هذا الموقع يبدو وكأنه رواية مصورة. هناك شخصيات غريبة منتشرة في جميع أنحاءها ، ودعوة الزوار لاستكشاف المزيد من كل صفحة (مثل الشيف الزومبي أعلاه).

ثم هناك القصة الفعلية التي يتم سردها على الصفحات:

تظل الطباعة بسيطة ومع ذلك فإن التباين اللوني اللافت للنظر يمنحها ميزة. إذا لم يلتقط الزائرون الإشارات الدقيقة التي يعطيها تصميم الخط ، فإن الكلمات المليئة بالموقف ستفعل بالتأكيد.

على الرغم من أنني أود أن أوضح لك كيف تم تصميم صفحة "البيرة" ، إلا أن الكلمات الواردة فيها صاخبة بشكل لا يصدق. يكفي أن نقول ، ما تراه أعلاه هو قمة جبل الجليد من حيث دفع الحدود.

لكن هذا جيد لأن هذا هو كل ما تدور حوله هذه العلامة التجارية. من الواضح حتى في الطريقة التي صنعوا بها البيرة الخاصة بهم أنهم يريدون جذب شاربي البيرة الذين يبحثون عن شيء أكثر قتامة وأكثر حداثة. وقد حدد تصميم هذا الموقع النغمة المثالية لذلك.

يوينجلينج

ما نوع القصة التي يرويها الموقع؟
الجدول الزمني

ما أنواع الأعمال التي تستفيد من هذا النوع من سرد القصص؟
أفضل استخدام للخط الزمني هو العلامات التجارية التي لها تاريخ طويل. هذه هي الشركات التي تعمل منذ أكثر من 100 عام. وسينطبق أيضًا على الشركات التي لديها عشرات المعالم التي حققتها على مر السنين.

قد لا تحصل على الكثير من هذه الأشياء التي تمر في طريقك ، ولكن عندما تفعل ذلك ، فإن المخطط الزمني هو طريقة رائعة لإخبار قصة الشركة (ورعاتها المخلصين).

بالنسبة إلى سبب اختيارك لهذه الطريقة في سرد ​​القصص ، فهي إحدى الطرق الأكثر فعالية للقيام بذلك. بخلاف ذلك ، سينتهي بك الأمر بصفحات طويلة بجنون تحاول تلخيص كل ما أنجزته العلامة التجارية على مر السنين - وسيكون ذلك مضيعة للوقت في محاولة تصميم شيء من هذا القبيل واختبارًا كبيرًا لصبر زوارك.

بدلاً من ذلك ، يقطع الخط الزمني القصة إلى أجزاء صغيرة وسهلة الهضم ولا تزال مثيرة للإعجاب.

كيف تبدو طريقة سرد القصص في الجدول الزمني؟
هذا واضح. ستبدأ ببداية قصة العلامة التجارية (عادةً كيف التقى المؤسسون بفكرتهم أو توصلوا إليها) وتنتهي اليوم. على طول الطريق ، ستشارك بضع كلمات وبعض الصور اللافتة للنظر لتسليط الضوء على المعالم.

لنلقِ نظرة على مثال Yuengling ، وهو أقدم مصنع جعة في الولايات المتحدة. يبدأ الجدول الزمني للشركة بفقرة تمهيدية واحدة وفيديو:

يمكن للزوار الذين يرغبون في قضاء بعض الوقت في الحصول على هذه المقدمة القيام بذلك بسهولة. يمكن للباقي تخطي الجدول الزمني الذي يبدأ مع تأسيس الشركة في عام 1829.

الشيء الجيد دائمًا في الجدول الزمني للشركة هو القدرة على رؤية مدى اتساقها منذ البداية. حتى إذا تم تغيير ملكية الشركة أو خضعت لتغييرات في الاسم ، في كثير من الأحيان يظل تصميم علامتها التجارية أو المنتج نفسه دون تغيير.

يمكنك أن ترى تلميحًا لذلك أعلاه مع تصميم Porter ، والذي لا يختلف عن التصميم الحالي لبعض عبوات Yuengling.

مع استمرار القصة ، يتعلم الزوار المزيد عن الشركة - مكاسبها وخسائرها والتغييرات التي أجرتها من أجل عملائها.

هذا في النهاية ما يجب أن يكون الهدف في تصميم قصة العلامة التجارية في جدول زمني. لا ينبغي أن يكون الأمر كذلك حتى تتمكن من عرض الجائزة بعد استلامها. إذا كنت ترغب في الحفاظ على تفاعل الزائرين وتحويلهم إلى عملاء في النهاية ، فعليك أن توضح لهم كيف يؤدون دورهم في القصة.

في لقطة الشاشة أعلاه ، ملخص عام 1996 يقول:

بدأ الطلب على Yuengling فعليًا في تجاوز قدرة مصنع الجعة. تم اتخاذ القرار بالانسحاب من الأسواق خارج المنطقة المحلية.

هذا هو بالضبط نوع الأشياء التي يرغب العملاء في رؤيتها عندما يبحثون عن علامات تجارية يبقون مخلصين لها. يوضح هذا ولاء العلامة التجارية لتزويد العملاء بمنتج عالي الجودة بدلاً من الثراء (وهو ما كان يمكن القيام به بسهولة).

تغليف

كما ترى ، هناك الكثير من الطرق لرواية قصة من خلال التصميم. وبينما تبدو المواقع المذكورة أعلاه جيدة عند عرضها على شاشات أكبر ، إلا أنها تتألق حقًا في الجوّال. ذلك لأن المصممين قادرون على صياغة تجارب تبدو وكأنك تقلب صفحات كتاب بدلاً من مطالبتك بالتمرير عبر كميات لا حصر لها من النص على الويب.

القائمة أعلاه ليست شاملة بأي حال من الأحوال حيث يمكنك سرد القصص بجميع أنواع الطرق للشركات. ما عليك سوى الاستماع إلى ما يقوله عملاؤك عن شركاتهم ، ثم إنشاء رحلة تطابق تلك التي سلكوها (أو الانعطاف الذي يسلكونه اليوم).