Pokok Bahasan. Konsep Dasar Desain Web Konsep Pewarnaan Tipografi Layout

dokumen-dokumen yang mirip
Pokok Bahasan. Konsep Dasar Desain Web. Konsep Dasar Desain Web (2) 20/01/2012. Konsep Dasar Desain Web Konsep Pewarnaan Tipografi Layout

Pertemuan X. Ali Tarmuji, S.T., M.Cs. Pemrograman Web. Teknik Informatika Fakultas Teknologi Industri.

REKAYASA PERANGKAT LUNAK LANJUT DESIGN WEB E. Defri Kurniawan M.Kom

ANALYSIS & DESIGN WEB E

DESAIN WEB SITE. Copyright Asep Herman Suyanto

DESAIN WEB SITE E-LEARNING

Komunikasi Multimedia

TIPOGRAFI DEDDY AWARD W. LAKSANA, M.Pd

Sabtu, 1 Desember 2012

12/1/ Pengaturan 2.Keseimbangan 3.Warna 4.Legibilitas (Kemudahan dibaca) 5.Menarik

Pertemuan 07 Typografi

BAB IV TAHAPAN PRODUKSI MEDIA

PEMBUATAN DESAIN TIPOGRAFI

TIPOGRAFI. Oleh Mega Murti Sarilani U L I S A N SEN

PELATIHAN DAN PENDAMPINGAN PENGEMBANGAN WEB PEMBELAJARAN INTERAKTIF BAGI GURU SMK MENUJU SEKOLAH BERSTANDAR INTERNATIONAL

TIPOGRAFI SEBUAH ILMU TENTANG HURUF

Gambar 3. Contoh prinsip keseimbangan horizontal

Tipografi Aplikatif PENGELOMPOKAN HURUF. Ir. Kamil Rusdi Abdullah, M.Si. Modul ke: 06Fakultas FAKULTAS TEKNI PERENCANAAN DAN DESAIN

BAB III TEORI PENUNJANG

BAB II Analisis Data dan Fakta

DAFTAR ISI ABSTRAK... i. KATA PENGANTAR... ii. UCAPAN TERIMAKASIH... iii. DAFTAR ISI... v. DAFTAR GAMBAR... x. DAFTAR TABEL...

Tipografi Aplikatif TIPOGRAFI IKLAN MEDIA CETAK. Ir. Kamil Rusdi Abdullah, M.Si. Modul ke: 15Fakultas FAKULTAS DESAIN DAN SENI KREATIF

BAB III TINJAUAN PUSTAKA. sehingga bisa diakses di seluruh dunia selama terkoneksi dengan jaringan internet.

BAB III TINJAUANPUSTAKA

BAB 5 HASIL DAN PEMBAHASAN DESAIN. Buku Yoga untuk Kesehatan ini menggunakan dua jenis huruf untuk

TIPOGRAFI. Menggabungkan Teks dalam Sajian Multimedia

Enjang Pera Irawan, S.Sos, M.I.Kom

BAB 5 HASIL DAN PEMBAHASAN DESAIN

Peran dari pada tipografi itu sendiri adalah untuk mengkomunikasikan ide atau informasi dari halaman tersebut ke pengamat. Terkadang secara tidak

MEETING 4 (1) GRAPHIC DESIGNING. Huruf dan tipografi

BAB III LANDASAN TEORI

Font and typeface. Apa itu Font?

BAB III DATA PENUNJANG

Cover buku terdiri dari brand name/judul buku, nama penulis, dan elemen.

BAB III LANDASAN TEORI

