User Tools

Site Tools


tech:designguidence

TLab Design Guidence

TLab Design Guidence merupakan wadah untuk berkomunikasi antar divisi dan sobat TLab dengan tujuan saling memahami istilah yang sering digunakan oleh divisi desain.

TLab Design Guidence in a nutshell

Development Section

  • Mockup
  • Project Highlight
  • Design Requirement
  • TLab Design Life Cycle
  • User Journey
  • User Stories
  • User Context
  • Wire Flow
  • Persona
  • Moodboard
  • Wireframe
  • Lo-fi
  • Hi-fi
  • Template
  • Handoff
  • Usability Testing
  • A/B testing

Company Section

  • Merchandise
  • Stasionery
  • GSM
  • Brand Identity

Mockup

  • Mockup dibuat untuk mengajukan penawaran project.
  • Output mockup berupa slide presentasi dengan konten fitur-fitur unggulan.
  • Setiap Desain mockup disimpan dalam folder project melalui google drive.
  • Desain yang dibuat merupakan gambaran umum yang tidak detail dalam bentuk hi-fi yang di-trademark.

Contoh mockup


Project Highlight

  • Project Highlight adalah portofolio dari projects yang pernah dikerjakan
  • Output dari project Highlight adalah slide peresentasi dari fitur-fitur yang dikerjakan dalam proyek ini
  • Kontennya Real yang sudah diimplementasikan.

link Lebih lanjut terkait project highlight


Design Requirement

  • Design Requirement adalah form untuk mendapatkan referensi kebutuhan klien berdasakan
    • Brand identity
    • Kebutuhan warna
    • Moodboard
  • Setiap Design Requirement disimpan dalam folder project melalui google drive.

Template Design Requirement


TLab Design Life Cycle

  • TLab Design Life Cycle adalah konsep/metodologi antar stakeholder agar selaras dalam proses pengembangan proyek.
  • TLab Design Life Cycle terdiri dari berbagai pase, diantaranya:
    • Dokumen kolaboratif
    • Brainstorming Idea
    • Prototyping
    • Learn & Measuring

Detail TLab Design Life Cycle


User Journey

  • User Journey adalah proses untuk mencari dan menentukan apa saja kemungkinan yang akan terjadi saat pengguna menggunakan produk untuk mencapai tujuan-tujuannya.

Brainstorming Idea - User Journey


User Stories

  • User Stories adalah proses untuk mendefinisikan apa saja tujuan pengguna saat menggunakan produk.
  • Setiap Story memiliki 3 komponen penting, diantaranya:
    • Persona
    • Motivasi
    • Ekspektasi

Brainstorming Idea - User Stories


User Context

  • User Context adalah proses untuk menemukan beberapa kemungkinan kondisi pengguna saat ingin menggapai tujuan.

Brainstorming Idea - User Context


Wire Flow

  • Wire Flow adalah proses untuk menemukan beberapa beberapa alternatif alur untuk mencapai tujuan
  • Bentuknya seperti flow diagram

Brainstorming Idea - Wire Flow


Persona

  • Persona adalah proses untuk mencari dan menentukan karakteristik siapa saja pengguna yang akan menggunakan produk
  • Personalitas yang menggambarkan/mewakilkan kelompok pengguna yang dituju (target market).

Brainstorming Idea - Persona


Wireframe

  • Wireframe adalah penggabungan wireflow dalam figma disimpan dengan nama page wireframe
  • Tahapan di wire flow diganti dengan Lo-Fi design.

Contoh Wireframe


Lo-Fi

  • Lo-Fi, Low Fidelity adalah proses menggabungkan semua user journey ke dalam 1 aktifitas.
  • Pengerjaan Lo-Fi berdasarkan Paper Prototyping.
  • Lo-fi dibuat dengan wifeframe, dalam figma disimpan dengan nama page wireframe

Prototyping - Lo-Fi


Hi-Fi

  • Hi-Fi, High Fidelity adalah proses implementasi desain berdasarkan Product Brand Principle
  • Hi-Fi dalam figma disimpan dengan nama page designing v.1

Prototyping - Hi-Fi


Template

  • Template adalah proses implementasi dari Hi-Fi (web design) ke dalam code
  • Implementasi Code bisa dalam berbagai jenis tergantung proyeknya, diantaranya:
    • VueJS/NuxtJS
    • HTML
    • Laravel blade

Handoff

  • Handoff adalah proses dimana ketika proses hi-fi sudah disepakati bersama
  • Handoff dalam figma disimpan dengan nama page Handoff v.1
  • Developer mengimplementasikan design di page handoff

Usability Testing

  • Usability Testing adalah proses untuk mengukur kebergunaan & kenyamaan dari sebuah produk yang dibuat
  • Usability Testing yang dilakukan biasanya mengukur keberhasilan pengguna mencapai tujuannya

A/B Testing

  • A/B Testing adalah proses untuk mengukur kebergunaan & kenyamaan dari 2 desain yang berbeda.
  • A/B Testing prosesnya seperti Usability Testing
  • A/B Testing bisa saja membandingkan 2 flow yang berbeda dengan tujuan yang sama.

Merchandise

  • Merchandise atau Merchandising adalah perlengkapan untuk kebutuhan branding TLab
  • Pemberian Merchandise biasanya untuk
    • Peserta event TLab
    • Peserta magang
    • Kegitana kolaborasi TLab dengan pihak lain

Stasionery

  • Stasionery adalah perlengkapan yang berhubungan dengan dokumen
  • Stasionery biasanya terdiri dari
    • Template google docs
    • Amplop
    • Map
    • id card

Brand Identity

  • Brand Identity adalah aturan penggunaan Logo TLab
  • Beberapa aturannya berkaitan dengan
    • Penggunaan Logo berdasarkan jenisnya
    • Pengunaan Logo berdasarkan latar dan posisinya
    • Penggunaan warna identitas TLab
    • Do & Don't
tech/designguidence.txt · Last modified: 2021/06/07 04:44 by agilbaka