You are currently viewing تاريخ شفوي صغير عن ال high five بـ- ميلشيمب Mailchimp

تاريخ شفوي صغير عن ال high five بـ- ميلشيمب Mailchimp

تاريخ شفوي صغير عن ال high five بـ- ميلشيمب Mailchimp

للكاتب شون بلاندا /المصدر انفجن

A mini oral history of the Mailchimp high five

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

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

هكذا هي قصة Mailchimp high five. فمنذ تأسيسها في عام 2001 ، قامت شركة مزود خدمة البريد الإلكتروني ببناء شركة مزدهرة (600 مليون دولار من العائدات وفقًا لشركة فوربس) من خلال عدم أخذ نفسها على محمل الجد. كما ظلت شركة Bootstrapped موضع حسد أولئك منا الذين يبنون العلامات التجارية ، وهو موضوع الكثير من الصحف التي غالباً ما تسأل بعض نسخة من السؤال ، “كيف يمكن لبقية منا أن يفعلوا ما فعلته Mailchimp؟

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

Foam hands in honor of the Mailchimp high five

لكن ال high five التي ساعدت في بناء عملاق SaaS لم تكن نتيجة لخطة رئيسية ؛ لقد كانت فكرة سريعة في اللحظة الأخيرة من قبل مجموعة من المطورين والمصممين في نهاية عملية إعادة تصميم طويلة. تحدثنا مع أربعة منهم لنتعلم بالضبط كيف نتجت ال high five.

“البريد الإلكتروني هو آخر جزء من الدوام في شبكة سريعة الزوال ، لذلك قد تحصل كذلك على high five بعد ذلك.”

ارون والتر ,مدير تجربة المستخدم: لقد أصبحت عميلًا لشركة Mailchimp في عام 2005 وكنت أعرف شعورًا بإرسال حملة والتأكيد عليها تمامًا. لأنه بمجرد إرسال بريد إلكتروني ، لا يمكنك فعلاً استيعاب ذلك. اعتقدت دائمًا ، “يجب أن يأتي شخص ما إلى مكتبي ويعطيني high five الآن! أنا أستحقها. “لذلك [عندما عملت هناك] في عام 2008 ، كتبت نسخة من نسخة تم عرضها بعد أن أرسلت حملة:” high five! البريد الإلكتروني الخاص بك في قائمة الانتظار. “كانت تلك النسخة موجودة لسنوات ، وفي عام 2012 ، كنا نقوم بإعادة التصميم.

(ملاحظة: آرون هو الآن موظف في InVision)

كاليب أندروز ، كبير مصممي المشاريع: كان آرون يشبه ، “يجب أن نضع هذا [high five] في التطبيق!” وكان دائمًا جيدًا جدًا في عدم إعطاء توجيه مباشر أبدًا – فقط أخبرنا بالشيء الذي قد نفعله أو ينبغي أن نفعله. كنا معرفة الباقي. يخلق مستوى رائع من الثقة.

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

كاليب: لا يمكن لأي شخص أن يأخذ الفضل في هذا الأمر برمته. فقد تم تصوير اليد الأصلية من قبل جاستن بيرفورس وهو مصمم مجنون ومشرق.

A advertisement for the animation handbook. You should check it out!

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

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

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

كاليب: [بالنسبة للإصدار الثابت] كل ما فعلته وضعه في دائرة ووضع [مثال جوستين] في نهاية التدفق عندما تكون مستعدًا في النهاية لإرسال حملتك.

أرون: وقد أطلقناها مع [الإصدار الثابت]. لقد كانت high five الآن تجسدها يد فريدي ، والتي بدأت في الحصول على تغريدات وردود.

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

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

أرون: بدأ الناس في التقاط صور أيديهم. ثم قررنا ، “مهلا ، دعنا نأخذ بعض الوقت مع هذا.”

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

كاليب: ثم كلفنا أنا الفارو سانشيز بتحريكها وتم إعطاؤنا وقتًا طويلاً بشكل غير طبيعي لتحريك هذه اليد فعليًا ، مثل ثلاثة أسابيع. أي شركة أخرى ستكون مثل ، “ماذا تفعل؟ لماذا نعطيك هذه المرة تنشيط هذه القرد؟ “

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

The images that make up the mailchimp high five

 

الفارو: أعطوني ملف After Effects ، الذي تضمن الاستكشافات وقالوا: “نريد وضع هذا في الويب.” في ذلك الوقت ، من الواضح أننا لا نريد استخدام Flash أو أي شيء من هذا القبيل. لذلك كانت الطريقة الوحيدة عبر جافا سكريبت.

آرون: لقد تحولت التكنولوجيا إلى حد ما ويمكننا القيام به .svg للرسوم المتحركة لأول مرة.

كاليب: لقد فعلنا كل ما في وسعنا لجعله مقروءًا ونظيفًا. وأعتقد لسبب غريب أن هذا هو الجزء الذي كنا فخورين به أكثر. كنا مثل ، “العنة ، هذا جيد البناء! أنت تعرف ، إذا كان يبدو جيدًا ، فهذا جميل. لكن هذا جيد البناء! “

الفارو: لم تكن لديّ معرفة مثل تفريق الرسوم التوضيحية. لذا ، أعاد [Caleb] إنشاء الرسم التوضيحي الأولي ، والذي كان لـ Justin.

An animation of the various elements of the Mailchimp high five images

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

الفارو: كنت أخبر كالب ، “مهلا ، أحتاج لطبقة أخرى.” وكان مثل ، “نعم ، اسمحوا لي أن أفعل ذلك.” لقد كان صبورًا للغاية معي.

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

a screenshot of the fast fives game

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

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

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

كاليب: نعم ، كان ذلك ثلاثة أسابيع أخرى ، وشيء آخر كان يمكن أن تكون عليه أي شركة أخرى ، “ماذا تفعل؟”

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

كاليب: كانت أجزاء الجميع تتجمع ، لكنني أعتقد مرة أخرى ، كل شخص لديه المساحة والوقت للعمل عليه.

الفارو: أتذكر قراءة بعض التغريدات مثل ، “يا إلهي ، Mailchimp ، لقد كنت متوترة بالفعل وأنت تضع هذا أمامي؟ إنه يجعلني أكثر تشددًا! “ولكن في الوقت نفسه ، كانت طريقة تمكننا من إيقاف عملهم والاعتراف بعملهم ومدى أهميته.

أرون: هناك خوارزمية خيالية لتوليد قطرات عشوائية من العرق. حصلت الفارو علمية جدا على هذا الشيء!

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

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

“تحدي الأفكار ولا تأخذ فقط كل ما يقدمه لك. كن جزءًا من العملية الإبداعية. لا ، لا تكون مجرد نهاية السطر الذي تذهب إليه ، “حسنًا!”

الفارو سانيز

كاليب: يعرض الناس لي تطبيقات والأشياء التي يعرضونها لي ليست هي المنتج نفسه – إنها اللحظات. إنها التحولات. إنها الاعتبارات التي يقدرونها أكثر. حتى لا نتحدث عن كيفية تأثير المنتج على حياتهم لما يفعله بالنسبة لهم.

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

كاليب: أحيانًا ، أسمع أحدًا يقول شيئًا مثل ، “أنت تعرف ، يجب علينا أن نلاحظ الجوهر الذي فعلناه مع ال high five“. [يضحك] لا أعتقد أنه شيء يمكنك إعادة إنشائه.

تم تحرير هذه المقابلة من أجل الطول والوضوح.

 

للكاتب شون بلاندا /المصدر انفجن