Minggu, 31 Agustus 2025

WIREFRAME

Agustus 31, 2025 0 Comments

 

Pengertian Wireframe

Wireframe adalah kerangka dasar visual dari sebuah halaman atau aplikasi yang menggambarkan tata letak (layout), struktur konten, serta fungsi-fungsi utama tanpa berfokus pada desain visual (warna, gambar, tipografi).

Sederhananya, wireframe itu seperti denah rumah: belum dicat, belum ada dekorasi, tapi sudah jelas posisi ruangannya, pintu, jendela, dan alurnya.


Tujuan Wireframe

  1. Membuat gambaran awal sebelum masuk ke tahap desain UI (User Interface).

  2. Membantu komunikasi antara tim desain, developer, dan klien.

  3. Menghemat waktu & biaya dengan menemukan masalah struktur lebih awal.

  4. Menjadi acuan pengembangan untuk desain dan coding.


Unsur-unsur Wireframe

  1. Layout dasar → struktur kolom, grid, header, sidebar, footer.

  2. Navigasi → menu, tombol, link.

  3. Konten utama → teks placeholder (lorem ipsum), gambar dummy (kotak dengan X).

  4. Hierarki informasi → ukuran dan posisi elemen menunjukkan prioritas.

  5. Fungsionalitas dasar → form, search bar, pagination, filter.


Jenis Wireframe

  1. Low-fidelity Wireframe

    • Sederhana, biasanya hanya berupa garis, kotak, teks dummy.

    • Fokus pada struktur dan alur.

    • Bisa dibuat dengan kertas atau tools sederhana.

  2. Mid-fidelity Wireframe

    • Sudah lebih detail, mulai memperlihatkan hierarki informasi dan fungsi.

    • Ada ikon dasar, placeholder lebih jelas.

  3. High-fidelity Wireframe

    • Hampir menyerupai desain akhir, tapi belum fokus ke warna dan style.

    • Menunjukkan interaksi lebih kompleks (drop-down, slider, hover).

    • Sering dipakai untuk testing user flow sebelum masuk ke prototipe.


🛠️ Tools untuk Wireframe

  • Manual: kertas, whiteboard, sticky notes.

  • Digital:

    • Figma

    • Sketch

    • Adobe XD

    • Balsamiq

    • Miro

    • Axur