BAB II TINJAUAN PUSTAKA. seseorang ( Namun menurut Suyatno, desain grafis

BAB III TEORI PENUNJANG. teori-teori penunjang sebagai referensi praktikan untuk membuat sebuah

BAB II TINJAUAN PUSTAKA

Grafik merupakan sumber untuk membantu pembinaan media pembelajaran yang berkesan.

BAB 4 KONSEP DESAIN. 4.1 Landasan Teori

BAB V IMPLEMENTASI KARYA. Pada bab ini penulis akan menjelaskan beberapa perancangan redesign logo. konsep desain yang tertulis pada bab sebelumnya.

BAB 4 KONSEP DESAIN. 4.1 Landasan Teori Teori Publikasi

Teks dan Background SERIF SANS-SERIF MONOSPACE

BAB III METODE PERANCANGAN

BAB IV KONSEP. Sistem panduan arah terpadu dapat dibedakan menjadi 6 jenis; yaitu: membutuhkan informasi yang spesifik.

BAB IV KONSEP DESAIN

BAB IV KONSEP DESAIN


BAB III TEORI PENUNJANG

ANALISA WEBSITE TRIBUN PEKANBARU MENGGUNAKAN USER CENTERED DESIGN (UCD) SHINTA RAHAYU

BAB IV KONSEP DESAIN. Camera Angle ( Sudut Pengambilan Gambar )

BAB 4 KONSEP DESAIN. 4.1 Landasan Teori Teori Layout. Dalam buku The Fundamentals of Creative Design

BAB II LANDASAN TEORI. sebuah hubungan. Karena dengan adanya komunikasi kita akan mengetahui

PENYEDIAAN BAHAN PAMERAN. CARTA atau BUKU SKRAP

BAB IV PRODUKSI MEDIA

BAB III TEORI PENUNJANG

10/04/2014. Oleh: Fiftin Noviyanto, S.T., M.Cs.

DESAIN. Interaksi Manusia & Komputer

Ahli Tipografi disebut TIPOGRAFER (ahlinya tipografi gitu...)

PERANCANGAN DESAIN BLOG PROMOSI DENGAN MEMPERTIMBANGKAN ASPEK DISPLAY ERGONOMI

PRINSIP DESAIN DAN LAYOUT

BAB III LAPORAN KERJA PRAKTEK

BAB 4 KONSEP DESAIN. Bentuk logo - Unik dan memiliki ciri khas tersendiri.

BAB III METODE PERANCANGAN. Centro Media Indonesia (Euphoria Hotel) adalah : Ilmu Desain Komunikasi Visual memiliki cakupan yang sangat luas, oleh

Tipografi Aplikatif PENGGUNAN HURUF DISPLAY. Ir. Kamil Rusdi Abdullah, M.Si. Modul ke: 10Fakultas FAKULTAS TEKNI PERENCANAAN DAN DESAIN

BAB 4 KONSEP. 4.1 Landasan Teori

PRINSIP-PRINSIP KOMPOSISI. Kesatuan/unity Keselarasan/harmony Keseimbangan/balance Proporsi /Proportion Irama/Rhytm Tekanan/Emphasize

UNIVERSITAS MUHAMADYAH JAKARTA KAIDAH IMK TEKNIK INFORMATIKA IV

BAB III LANDASAN TEORI

tahap transisi antara masa kanak-kanak dan dewasa. Batasan usia remaja menurut WHO adalah 12 sampai 24 tahun. Menurut Menteri Kesehatan RI

Tipografi Aplikatif PENGENALAN HURUF. Ir. Kamil Rusdi Abdullah, M.Si. Modul ke: 01Fakultas FAKULTAS DESAIN DAN SENI KREATIF

File yang berisi informasi sebuah typeface di komputer diberi istilah font

BAB 4 KONSEP DESAIN. 4.1 Landasan Teori/Metode

BAB 5 HASIL DAN PEMBAHASAN DESAIN

APLIKASI WEB DAY 3. (Cascading Style Sheets)

BAB III STRATEGI PERANCANGAN DAN KONSEP VISUAL. disampaikan dapat tepat kepada sasaran, dimana tahapannya dan tujuannya

BAB V KESIMPULAN DAN SARAN

BAB 4 KONSEP DESAIN. dengan huruf dan jenis huruf (typeface). Fungsi dari huruf selain untuk

BAB III TEORI PENUNJANG

BAB 4 KONSEP DESAIN 4.1 Definisi Buku Buku 4.2 Definisi Publikasi 4.3 Landasan Teori Teori Layout Grid Systems

BAB II LANDASAN TEORI. Dalam buku Aplikasi Desain Grafis untuk Periklanan (Suyanto, 2004:5-8), tersebut. Ada empat macam tujuan dari iklan, yaitu:

Program Study. Sistem Informasi. Mata Kuliah DESAIN WEB. STMIK PalComTech

DAFTAR ISI. DAFTAR ISI... iii. DAFTAR GAMBAR... iv. DAFTAR TABEL... v. DAFTAR GRAFIK... vi. ABSTRAK... i BAB I PENDAHULUAN... 1

BAB III. LAPORAN KERJA PRAKTEK 3.1 Peranan Penulis Dalam Perusahaan

4.2. Strategi Kreatif Keywords 1. Fresh Cimory merupakan produk yang memiliki kualitas dengan kesegaran alami. Produk Cimory merupakan produk y

Elemen Elemen Desain Grafis

KONSEP BAB Landasan Teori Logo. Logo adalah suatu simbol atau desain yang mewakili atau

Gambar Grid 1200 px

BAB IV IMPLEMENTASI DAN EVALUASI. aplikasi yang telah dibuat sebelumnya, sehingga diharapkan dengan adanya

Oleh: Dr. Kasiyan, M.Hum. Jurusan Pendidikan Seni Rupa Fakultas Bahasa dan Seni Universitas Negeri Yogyakarta 2013

BAB 4 KONSEP DESAIN. Dalam buku New Book Design karya Roger-Fawcett Tang faktor yang harus diperhatikan dalam pembuatan desain buku adalah :

`BAB IV MATERI KERJA PRAKTIK

IV KONSEP PERANCANGAN

BAB II LANDASAN TEORI. Definisi multimedia menurut Suyanto (2003:82) dalam bukunya. Multimedia Alat Untuk Meningkatkan Keunggulan Bersaing, Multimedia

BAB IV KONSEP DESIGN

DESAIN GRAFIS. Salah satu kriteria penting dari sebuah antar muka adalah tampilan yang menarik.

PENGARUH WARNA, TIPOGRAFI, DAN LAYOUT PADA DESAIN SITUS

NIRMANA DUA DIMENSI. Oleh: Dr. Kasiyan, M.Hum. Jurusan Pendidikan Seni Rupa Fakultas Bahasa dan Seni Universitas Negeri Yogyakarta 2013

BAB II LANDASAN TEORI. untuk melakukan pekerjaan antara lain, yaitu: terutama gambar logo dua dimensi.

WARNA PERSIAPAN GRAFIKA GRAPHIC DESIGN

Transkripsi:

Pokok Bahasan Konsep Dasar Desain Web Konsep Pewarnaan Tipografi Layout

Konsep Dasar Desain Web Konsep Keseimbangan Merupakan hasil susunan satu atau lebih elemen dari desain yang sama antara yang satu dengan lainnya Ada dua jenis keseimbangan, yaitu : Keseimbangan Simetris (Formal) Keseimbangan yang meiliki elemen elemen dengan bobot yang sama pada dua sisi dari garis vertikal imajiner pada halaman, hal inimemberikan kesan kestabilan dan ketetapan Keseimbangan simetris menghasilkan design yang formal. Cocok diterapkan pada aplikasi perkantoran, iklan yang menekankan pada mutu dan kualitas

Konsep Dasar Desain Web (2) Gambaran konsep dasar keseimbangan simetris

Konsep Dasar Desain Web (3) Keseimbangan Asimetris (Nonformal) Kebanyakan dijumpai pada ketidaksamaan dalam posisi dan intensitanya Untuk membuat sesuatu seimbang dalam konsep asimetris yaitu dengan menambahkan intensitas untuk mengimbangi perubahan posisi Penambahan intensitas dapat dilakukan dengan mengubah ukuran, warna dan objek terdapat kesulitan dalam penggunaannya, karena seorang designer harus merancang taat letak dengan sangat hati hati untuk memastikan bahwa designnya benar benar terlihat seimbang

Konsep Pewarnaan Warna pada tampilan sebuah halaman aplikasi, harus tetap menarik karena berhubungan dengan tema aplikasi, dan efek psikologis juga Tabel aspek psikologis warna :

Konsep Pewarnaan (2)

Konsep Pewarnaan (3)

Konsep Pewarnaan (4) Jenis warna adalah sebagai berikut : Warna primer Warna ini berdiri sendiri, tidak bisa dicampurkan dengan warna lain. Terdiri atas merah, kuning dan biru. Warna sekunder Warna ini dibuat dengan mengkombinasikan dua warna primer. Warna sekunder terdiri atas orange, hijau dan ungu. Warna ini terletak diantara warna primer. Warna tersier Merupakan jenis warna menengah. Warna ini dibuat dengan mengkombinasikan warna primer dengan perbatasan warna sekunder. Terdiri atas kuning hijau, kuning orange, merah orange, merah ungu, biru ungu dan biru hijau. Warna ini terletak diantara warna primer dan sekunder yang digunakan

Konsep Pewarnaan (5) Metode pemilihan warna Metode Warna Beruntun Terdiri atas tiga susunan warna yang letaknya saling bersebelahan dan biasanya ada satu warna yang menonjol (dominan). Metode ini menghasilkan warna lembut yang serasi, misalnya kuning, kuning orange dan kuning atau orange, kuning hijau dan hijau.

Konsep Pewarnaan (6) Metode Warna Berlawanan Terdiri atas dua susunan warna yang letaknya saling bersebrangan contohnya biru dan orange. Metode ini menghasilkan nuansa yang lebih hidup (kontas tinggi).

Konsep Pewarnaan (7) Metode Warna Segi Tiga Sesuai dengan namanya, terdiri atas tiga warna yang letaknya ditentukan dengan bentuk segi tiga. Metode ini menghasilkanwarna serasi, misalkan biru, merah, kuning.

Tipografi Merupakan seni huruf, meliputi pemilihan huruf, penentuan ukuran yang tepat, dimana teks dapat diputus, spasi jarak dan bagaimana teks dapat dengan mudah dibaca Huruf di web dapat dibuat sebagai bagian dari grafik (image) atau HTML atau dengan style sheet. Desainer dapat menentukan pilihan huruf, tapi yang menggunakan html atau style sheet dianjurkan untuk menggunakan huruf yang ada (default)

Tipografi (2) Jenis huruf secara garis besar : Serif Mempunyai stroke (ekor) Berkesan formal, elegan/intelektual, anggun dan konserpatif pada desain Cocok dipakai untuk teks yang panjang dengan jarak spasi yang sedikit Cocok dipakai untuk organisasi, pemerintahan, pendidikan dan perusahaan Huruf serif terbagi menjadi 4 jenis, yaitu : Style (Caslon, Garamond, Goudy, Palatino) Transitional (Baskerville, Century, Time New Roman) Modern (Bodoni) Egyptian (Clarenden, Lubalin, Memphis)

Tipografi (3) Sans-serif Jenis huruf yang tidak memiliki stroke (ekor), ujungnya dapat bentuk tumpul atau tajam. Contoh : Arial Verdana Avant Garde

Tipografi (4) Dekoratif Jenis huruf yang mempunyai desain rumit, sesuatu yang baru, dll. Biasa digunakan untuk judul, banner, dll Contoh : Stencil, crackling, rosewood, dll Skrip Menyerupai tulisan tangan, sering disebut kursif (cursive) Contoh : Brush Script, Larissa, dll Monospace Jenis huruf yang mempunyai jarak dan lebar yang sama untuk setiap hurufnya Contoh : Monospace, Courirer New, dll.

Layout Merupakan proses penataan dan pengaturan teks atau grafik pada halaman Meliputi penyusunan, pembagian tempat dalam suatu halaman, pengaturan jarak spasi, pengelompokan teks dan grafik, serta penekanan pada suatu bagian tertentu Sebelum merancang layout, harus mengetahui jawaban pertanyaan berikut : Di manakah akan diletakkan layout tersebut? Siapa yang akan melihatnya? Hasil apakah yang diperoleh? Bagaimana menempatkan teks dan gambar sehingga memberikan pengaruh yang baik? Akan seperti apakah layout tersebut?

Layout (2) Layout yang baik setidaknya memiliki 3 kriteria dasar : Mencapai tujuan Apakah tujuan yang akan dicapai sebuah halaman web? Informasi apakah yang akan disampaikan? Siapakah yang akan membaca, menggunakan, atau mengunjungi web tersebut Di manakah letak halaman web tersebut terhadap halaman yang lain Pemetaan visual Penataan dan penekanan pada beberapa titik informasi Penentuan item apakah yang akan dibaca atau dilihat oleh pengunjung Menarik perhatian (berbeda dengan yang lain dan memiliki daya tarik tersendiri)

Layout (3) Layout menurut bentuk : Model layout top index Model layout bottom index Model layout left index Model layout right index Model layout split index Model layout alternating index Layout menurut ukuran : Liquid design (satuan yg fleksibel/%) Ice design (satuan yang tetap/fixed) Jelly design (kombinasi satuan fleksibel dan tetap)

Referensi : Jack Febrian, Menggunakan Internet, Penerbit Informatika, 2008 Asep Herman Suyanto, Web Design : Teory and Practices, Penerbit Andi, 2007