Catatan Kuliah: Pengenalan Figma untuk Desain UI/UX

Pendahuluan

• Salam pembuka: Assalamualaikum Wr Wb
• Fokus pembelajaran: Desain aplikasi dengan UI dan UX menggunakan Figma

Apa itu Figma?

• Definisi: Aplikasi desain berbasis cloud dan alat prototyping untuk proyek digital
• Fungsi: Digunakan untuk membuat situs web, aplikasi, dan komponen antarmuka pengguna
• Siapa yang Menggunakan: Dapat digunakan oleh siapa saja yang bekerja di ruang digital, tidak terbatas pada jurusan komputer
• Kolaborasi Tim: Mempermudah kerja tim dalam mendesain produk dan memasarkan kepada klien
• Alternatif: Sketch, Adobe XD, Envision, dll.

Versi Figma

• Versi Web: Dapat diakses melalui browser di figma.com
• Versi Desktop: Bisa diunduh melalui bagian produk di website Figma
• Pendaftaran Akun:
  • Jika baru, klik "sign up"
  • Jika sudah punya akun, klik "login"

Antarmuka Figma

• Tampilan Awal:
  • Area kerja (workspace/canvas)
  • Beberapa proyek yang dapat dibuka
• Membuat Tim:
  • Opsi untuk membuat tim dan mengundang anggota
• Membuat File Desain Baru:
  • Klik "new design file"

Fitur Utama dalam Figma

• Area Kerja: Ruang untuk mendesain
• Toolbar:
  • File, Edit, dan fungsi lainnya
• Tools:
  • Move (V): Untuk memindahkan objek
  • Scale (K): Untuk memperkecil atau memperbesar objek
  • Frame: Mirip dengan artboard di Adobe Illustrator
  • Slice, Shape, Text: Alat untuk menggambar dan menambahkan elemen
  • Komentar: Untuk komunikasi dengan klien atau tim
  • Properti Panel: Menyesuaikan dengan objek yang aktif

Pembuatan Frame

• Menentukan ukuran frame (iPhone, Android, dll.)
• Menyesuaikan properti dan warna background
• Layer panel untuk mengorganisir elemen desain

Penutup

• Materi berikutnya: Mendesain aplikasi di Figma
• Salam penutup: Semangat pagi para desainer, Assalamualaikum Wr Wb