Coisa de Motos

للقناة معجبون. أما المتجر فيحتاج علامة يأتمنها الناس على أموالهم.

كانت Coisa de Motos اسمًا وصوتًا ومجتمعًا قبل أن تكون أي شيء يمكن شراؤه. تحويلها إلى متجر عنى الحفاظ على ذلك الصوت، الصاخب والمرح والنابع من الطريق، مع أن تبدو جادّة بما يكفي ليشتري منها أحدهم سترة بـ R$2.000.

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

مبني على Shopify

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

الاعتماد على المنصة أتاح لفريق من شخصين بيع مئات القطع دون تشغيل خوادم، وترك وقتنا لما يميّز المتجر: كيف يبدو، وكيف يُنظَّم، وماذا يقول.

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

مُبرمج بـ ChatGPT

تخصيص قالب Shopify يعني كتابة Liquid، لغة القوالب الخاصة بـ Shopify، ممزوجة بـ HTML وCSS وJavaScript. كتبت قالبنا بـ ChatGPT. كنت أصف التغيير الذي أريده، وألصق الكود الذي يعطيني إياه في محرر القوالب في Shopify، وأرى ما يحدث. وحين يتعطّل شيء، كنت أنسخ الكود من Shopify وأرسله إلى ChatGPT مع الخطأ، حتى يعمل.

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

ChatGPT

أضف شريطًا في الأعلى يمنح المشترين لأول مرة خصم 5% بكود MOTONAUTA

{% if customer == blank %}
  <div class="promo-bar">
    5% off your first order:
    MOTONAUTA
  </div>
{% endif %}

Copy the code

الصق الخطأ مرة أخرى

Shopify · تعديل الكود

header.liquidtheme.liquid

1{% if customer == blank %}
2  <div class="promo-bar">
3    5% off your first order:
4    MOTONAUTA
5  </div>
6{% endif %}

واجهة متجر تبيع

تبدأ الصفحة الرئيسية بعرض الأسبوع، ثم الفئات التي يتسوّقها السائقون أكثر: الخوذات، والسترات، والقفازات، والأحذية، وقطع الغيار. شريط رفيع في الأعلى يمنح كل مشترٍ لأول مرة خصم 5% بقسيمة MOTONAUTA، بكلمة المجتمع نفسه، ويستقبلهم الحساب بعبارة «Salve, motonauta!».

القطع، حسب النظام

تنفتح الفئات في قائمة ضخمة مجمّعة بالطريقة التي يفكر بها الميكانيكي، فمن يبحث عن تيل الفرامل لا يمرّ أبدًا بأنظمة العادم.

Coisa de Motos

مصمّم للهاتف

يجد السائقون المتجر عبر Instagram وYouTube، على هواتفهم، لذا صُمّمت كل شاشة للهاتف بقدر ما صُمّمت للحاسوب. وحوّلنا المسار أيضًا إلى دليل من ست خطوات لطريقة الشراء، من الصفحة الرئيسية إلى الدفع، لمن لم يشترِ معدات عبر الإنترنت من قبل.

1. 

   1 · افتح الموقع

2. 

   2 · اختر فئة

3. 

   3 · رتّب ما تراه

4. 

   4 · افتح المنتج

5. 

   5 · راجع التفاصيل

6. 

   6 · أتمم الشراء

عروض بصوت العلامة

كل حملة على الموقع تحصل على لافتتها الخاصة بالنظام نفسه: شحن مجاني على كل شيء، والذكرى الخامسة والعشرون لـ Texx على خمسة طرازات من الخوذات، وسحب على تذاكر Festival Interlagos 2025 مع 4Ride Motorcycle، وأكواد خصم، وتشكيلة ملابس نسائية، وسياسة الإرجاع.

محتوى يجلب الناس

تحوّل المدوّنة فيديوهات القناة إلى مقالات، مثل «هل للخوذة تاريخ انتهاء؟»، فيقود البحث وYouTube كلاهما إلى المتجر.

Coisa de Motos

الرمز

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

الشعار النصي

الشعار النصي وكل العناوين مكتوبة بخط Evil Empire، خط عرض ثقيل ومضغوط بروح لافتات الكراجات، مع «de» صغيرة محشورة بين COISA وMOTOS. فالسائقون يختصرون الاسم إلى هاتين الكلمتين الكبيرتين على أي حال. وفي المتجر تعمل الواجهة بخط Inter، لتبقى الأسعار والمقاسات سهلة القراءة تحت العناوين الصاخبة.

ختم مبني على دوائر

الختم مبني على دوائر حول مركز واحد: تسير الحروف في شريط بين R، نصف القطر الخارجي، و0.75R؛ وتجلس «desde 2020» على قوس أصغر خاص بها في الأسفل؛ والخوذة، بارتفاع يزيد قليلًا على R، تقع يمين المركز قليلًا ليشير الواقي إلى الأمام، كما يميل السائق في المنعطف.

تكوينات الشعار

تجتمع القطع في أربعة تكوينات: أفقي للترويسات، وعمودي وعمودي ثانٍ للمساحات المربعة، وختم دائري تحمل قوسه عبارة «desde 2020»، يصلح صورةً للملف الشخصي وملصقًا ورقعة. ولكلٍّ منها نسخة لقناة YouTube.

أفقي

عمودي

ختم دائري

Colour

One loud colour and a few quiet ones, all saved as styles in the Figma file. Laranja is the brand: it's the symbol, the buttons, the sale bars. Near-black and white carry everything else, so the orange always means something.

Motonauta، الشخصية التعبيرية

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

أيقونات عروض ثلاثية الأبعاد

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

على الناس

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

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

الإطلاق

افتُتح المتجر بسلسلة تشويقية، «E-commerce Coisa de Motos, lançamento em breve»: المنتجات، وMotonauta، وDaniel بنفسه، منشورًا بعد منشور، حتى انطلق الموقع. وبعد أشهر احتفل النظام نفسه بـ 2,000 متابع على Instagram.

Instagram

9:41100%

coisademotos

312posts2.148seguidores186seguindo

Coisa de Motos

Maior e-commerce para motos do Brasil! 🏍️

Encontre tudo o que sua moto precisa.

coisademotos.com.br

SeguirMensagem

Sobre nósMedidasFAQVídeosLojaClientesOfertasCuponsComo comprarMoto criadoresMototripsManutenções

Instagram is the store's shop window, so the profile was designed as a whole, not post by post. The avatar is the round seal, and the highlights work like a menu: twelve covers, an orange icon on asphalt each, for sizes, FAQ, videos, the store, customers, offers, coupons, how to buy, the creators, trips and maintenance, with “Sobre nós” in full orange first.

The feed mixes three kinds of posts, each with its own template: product posts filmed with the gear itself, with a small “watch it on YouTube” tag, offers on the orange or black grounds of the ads, and moments like the 2,000-follower thank-you. Reels get covers in the same type, so the grid reads as one brand from a distance.

• منشورات المنتجات

  أيادٍ حقيقية على معدات حقيقية، مع إشارة إلى الفيديو الكامل

• العروض

  قسائم وإطلاقات على خلفيات الإعلانات

• أغلفة الريلز

  خط Evil Empire كبير فوق الإطار

• القصص المميّزة

  قائمة من الأغلفة: أيقونة برتقالية واحدة على الإسفلت لكلٍّ منها

الإعلانات

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

YouTube

على YouTube تحافظ القناة على النظام نفسه: لافتة بالختم، وأكثر من ثلاثمئة صورة مصغّرة بالخط الثقيل نفسه والأشرطة البرتقالية، للرحلات والمراجعات والتركيبات وأسئلة المجتمع.