كيف استطاع موقع Apartments.com “أخاطوا” نظام التصميم الخاص بهم
للكاتبة ربيكا كير /المصدر انفجن
نظم التصميم هي كل شيء عن الحفاظ على النظام. هذا ما جذب ألكساندرا كلوتفلتر ، مديرة الفنون التفاعلية ومصمم UI / UX الرئيسي في Apartments.com ، إلى ابتكارها.
اكتشفت ألكسندرا أنظمة التصميم عند العمل كمستشار لتصميم الويب. أخبرتنا ، “بمجرد أن رأيت Tidying Up مع ماري كوندو على Netflix ، اعتقدت ، هذه هي الطريقة التي أتناول بها أنظمة التصميم.”
وهي الآن تطلق نظام Mortar ، وهو أول نظام تصميمي لـ Apartments.com. انضمت إلى الشركة في أوائل عام 2019 ، وهي خطوة تلمح إليها قد تأثرت بحقيقة أن جيف جولدبلوم (الممثل المعترف به على نطاق واسع على أنه سحق جماعي للإنترنت) كان المتحدث الرسمي باسمهم.
شريكها في الهندسة هو جيك أندرسون ، مطور واجهة المستخدم الأول في Apartments.com ، والذي ذهب إلى الكلية للتصميم. إنه يعرف كيف تبدو الحياة على جانبي السياج ، وهو يؤمن تمامًا بقوة نظام التصميم لتوفير الوقت والإحباط للجميع.
جلسنا معهما لمناقشة تجربةهما مع فن بناء وإطلاق نظام تصميم.
تم تحرير الإجابات من أجل الطول والوضوح.
التصميم الداخلي: ألكسندرا ، كيف أصبحت مهندس تصميم نظام؟
ألكسندرا: أنا منظم للغاية في حياتي المنزلية وفي كل مكان آخر ، مكتبي وملفاتي وكل شيء. لا يمكنني العمل ما لم يكن لكل منزل منزل.
في وظيفتي السابقة ، كنت أعمل كمقاول لتصميم مواقع الويب ، وقد انزعجت من الوثائق والأنماط والمكونات المتناثرة ، لذلك بدأت في البحث عن المزيد حول أنظمة التصميم. بعد ذلك ، عندما بدأت بناء نظام التصميم هذا ، وقعت في غرام عملية التدقيق. كان لدي لوح كبير به خيط أحمر في كل مكان مثل المنظر المؤامرة. أحببت هز كل شيء من الأدراج والخزائن والذهاب ، “انظر إلى أي مدى تراكمنا الأشياء!” ثم ابحث عن منازل لكل ذلك.
أنا أدمج كل أنماط التصميم والمكونات الخاصة بنا في أجمل نظام يمكن استخدامه. لكن الأمر لا يتعلق بما يثير الشرر. يتعلق الأمر بما يخدم احتياجاتنا بشكل أفضل كمصممين ومطورين ومستخدمين. يتعلق الأمر بإيجاد القاسم المشترك الأدنى مقابل ما تتراكم بشكل تفاعلي عندما تكون في عجلة من أمرك. أحب منح الناس مساحة ليكونوا مبدعين ، بدلاً من القلق بشأن اللون الذي يجب أن يكون عليه الزر.
جيك: لقد قلت إننا نحتاج إلى نظام مثل هذا منذ سنتي الأولى هنا. الآن لدينا أشخاص مثل الكسندرا في مهمة لتحقيق ذلك.
عندما يتم تنظيم جانب التصميم ، يكون جانب المطور سعيدًا. لكن عندما وصلت للمرة الأولى قبل خمس سنوات ، وجدت أننا نقوم بالأشياء على أساس مخصص ، صفحة تلو الأخرى. لقد خرجنا بالفعل من ذلك الآن بعد أن أطلقنا نظام Mortar [نظام تصميم Apartments.com].
صمم بشكل أفضل وقم بالبناء بشكل أسرع مع مدير أنظمة تصميم InVision.
ID: ما الذي أثار مبادرة نظام التصميم في Apartments.com؟
ألكسندرا: عرف فريق التصميم أن الوقت قد حان لنظام التصميم لأنهم يواجهون تحديات تعاون مستمرة. Apartments.com هو فريق كبير موزع على مكتبين ، في بورتلاند وأتلانتا. لدينا فرق منفصلة تعمل على أجزاء منفصلة من خصائص Apartments.com ، ومن الصعب البقاء متزامنا.
قام المطورون بالفعل بشراء نظام التصميم أيضًا ، لأن عملية التعاون كانت مقطوعة. كان المطورون محبطين باستمرار من المصممين لأنهم واصلوا اكتشاف التحديثات حول التصميم بعد أن تم تسليم المواصفات و “الموافقة عليها”.
ID: أخبرنا عن الطريق لإطلاق مورتار.
ألكسندرا: أولاً ، تحدثت إلى أصحاب المصلحة والمديرين الإبداعيين للتأكد من أننا جميعًا على نفس الصفحة. ثم تحدثت إلى المطور الرئيسي حول مفهوم نظام التصميم وحشدت دعمه. لقد كان على استعداد لتكريس مطور كامل له ، وكان هذا المطور هو Jake.
جيك: لقد قمت بالفعل بتدوير بعض أطر Bootstrap. الاتساق مهم من صفحة إلى أخرى. يخلق شعورًا بأن المستخدم لا يزال في نفس الموقع أثناء انتقاله من ملكية إلى أخرى.
ولكن أساسا كنت بعد إعادة الاستخدام. لدينا أكثر من 150 مطور هنا. الطريقة الوحيدة لإنشاء التناسق هي إنشاء قابلية لإعادة الاستخدام عبر المكونات. يجعل التصميم والمنتج سعيدًا ، ويسعدنا لأننا نحافظ على كل شيء.
ألكسندرا: قضيت أنا وفريق التصميم أربعة أشهر في تدقيق كل شيء وبناء مكتبات المكونات في Sketch قبل أن نحصل على تراخيص DSM.
مررنا بتكرارات من أوراق الملصقات ، الأشياء التغيير والتبديل. عندما اقتربنا من الشيء الحقيقي ، استخدمنا نظام حجز التذاكر لإنشاء قصص لكل مكون والتأكد من حصولهم على الموافقة النهائية من المخرجين المبدعين في أتلانتا وبورتلاند.
بمجرد الموافقة على المكونات وخبزها بالكامل ، بدأنا في إنشاء الوثائق. كان ذلك عندما وصل ترخيص DSM. ثم قمنا بنقل جميع مكتباتنا ووثائقنا إلى DSM.
ID: كيف تسير النسخة التجريبية؟
الكسندرا: الأمور تسير على ما يرام! نحن في هذه المرحلة الحرجة حيث لا تزال هناك بعض المشاريع القديمة التي تم إنشاؤها قبل وجود الملاط. على سبيل المثال ، قد ينتهي تنفيذ مشروع جديد كما هو ، لأنه يسبق نظام التصميم. سنطبق Mortar على إصدار لاحق بدلاً من ذلك.
لقد كان المصممون إيجابيين للغاية. يمكنهم أن يروا كيف يجعل هذا وظائفهم أسهل.
جيك: في البداية جاهد الناس لفهم كيف يسد هذا الفجوة بين التصميم والتطوير. لكن خلال الشهر الماضي أو نحو ذلك ، تحسنت العلاقة بين التصميم والتطوير بسرعة كبيرة.
إنها طريقة أكثر وضوحًا للعمل ، ونحصل على المزيد من المنتجات في نهاية اليوم. قد تكون قادرًا على إنشاء ميزتين إضافيتين في سباق ، على سبيل المثال ، لأنه يتم إعادة استخدام كل شيء.
ألكسندرا: لقد ساعدنا في بدء عملية InVision DSM. التقى مستشار InVision بنا في سلسلة من الجلسات الإرشادية حول أفضل الممارسات ، والحوكمة ، وكل ما نحتاج إليه لدفع التبني.
تعرف على المزيد حول DSM هنا.
كان اجتماع الحوكمة أحد أكثر الاجتماعات فائدة في السلسلة. يوصون [الاستشاري] باستخدام نماذج Google ومخططات التدفق لتحديد ما إذا كنت بحاجة إلى مكون جديد ولديك قناة سلاك لأسئلة نظام التصميم. لدي أيضًا دليل متعاون يوضح الفلسفة الكامنة وراء إضافة عنصر. يشبه نموذج Google الخاص بنا لذلك النموذج الذي رأيناه خلال التدريب على البداية ، ويحتوي على الكثير من صور جيف جولدبلام.
ID: كيف أثر مورتار على المطورين حتى الآن؟
جيك: لقد كانت مساعدة كبيرة. في الآونة الأخيرة ، على سبيل المثال ، عملت في مشروع لزملائه في لندن. أعطوني تصميمًا منظمًا في مكونات قضيت أسبوعًا في مبنى. بعد ذلك ، عندما ذهبت إلى لندن ، تمكنت من التقاط كل شيء في الموقع.
كان من الممكن أن يكون ذلك مشروعًا مدته ستة إلى ثمانية أشهر ، لكنني تمكنت من القيام بذلك في غضون شهرين لأنني كنت قادرًا على النظر إلى InVision ، وسحب المواصفات من Inspect ، ومشاهدة كل القطع القابلة لإعادة الاستخدام في DSM ، والهجوم على الفور. مع نظام التصميم ، لدينا الصورة الكاملة لما نبنيه في مكان واحد.
ID: ما النصيحة التي تقدمها للفرق التي تبدأ نظام تصميم جديد؟
ألكسندرا: إليك ما تعلمته من الاثنين اللذين قمت ببنائهما حتى الآن:
بناء مشاركة أصحاب المصلحة هو الخطوة الأكثر أهمية. ستحتاج إلى تكريس مصمم وموارد له [نظام التصميم الخاص بك]. جعل القضية.
أثناء عملية التدقيق ، من المهم التباطؤ. حقا قضاء بعض الوقت في الغوص في المنتج بأكمله ، هز جميع تلك الشاشات من خزانة ، ومعرفة جميع العوالم تشمل مواقع الويب والتطبيقات الخاصة بك.
امنح نظام التصميم الوقت الذي يحتاجه ليصبح شيئًا مفيدًا لمؤسستك. استمع إلى فريقك [التصميم]. نفس الشيء مع المطورين. إنهم جزء من هذا مثل المصممين.
جيك: أود أن أقول العمل على التواصل. الحفاظ على خط مفتوح بين المطورين والمصممين يساعد حقا. الآن بعد أن أصبح لدينا ملاط في مكانه ، فقد طورنا تعاونًا جيدًا. نحن مدفوعون لتوحيد عملنا وجعله قابلاً لإعادة الاستخدام ومتسق. يحاول مطورو التصميم وواجهة المستخدم إنجاز هذه الأشياء نفسها بطرقهم المنفصلة.
للكاتبة ربيكا كير /المصدر انفجن
