Coisa de Motos

Sebuah kanal punya penggemar. Sebuah toko butuh brand yang mereka percayai untuk uang mereka.

Coisa de Motos adalah sebuah nama, sebuah suara, dan sebuah komunitas sebelum menjadi apa pun yang bisa dibeli. Mengubahnya menjadi toko berarti menjaga suara itu, lantang, lucu, dan sangat jalanan, sambil tetap terlihat cukup serius sampai orang mau membeli jaket seharga R$2.000 di sana.

Ia juga harus lentur. Identitas yang sama akan ada di merchandise, di situs yang penuh cakram rem dan visor, dan di ritme mingguan story dan thumbnail, dibuat cepat dan selalu mudah dikenali.

Dibangun di Shopify

Kami membangun seluruh tokonya di Shopify dan memakai platformnya semaksimal mungkin, bukan membangun di sekelilingnya: tema yang disesuaikan dengan brand, katalog dengan koleksi dan variannya, pencarian dan filter, checkout dan pembayaran, kode diskon seperti MOTONAUTA, blog, dan aplikasi untuk sisanya.

Bersandar pada platform membuat tim dua orang bisa menjual ratusan suku cadang tanpa mengurus server, dan menyisakan waktu kami untuk hal yang membuat tokonya berbeda: tampilannya, cara ia diatur, dan apa yang ia sampaikan.

Toko ini menjual perlengkapan berkendara, pakaian, dan ratusan suku cadang, jadi pekerjaan desainnya sebagian besar soal menemukan barang. Bilah pencarian besar ada di header, dan mega menu membagi suku cadang per sistem: mesin, rem, kelistrikan, dan lainnya.

Dikoding dengan ChatGPT

Menyesuaikan tema Shopify berarti menulis Liquid, bahasa template milik Shopify, dicampur HTML, CSS, dan JavaScript. Saya menulis punya kami dengan ChatGPT. Saya jelaskan perubahan yang saya mau, tempel kode yang ia berikan ke editor tema Shopify, lalu lihat hasilnya. Kalau ada yang rusak, saya salin lagi kodenya dari Shopify dan kirim ke ChatGPT bersama bug-nya, sampai berhasil.

Coding dengan AI masih di tahap awal, dan tidak ada satu pun yang hidup di dalam editor tema tempat saya bekerja. Semuanya copy-paste di antara dua tab, tapi itu sudah jadi cara saya membangun sesuatu.

ChatGPT

Tambahkan bar di bagian atas yang memberi diskon 5% untuk pembeli pertama dengan MOTONAUTA

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

Copy the code

Tempel bug-nya kembali

Shopify · Edit kode

header.liquidtheme.liquid

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

Etalase yang menjual

Beranda dibuka dengan penawaran minggu ini, lalu kategori yang paling sering dibeli pengendara: helm, jaket, sarung tangan, sepatu bot, dan suku cadang. Bar tipis di atas memberi setiap pembeli pertama diskon 5% dengan kupon MOTONAUTA, dengan kata milik komunitas itu sendiri, dan akunnya menyapa mereka dengan “Salve, motonauta!”.

Suku cadang, per sistem

Kategori terbuka menjadi mega menu yang dikelompokkan seperti cara berpikir mekanik, jadi orang yang mencari kampas rem tidak perlu menggulir melewati knalpot.

Coisa de Motos

Dibangun untuk ponsel

Pengendara menemukan toko ini lewat Instagram dan YouTube, di ponsel mereka, jadi setiap layar dirancang untuk ponsel sama seriusnya dengan untuk desktop. Kami juga mengubah alurnya menjadi panduan enam langkah cara membeli, dari beranda sampai checkout, untuk orang-orang yang belum pernah membeli perlengkapan secara online.

1. 

   1 · Buka situsnya

2. 

   2 · Pilih kategori

3. 

   3 · Urutkan yang kamu lihat

4. 

   4 · Buka produknya

5. 

   5 · Cek detailnya

6. 

   6 · Checkout

Promosi dengan suara brand

Setiap kampanye di situs dapat banner sendiri dengan sistem yang sama: gratis ongkir untuk semua produk, ulang tahun ke-25 Texx untuk lima model helm, giveaway tiket Festival Interlagos 2025 bersama 4Ride Motorcycle, kode kupon, lini pakaian wanita, dan kebijakan pengembalian.

