Home Mobile UI Materials : Typography,Colors dan Icon

UI Materials : Typography,Colors dan Icon

0

Typography

Typography adalah teknik memilih dan menata huruf dengan pengaturan penyebarannya pada ruang yang tersedia untuk menciptakan kesan tertentu untuk kemudahan user dalam membaca,terdapat beberapa hal yang harus diperhatikan :

Dasar-dasar Tipografi Ada lima klasifikasi dasar tipografi: serif, sans serif, script, monospaced, dan display. Sebagai aturan umum, tipografi serif dan sans serif digunakan untuk salinan isi atau judul (termasuk judul, logo, dll.), Sedangkan jenis huruf skrip dan tampilan hanya digunakan untuk judul.

Beberapa yang harus diperhatikan pada readability(keterbacaan) adalah letter spacing(jarak antar huruf),line height(jarak antar baris),pargraph spacing(jarak antar paragraf),type aligment(perataan).

Iconography

Iconography adalah komponen pada UI yang berfungsi sebagai action maupun memperjelas sebuah informasi. Sebagai pembeda biasanya pada penggunaan sebagai action ukurannya yaitu 24px,sedangkan sebagai infomasi mempunyai ukuran 18px.

Terdapat beberapa jenis Icon yaitu :

  • Filled

Filled merupakan Icon yang terisi,seperti pada gambar dibawah :

  • Outline

Outline merupakan Icon yang menampilkan pinggiran garis,seperti pada gambar dibawah :

Colors

Color(warna) pada desain merupakan sekumpulan warna yang dapat membantu membuat theme warna menyimpulkan merek dan gaya sebuah product,terdapat jenis-jenis warna seperti primary color,secondary color/action color,sematic color,neutral color.

  • Primary Color

Primary Color merupakan warna yang utama yang menunjukkan sebuah warna brand atau identitas sebuah product.

  • Secondary Color/Action Color

Secondary Color/Action color merupakan warna tambahan dan sebagai pembeda setiap elemen

  • Sematic Color

Sematic Color adalah warna yang berfungsi untuk memberikan sebuah informasi seperti Error,Succes,dan lainnya.

  • Neutral color

Neutral Color biasanya berwarna putih,hitam,dan abu-abu yang biasa digunakan pada teks.