🔄 Proses Pembuatan Wireframe

  1. Riset kebutuhan → pahami user & tujuan aplikasi/website.

  2. Membuat user flow → alur perjalanan pengguna.

  3. Sketsa awal → tentukan struktur dasar.

  4. Membuat wireframe low/mid/high fidelity sesuai kebutuhan.

  5. Review & revisi bersama tim/klien.

  6. Lanjut ke prototipe & UI design.


 Contoh Perbandingan

  • Wireframe = kerangka rumah → belum ada warna, cat, atau dekorasi.

  • Mockup = rumah sudah ada cat dan perabot, tapi belum bisa dimasuki.

  • Prototype = rumah sudah bisa dimasuki, ada pintu yang bisa dibuka, lampu bisa dinyalakan (interaktif).


    Tutorial Membuat Header dan navigation

    1. Buka Figma 

  • Login ke Figma

  •   Klik tombol + New design file→ untuk membuat file baru.

     2. Atur Frame / Canvas

  • Pilih tool Frame (F) → lalu pilih Desktop (misalnya ukuran 1440px).

  • Ini akan menjadi kanvas utama tempat kita mendesain. 

      

     

    3. Buat Sidebar (Bagian Ungu di Kiri)

  • Gunakan tool Rectangle (R).

  • Tarik kotak panjang menutupi sisi kiri frame.

  • Atur Fill color → pilih ungu (#A855F7 atau sesuai keinginan).

  • Ini berfungsi sebagai navigasi samping / sidebar.


     
     

    4. Tambahkan Judul Aplikasi

    •  Pilih tool Text (T).

    • Tulis: FoodMeal.

    • Letakkan di dalam sidebar.

    • Atur ukuran font (misal 24px, bold, warna putih).

       


       

      5. Bagian Header (Atas Layar)

    • Pilih Text (T) → tulis: Hey, Zack.

    • Letakkan di atas bagian konten (kanan atas).

    • Tambahkan search bar lagi (rectangle dengan rounded corner putih).

        

    6. Buat Banner / Carousel

    • Gunakan Rectangle (R) besar di bawah header.

    • Warnai putih (#FFFFFF).

    • Bisa tambahkan placeholder bulatan kecil di bawahnya (pakai Ellipse (O)) → untuk indikator slide.

    7. Buat Grid Produk / Konten

    • Gunakan Rectangle (R) lagi.

    • Buat beberapa kotak besar (misalnya 2 kolom x 3 baris).

    • Warnai abu-abu (#E5E5E5) sebagai placeholder gambar produk.




    8. Buat Menu Kategori (Kotak Kecil)

    • Gunakan Rectangle (R).

    • Buat kotak kecil berjejer horizontal (5 kotak).

    • Kotak pertama bisa diwarnai ungu (aktif), sisanya putih.

    • Atur sudut agak rounded biar lebih soft.


    9. Rapikan & Grouping

    • Pilih semua elemen di bagian tertentu → klik kanan → Group.

    • Atur spacing agar rapi dengan Align tools (di atas Figma).





Minggu, 17 Agustus 2025

BRAINSTORMING

Agustus 17, 2025 0 Comments

 

📌 Pengertian Brainstorming

Brainstorming adalah suatu metode atau teknik untuk menghasilkan ide, solusi, atau gagasan baru secara spontan dalam suatu kelompok atau individu.
Konsep utamanya adalah mengumpulkan sebanyak mungkin ide tanpa langsung menilai benar atau salah, lalu setelah terkumpul barulah dilakukan evaluasi dan seleksi.

Metode ini pertama kali diperkenalkan oleh Alex Faickney Osborn (seorang eksekutif periklanan Amerika) pada tahun 1940-an.

👉 Intinya: Brainstorming = curah pendapat bersama untuk mencari ide kreatif.


🎯 Tujuan Brainstorming

  1. Menghasilkan banyak ide dalam waktu singkat.

  2. Menemukan solusi dari berbagai sudut pandang.

  3. Mendorong kreativitas dan inovasi.

  4. Melibatkan partisipasi aktif semua anggota.

  5. Memecahkan masalah yang sulit dengan cara kolektif.


🔑 Ciri-ciri Brainstorming

  • Dilakukan dalam suasana bebas & terbuka (tidak ada ide yang langsung ditolak).

  • Fokus pada kuantitas ide, bukan kualitas di awal.

  • Semua orang punya kesempatan bicara.

  • Setelah ide terkumpul, baru ada proses seleksi & evaluasi.

  • Menggunakan teknik pemicu kreativitas (misalnya pertanyaan, kata kunci, analogi).


Manfaat Brainstorming

  1. Meningkatkan kreativitas individu maupun kelompok.

  2. Mempercepat pengambilan keputusan.

  3. Memunculkan ide-ide unik yang tak terpikirkan sebelumnya.

  4. Membiasakan berpikir terbuka dan tidak kaku.

  5. Meningkatkan kerja sama tim dan komunikasi.


📚 Jenis-jenis Brainstorming

Brainstorming punya banyak variasi. Berikut beberapa yang paling sering dipakai:

1. Brainstorming Tradisional (Klasik)

  • Dilakukan dalam kelompok.

  • Semua orang bebas mengemukakan ide tanpa kritik.

2. Brainwriting

  • Peserta menulis ide mereka di kertas atau media lain.

  • Setelah itu dikumpulkan, lalu dibahas bersama.

  • Cocok untuk orang yang pemalu atau tidak nyaman bicara di depan.

3. Nominal Group Technique (NGT)

  • Tiap orang menuliskan ide secara individual.

  • Ide dibacakan, lalu kelompok memberikan penilaian.

  • Lebih terstruktur dibanding brainstorming klasik.

4. Round Robin Brainstorming

  • Peserta secara bergiliran menyampaikan ide.

  • Semua mendapat giliran, sehingga adil.

5. Starbursting

  • Fokus pada membuat daftar pertanyaan, bukan jawaban.

  • Contoh: "Siapa targetnya?", "Bagaimana cara menjualnya?", "Apa risikonya?".

  • Cocok untuk tahap awal pengembangan ide.

6. Rapid Ideation

  • Peserta diberi waktu singkat (misalnya 5–10 menit) untuk menuangkan ide sebanyak mungkin.

  • Setelah waktu habis, ide dievaluasi.

7. Brain-netting (Online Brainstorming)

  • Brainstorming dilakukan secara online (misalnya lewat Google Docs, Miro, Slack).

  • Cocok untuk tim yang bekerja jarak jauh.

8. Role Storming

  • Peserta berpikir seolah-olah mereka adalah orang lain (misalnya pelanggan, pesaing, tokoh tertentu).

  • Tujuannya agar melihat masalah dari sudut pandang berbeda.

9. SWOT Brainstorming

  • Fokus pada Strengths, Weaknesses, Opportunities, Threats.

  • Banyak digunakan dalam bisnis dan perencanaan strategi.


📝 Langkah-langkah Umum Brainstorming

  1. Tentukan tujuan atau masalah yang akan dibahas.

  2. Tentukan aturan dasar (misalnya tidak boleh mengkritik).

  3. Kumpulkan ide sebanyak mungkin.

  4. Catat semua ide tanpa disaring.

  5. Diskusikan, gabungkan, atau seleksi ide terbaik.

  6. Ambil kesimpulan dan tindak lanjut.


⚡ Jadi, brainstorming bukan sekadar ngobrol biasa, tapi sebuah teknik sistematis untuk menghasilkan ide kreatif.
Kalau mau dipakai, bisa pilih jenis brainstorming sesuai kebutuhan (kelompok kecil, diskusi formal, online, dll).

Senin, 04 Agustus 2025

DESAIN BRIEF

Agustus 04, 2025 0 Comments

 

PENGERTIAN DESAIN BRIEF

Desain Brief adalah dokumen ringkas namun komprehensif yang berisi informasi penting tentang proyek desain yang akan dikerjakan. Brief ini menjadi panduan bagi desainer untuk memahami kebutuhan klien, tujuan proyek, target audiens, serta batasan atau arahan yang harus diikuti selama proses desain.


📚 UNSUR-UNSUR DESAIN BRIEF

Unsur-unsur yang umum terdapat dalam desain brief meliputi:

  1. Latar belakang proyek

  2. Tujuan desain

  3. Deskripsi target audiens

  4. Ruang lingkup pekerjaan desain

  5. Pesan yang ingin disampaikan

  6. Referensi visual atau gaya yang diinginkan

  7. Deadline dan jadwal kerja

  8. Anggaran (jika ada)

  9. Kontak dan pihak yang terlibat


🧩 STRUKTUR DESAIN BRIEF

Berikut adalah struktur umum dari sebuah desain brief:

  1. Informasi Umum

    • Nama proyek

    • Klien

    • Tanggal

  2. Latar Belakang Proyek

    • Sejarah singkat brand/produk

    • Masalah yang dihadapi

  3. Tujuan Proyek

    • Apa yang ingin dicapai melalui desain

  4. Target Audiens

    • Siapa pengguna akhir dari desain tersebut

  5. Ruang Lingkup Desain

    • Jenis desain yang diminta (logo, poster, UI/UX, dll.)

  6. Gaya Visual yang Diinginkan

    • Mood, warna, tipografi, dan contoh referensi

  7. Pesan Utama

    • Apa pesan yang harus ditangkap oleh audiens

  8. Batasan atau Ketentuan Khusus

    • Hal-hal yang perlu dihindari atau diperhatikan

  9. Timeline dan Revisi

    • Deadline pengerjaan dan jumlah revisi

  10. Anggaran

    • Dana yang disediakan (opsional)

12GRADE

Agustus 04, 2025 0 Comments

 


 Masuk kelas 12 tuh kayak tiba-tiba ditampar kenyataan. Jujur, kelas 11 rasanya santai banget — isi hariku cuma sekolah dan organisasi, pulang nggak mikirin hal berat. Tapi sekarang? Semua berubah.

Karena aku anak SMK, semua ujian dilaksanain di semester 1. Belum lagi ada TKA, jadi tiap hari kayak dikejar-kejar waktu. Sekolah dari pagi, pulang sore lanjut organisasi sampai magrib. Malemnya? Langsung les. Pulang les jam setengah 9 malam, nyampe rumah cuma bisa buka HP sebentar… eh udah ketiduran, tahu-tahu pagi lagi.

Capek? Banget.
Nyesel ikut organisasi? Sempat.

Tapi dari situ aku belajar banyak. Gimana caranya bagi waktu, gimana harus tetep jalan walau lelah. Hidup kelas 12 itu padet, tapi juga penuh pelajaran. Kadang ngeluh, tapi aku tahu ini semua baru permulaan.

Setelah ini masih ada dunia kerja yang lebih nyata — yang lebih berat dan lebih luas. Tapi aku percaya, kalau kita terus usaha, semua bisa dilewatin.

Semangat buat kita semua yang lagi ngerasain sibuknya kelas 12. Capeknya mungkin beda-beda, tapi yakin deh… kita semua pasti bisa!

 

 



 

ABOUT ME

Agustus 04, 2025 0 Comments

 

 Halo! Aku siswi kelas 12 SMK jurusan Desain Komunikasi Visual (DKV). Banyak yang bilang aku anaknya extrovert, tapi sebenarnya aku baru bisa benar-benar nyaman dan terbuka kalau udah akrab sama orangnya. Kalau ketemu orang baru, aku biasanya masih canggung dan agak susah buat langsung nyambung.

Aku suka banget sama hal-hal yang berbau seni. Salah satu hobi yang paling aku nikmatin adalah melukis wajah atau face painting. Buat aku, seni bisa dituangin ke mana aja, dan wajah itu salah satu media yang paling seru untuk diekspresikan. Lewat makeup painting, aku bisa menuangkan apa yang aku rasa, tanpa harus banyak bicara.

Selain itu, aku juga suka melukis di atas kanvas, terutama gaya abstrak. Rasanya bebas banget waktu bisa mainin warna tanpa harus mikirin bentuk yang pasti. Aku juga senang menulis, entah itu cerpen, novel, atau sekadar curhat kreatif. Pokoknya semua yang bisa bantu aku mengekspresikan diri, aku suka.

Oh iya, satu lagi: aku juga suka masak! Kadang buat ngilangin penat dari tugas-tugas desain, aku lari ke dapur buat nyobain resep baru atau sekadar bikin makanan favorit.

Harapan saya setelah belajar KKDKV Desain publikasi

Agustus 04, 2025 0 Comments

 

Harapan saya setelah belajar KKDKV Desain publikasi 

 Belajar materi KKDKV-DP itu pengalaman yang membuka wawasan. Aku jadi tahu kalau desain publikasi bukan hanya soal membuat tampilan menarik, tapi juga soal menyampaikan pesan dengan cara yang tepat ke target audiens tertentu. Desain bukan cuma soal estetik, tapi juga tentang fungsi dan makna.

Desain publikasi ternyata bisa digunakan untuk berbagai tujuan, mulai dari edukasi, promosi, sampai informasi. Contohnya bisa dilihat dari web sekolah, brosur pariwisata, feed Instagram brand lokal, atau bahkan poster sosial. Masing-masing target tentu butuh pendekatan visual yang berbeda, seperti pemilihan warna, gaya layout, jenis huruf, tone caption, sampai bentuk visualnya.

Dari pelajaran yang aku dapat, proses membuat desain publikasi itu ada langkah-langkahnya. Mulai dari membuat brief, berdiskusi tentang kebutuhan desain, membuat sketsa awal, lalu dieksekusi jadi karya desain yang siap ditampilkan. Setelah itu, masih ada tahap preview atau review akhir sebelum dipublikasi. Setiap langkah itu ngajarin aku pentingnya proses dan ketelitian dalam berkarya.

Nah, dari semua pembelajaran itu, harapan aku ke depannya adalah bisa berbagi ilmu yang aku dapat. Aku ingin bisa bantu teman-teman yang mungkin belum begitu paham soal desain publikasi, supaya kita bisa berkembang bareng. Aku juga ingin jadi pribadi yang bisa menyebarkan ilmu yang bermanfaat buat siapa pun yang butuh — karena menurutku, ilmu itu akan jadi lebih bermakna saat dibagikan, bukan disimpan sendiri.

WIREFRAME

  Pengertian Wireframe Wireframe adalah kerangka dasar visual dari sebuah halaman atau aplikasi yang menggambarkan tata letak (layout), st...