Available

SA

Available

A-Team Community

A-Team Community

Team

Proyek

Proyek

UI/UX & Framer

UI/UX & Framer

UI/UX & Framer

Tahun

Tahun

2025

2025

2025

Industri

Industri

B2B/SaaS

B2B/SaaS

Ateam Community merupakan sebuah platform yang diciptakan untuk membantu para B2B founders men-scale, men-systemize, dan men-sell bisnis mereka. Tujuan utama dari proyek ini adalah membangun landing page yang tidak hanya menyampaikan value komunitas secara jelas, tapi juga tampil profesional dan kredibel.

Tahap Awal & Kick-off Meeting

Tahap Awal & Kick-off Meeting

Proyek ini dimulai dengan sesi meeting bersama klien untuk membahas visi, arah brand, serta kebutuhan bisnis secara menyeluruh. Dalam pertemuan tersebut, klien menjelaskan bahwa mereka ingin menghadirkan citra yang premium dan profesional.

Yang menarik, klien juga secara khusus menyampaikan keinginan untuk menerapkan gaya komunikasi dan pendekatan desain ala Alex Hormozi, di mana setiap elemen harus berfokus pada clarity, strong offer, dan value. Dari sini, saya memahami bahwa proyek ini tidak sekadar tentang visual yang menarik, tetapi tentang bagaimana desain bisa menjadi alat komunikasi strategis untuk menjual value komunitas dengan cara yang langsung dan berdampak.

Tantangan terbesar dari proyek ini adalah bagaimana menerjemahkan framework Alex Hormozi ke dalam desain visual yang tetap terasa eksklusif dan relevan bagi audiens B2B. Setiap elemen visual harus mampu menyampaikan pesan secara cepat, jelas, dan meyakinkan, tanpa kehilangan sentuhan profesionalitas yang diinginkan klien.


Selain itu, dengan menurunnya attention span pengguna digital, halaman perlu memiliki struktur yang efisien dan mudah diikuti. Setiap section harus punya fokus tunggal yang langsung mengarah pada nilai utama yang ingin disampaikan.

Rich Black

Deep Violet

Gradient

Inter

Aa

Regular

Medium

Semibold

Pendekatan Desain dan Solusi

Pendekatan Desain dan Solusi

Sebelum mulai mendesain, saya juga mempelajari benang merah dari gaya Alex Hormozi menggunakan ChatGPT sebagai media belajar. Dari situ, saya mencoba memahami pola dasar pembawaannya bagaimana Hormozi menekankan kejelasan nilai, urgensi penawaran, dan komunikasi yang to the point.

Kemudian di tahap design, saya mengembangkan sistem variant layout. Pada beberapa section, saya buat dalam dua hingga tiga varian visual yang memiliki perbedaan dalam komposisi. Dengan pendekatan ini, client bisa memilih versi yang paling efektif untuk digunakan, sekaligus melakukan A/B testing secara fleksibel jika diperlukan.

Selama proses desain, saya tidak hanya berfokus pada estetika, tetapi juga melakukan evaluasi terhadap setiap layout. Saya menggunakan ChatGPT sebagai sparring partner dalam proses validasi, karena proses ini sangat membantu untuk memastikan setiap versi memiliki pesan yang berbeda, tidak hanya cantik secara visual, tetapi juga strategis untuk menampilkan informasi.

Implementasi di Framer

Implementasi di Framer

Setelah desain selesai dan disetujui, tahap berikutnya adalah proses implementasi ke dalam Framer. Saya melakukan slicing design dan menjadikan beberapa menjadi komponen , memastikan setiap elemen dapat digunakan ulang dengan mudah. Layout dibuat sepenuhnya responsif untuk desktop, tablet, mobile, dengan breakpoint yang disesuaikan agar pengalaman pengguna tetap konsisten di semua ukuran layar.

Saya juga menggunakan variable dan menyiapkan variant di Framer, yang memungkinkan tim internal untuk mengganti varian hanya dengan “satu klik”. Untuk memastikan efisiensi jangka panjang dari sisi klien, saya membuatkan video tutorial yang menjelaskan cara pengguaanya agar mampu secara mandiri mengeditnya tanpa perlu intervensi desainer(saya) setiap kali ada pembaruan kecil.

Hasil Akhir

Hasil Akhir

Hasil akhirnya adalah landing page yang tidak hanya menarik secara visual, tetapi juga mendukung tujuan bisnis dengan pendekatan yang terukur dan berbasis teori. Penggunaan AI dalam proses validasi desain membantu mempercepat iterasi dan meningkatkan kualitas keputusan desain. Landing page ini memberikan hasil yang lebih terarah dalam hal clarity, konsistensi visual, dan conversion readiness. Pendekatan desain yang berbasis data dan teori ini membantu Ateam Community dapat meningkatkan kepercayaan dan profesional di mata para founder B2B.

Secara keseluruhan, proyek Ateam Community menjadi contoh kolaborasi yang kuat antara desainer, klien, dan teknologi, serta menegaskan pentingnya komunikasi efektif antara desainer dan klien. Pendekatan yang memadukan teori dan AI menghasilkan sebuah landing page yang tidak hanya estetis, tetapi juga memiliki arah bisnis yang jelas dan dampak yang terukur.

W

A

N

N

A

S

A

Y

H

I

?

Saya terbuka untuk terhubung baik Anda memiliki proyek yang ingin dibahas atau sekadar ingin berbagi ide, jangan ragu untuk menghubungi kapan saja!

Sapa Saya di

W

A

N

N

A

S

A

Y

H

I

?

Saya terbuka untuk terhubung baik Anda memiliki proyek yang ingin dibahas atau sekadar ingin berbagi ide, jangan ragu untuk menghubungi kapan saja!

Sapa Saya di

© 2024 Saifulaziz

Create a free website with Framer, the website builder loved by startups, designers and agencies.