Konten yang mendatangkan orang

Blognya mengubah video-video kanal menjadi artikel, “apakah helm punya masa kedaluwarsa?”, jadi pencarian dan YouTube sama-sama mengarah kembali ke toko.

Coisa de Motos

Simbolnya

Simbolnya adalah helm yang dilihat dari samping, visornya dipotong menjadi tiga garis yang terbaca sebagai kecepatan, sekaligus sebagai huruf E dari pengendara yang sedang melaju. Ia bekerja terisi untuk ukuran kecil dan stempel, dan bergaris luar untuk ukuran besar yang lapang, dalam oranye, hitam, atau putih.

Wordmark-nya

Wordmark dan setiap headline memakai Evil Empire, huruf display tebal dan rapat dengan nuansa papan nama bengkel, dengan “de” kecil terselip di antara COISA dan MOTOS. Para pengendara toh menyingkat namanya menjadi dua kata besar itu. Di toko, antarmukanya memakai Inter, supaya harga dan ukuran tetap mudah dibaca di bawah headline yang lantang.

Segel yang dibangun dari lingkaran

Segelnya dibangun dari lingkaran-lingkaran di sekitar satu titik pusat: huruf-hurufnya berada di sebuah pita antara R, jari-jari luar, dan 0,75R; “desde 2020” duduk di busurnya sendiri yang lebih kecil di bawah; dan helmnya, sedikit lebih tinggi dari R, berada sedikit di kanan tengah supaya visornya menghadap ke depan, seperti pengendara yang memiringkan badan di tikungan.

Lockup

Bagian-bagiannya digabung menjadi empat lockup: horizontal untuk header, vertikal dan vertikal kedua untuk ruang persegi, dan segel bundar, dengan “desde 2020” di busurnya, yang bisa jadi foto profil, stiker, dan patch. Masing-masing punya versi YouTube untuk kanalnya.

Horizontal

Vertikal

Segel bundar

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, sang maskot

Brand ini butuh wajah yang bukan orang sungguhan, jadi lahirlah Motonauta: pengendara berhelm hitam dan berjaket Texx yang mewakili komunitasnya. Ia memegang kupon, mengacungkan jempol, mengukur kepalanya untuk ukuran helm. Pose-posenya dibuat dengan alat gambar AI lalu dikurasi menjadi satu karakter yang konsisten.

Ikon penawaran 3D

Untuk penawaran ada satu set objek 3D dalam oranye khas brand: kupon, persentase, hadiah, balon oranye dan hitam, tanda tanya, troli belanja, kamera, dan bintang. Mereka melayang di sekitar produk di banner dan iklan. Dorong mereka, atau tarik satu ke belakang lalu lepaskan.

Dipakai orang

Tempat pertama brand ini harus berhasil adalah di badan orang. Simbolnya kecil di dada dan besar di punggung, dan segel bundarnya terbawa ke topi dan ke kotak tempat pesanan dikirim.

Toko sebesar ini hidup dari ritme postingan yang stabil, jadi brand-nya lebih butuh template daripada desain sekali pakai: satu tampilan per seri, cepat diisi dan mustahil tertukar dengan siapa pun.

Peluncurannya

Toko dibuka dengan seri teaser, “E-commerce Coisa de Motos, lançamento em breve”: produk-produknya, Motonauta, dan Daniel sendiri, satu postingan demi satu, sampai situsnya live. Beberapa bulan kemudian sistem yang sama merayakan 2.000 pengikut di 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.

• Postingan produk

  Tangan sungguhan memegang perlengkapan sungguhan, ditautkan ke video lengkapnya

• Penawaran

  Kupon dan peluncuran di atas latar ala iklan

• Sampul reel

  Huruf Evil Empire besar di atas frame

• Sorotan

  Menu sampul: masing-masing satu ikon oranye di atas aspal

Iklan

Iklan dan thumbnail mendorong brand-nya lebih jauh: oranyenya jadi seluruh latar, produk-produk melayang dalam 3D di sekitar orangnya, dan hurufnya dibuat sebesar yang dimungkinkan frame.

YouTube

Di YouTube kanalnya memakai sistem yang sama: banner dengan segelnya, dan lebih dari tiga ratus thumbnail dengan huruf tebal dan bar oranye yang sama, untuk perjalanan, ulasan, pemasangan, dan pertanyaan dari komunitas.