SlideShare une entreprise Scribd logo
1  sur  31
Yanuar Rahman
    www.vidiyan.com




            layout

tataletak
tataletak
      definisi
      tujuan
    elemen
    ragam
tataletak

                           apaitu?
  ”usaha menyusun, menata, atau memadukan
 unsur-unsur komunikasi grafis (teks, gambar,
tabel, dll) untuk menjadikan komunikasi visual
        yang komunikatif, estetik dan menarik”

                                sederhananya…
tataletak

       apaitu?
       “penempatan
elemen-elemen grafis
     pada dokumen”
tataletak

                          tujuan
             “menghasilkan media yang
             komunikatif {    } dalam
                          efektif
                          efisien

                menyampaikan pesan”


fungsional
   >=<
  estetis
tataletak

elemen (desain)
              Titik
             Garis
            Bentuk
           Tekstur
             Huruf
            Warna
                Value
               Ukuran
         Ruang Kosong
tataletak

                                         elemen
                                                                  Titik
Titik merupakan bagian terkecil dari garis.
   Dari kombinasi titik-titik dapat diciptakan sebuah elemen grafis yang powerful.
tataletak

                                   elemen
                                                        Garis
Tanda yang menghubungkan satu titik dengan titik yang lain.
                                    (Lurus, kurva, “kurus”, “gemuk”, dsb)
                            Garis dapat digunakan untuk mengatur layout,
                     mengarahkan pembaca dan membawa emosi pembaca.
tataletak

                                  elemen
                                                 Bentuk
Sesuatu yang memiliki tinggi dan lebar (dan kedalaman 3D).
                                         (Geometris, natural & abstrak)
                Dengan bentuk pembaca dibantu mengenali sebuah objek,
           mengkomunikasikan ide dan menambah daya tarik sebuah layout.
tataletak

elemen
         Tekstur
Tampilan/ perasaan
sebuah permukaan.
   Tekstur menambah dimensi dan
          kekayaan sebuah layout,
 menegaskan kedalam sebuah rasa/
                  emosi tertentu.
tataletak

            elemen
                                Huruf
          Unsur dalam sistem tulisan
         yang dikaitkan dengan bunyi.

Huruf dapat menyampaikan maksud secara eksplisit.
         Bisa berperan sebagai isi sekaligus wadah.
tataletak

 elemen
                Warna
Pantulan cahaya yang dipengaruhi
  oleh pigmen permukaan benda.

    Warna membawa suasana tertentu,
                    menarik perhatian,
                  menegaskan sesuatu
    dan mengatur elemen dalam layout.
tataletak

elemen
                   Value
Seberapa gelap atau
terang sebuah area.
       Value memberikan suasana
    dan membuat ilusi kedalaman.
tataletak

                        elemen
                                            Ukuran
Seberapa besar atau kecil sesuatu.
 Ukuran menunjukkan elemen yang terpenting, menarik perhatian
                      dan mengepaskan seluruh elemen layout.
tataletak

                                   elemen
                                        Ruang Kosong
Jarak atau area antara atau disekitar sesuatu.
           Ruang kosong memisahkan/ menyatukan elemen-elemen layout,
        menegaskan sebuah elemen, atau sebagai tempat istirahat bagi mata.
tataletak

contoh ragam
tataletak

contoh ragam
cetak elektronik
      buku
   majalah
     koran    sama dengan cetak
  kalendar
   katalog
              + interface
    poster    & interaktivitas
   banner
    brosur
 undangan
  formulir
        dll
tataletak

contoh ragam
           buku
tataletak

contoh ragam
        E-buku
tataletak

contoh ragam
        majalah
tataletak

contoh ragam
       E-majalah
tataletak

contoh ragam
          koran
tataletak

contoh ragam
        E-koran
tataletak

contoh ragam
        kalendar
tataletak

contoh ragam
         poster
tataletak

contoh ragam
         brosur
tataletak

contoh ragam
       undangan
tataletak

contoh ragam
    undangan online
       lihat contohnya disini
tataletak

contoh ragam
        formulir
tataletak

contoh ragam
       E-formulir
Yanuar Rahman
               www.vidiyan.com




     Referensi diambil dari berbagai sumber;
   hak cipta gambar, grafis dan elemen visual
   melekat pada pembuatnya masing-masing.

    Terima Kasih banyak buat Megan Fox :P




terimakasih

Contenu connexe

Tendances (20)

Dasar dasar coreldraw 1
Dasar dasar coreldraw 1Dasar dasar coreldraw 1
Dasar dasar coreldraw 1
 
PRINSIP DASAR LAYOUT
PRINSIP DASAR LAYOUTPRINSIP DASAR LAYOUT
PRINSIP DASAR LAYOUT
 
Elemen images dalam multimedia
Elemen images dalam multimediaElemen images dalam multimedia
Elemen images dalam multimedia
 
Pengenalan corel-draw
Pengenalan corel-drawPengenalan corel-draw
Pengenalan corel-draw
 
Graphic design by mprabuw
Graphic design by mprabuwGraphic design by mprabuw
Graphic design by mprabuw
 
LAYOUT DASAR -Dalam majalah/poster
LAYOUT DASAR -Dalam majalah/posterLAYOUT DASAR -Dalam majalah/poster
LAYOUT DASAR -Dalam majalah/poster
 
Presentasi desain grafis
Presentasi desain grafisPresentasi desain grafis
Presentasi desain grafis
 
20731 21 visualisasi data
20731 21 visualisasi data20731 21 visualisasi data
20731 21 visualisasi data
 
Ppt unsur tata letak
Ppt unsur tata letakPpt unsur tata letak
Ppt unsur tata letak
 
Visualisasi informasi
Visualisasi informasiVisualisasi informasi
Visualisasi informasi
 
DESAIN GRAFIS
DESAIN GRAFIS DESAIN GRAFIS
DESAIN GRAFIS
 
Desain grafis
Desain grafisDesain grafis
Desain grafis
 
Materi Pelatihan Dasar infografis
Materi Pelatihan Dasar infografisMateri Pelatihan Dasar infografis
Materi Pelatihan Dasar infografis
 
ATP KONSENTRASI DKV.doc
ATP KONSENTRASI DKV.docATP KONSENTRASI DKV.doc
ATP KONSENTRASI DKV.doc
 
2. Prinsip desain grafis.pptx
2. Prinsip desain grafis.pptx2. Prinsip desain grafis.pptx
2. Prinsip desain grafis.pptx
 
story board.ppt
story board.pptstory board.ppt
story board.ppt
 
Pengantar komunikasi visual
Pengantar komunikasi visualPengantar komunikasi visual
Pengantar komunikasi visual
 
Desain Grafis Percetakan menerapkan penggabungan gambar dan teks berbasi vektor
Desain Grafis Percetakan menerapkan penggabungan gambar dan teks berbasi vektorDesain Grafis Percetakan menerapkan penggabungan gambar dan teks berbasi vektor
Desain Grafis Percetakan menerapkan penggabungan gambar dan teks berbasi vektor
 
berbagai jenis layout
berbagai jenis layoutberbagai jenis layout
berbagai jenis layout
 
Konsep dasar UI/UX
Konsep dasar UI/UXKonsep dasar UI/UX
Konsep dasar UI/UX
 

Similaire à Tata Letak (layout) - Elemen Desain

Design Basic + Basic UI Design Tips for KMI ITS
Design Basic + Basic UI Design Tips for KMI ITSDesign Basic + Basic UI Design Tips for KMI ITS
Design Basic + Basic UI Design Tips for KMI ITSDeden Fathurrahman
 
Kelompok 5_Tekstur dan Gambar.pdf
Kelompok 5_Tekstur dan Gambar.pdfKelompok 5_Tekstur dan Gambar.pdf
Kelompok 5_Tekstur dan Gambar.pdfHanif510617
 
The Principles Of Design Presentation (1).pptx
The Principles Of Design Presentation (1).pptxThe Principles Of Design Presentation (1).pptx
The Principles Of Design Presentation (1).pptxAqomaInamorta
 
Introduction to Graphic Design
Introduction to Graphic DesignIntroduction to Graphic Design
Introduction to Graphic DesignAditya Sasongko
 
Materi pengolahan citra
Materi pengolahan citraMateri pengolahan citra
Materi pengolahan citraBunda Dewi
 
Desain pemodelan grafik - Tugas 1
Desain pemodelan grafik - Tugas 1Desain pemodelan grafik - Tugas 1
Desain pemodelan grafik - Tugas 1Bayu Radityo
 
Elemen Dasar Desain X TKI SMK YPN Belinyu
Elemen Dasar Desain X TKI SMK YPN BelinyuElemen Dasar Desain X TKI SMK YPN Belinyu
Elemen Dasar Desain X TKI SMK YPN BelinyuMariyana
 
The Principles of Design.pptx
The Principles of Design.pptxThe Principles of Design.pptx
The Principles of Design.pptxFajarSidikS
 
Slide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptxSlide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptxToharismala
 
Slide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptxSlide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptx26FM
 
Slide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptxSlide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptxAgusNugroho63
 
KONSEP ASAS GRAFIK MENGHASIL BAHAN GRAFIK YANG BAIK
KONSEP ASAS GRAFIKMENGHASIL BAHAN GRAFIK YANG BAIKKONSEP ASAS GRAFIKMENGHASIL BAHAN GRAFIK YANG BAIK
KONSEP ASAS GRAFIK MENGHASIL BAHAN GRAFIK YANG BAIKSteven Abraham
 
Slide pengajaran asas grafik
Slide pengajaran asas grafikSlide pengajaran asas grafik
Slide pengajaran asas grafikFathdzelly Jaya
 
Prinsip desaine grafis dasar berdasarkan
Prinsip desaine grafis dasar berdasarkanPrinsip desaine grafis dasar berdasarkan
Prinsip desaine grafis dasar berdasarkanNandaDwikyMuftiYunia
 
Prinsip dan Elemen Dasar dalam Desain Grafis
Prinsip dan Elemen Dasar dalam Desain GrafisPrinsip dan Elemen Dasar dalam Desain Grafis
Prinsip dan Elemen Dasar dalam Desain GrafisBambang Herlandi
 

Similaire à Tata Letak (layout) - Elemen Desain (20)

Design Basic + Basic UI Design Tips for KMI ITS
Design Basic + Basic UI Design Tips for KMI ITSDesign Basic + Basic UI Design Tips for KMI ITS
Design Basic + Basic UI Design Tips for KMI ITS
 
Kelompok 5_Tekstur dan Gambar.pdf
Kelompok 5_Tekstur dan Gambar.pdfKelompok 5_Tekstur dan Gambar.pdf
Kelompok 5_Tekstur dan Gambar.pdf
 
The Principles Of Design Presentation (1).pptx
The Principles Of Design Presentation (1).pptxThe Principles Of Design Presentation (1).pptx
The Principles Of Design Presentation (1).pptx
 
Introduction to Graphic Design
Introduction to Graphic DesignIntroduction to Graphic Design
Introduction to Graphic Design
 
Materi pengolahan citra
Materi pengolahan citraMateri pengolahan citra
Materi pengolahan citra
 
Seni rupa grafis
Seni rupa grafisSeni rupa grafis
Seni rupa grafis
 
Desain pemodelan grafik - Tugas 1
Desain pemodelan grafik - Tugas 1Desain pemodelan grafik - Tugas 1
Desain pemodelan grafik - Tugas 1
 
Elemen Dasar Desain X TKI SMK YPN Belinyu
Elemen Dasar Desain X TKI SMK YPN BelinyuElemen Dasar Desain X TKI SMK YPN Belinyu
Elemen Dasar Desain X TKI SMK YPN Belinyu
 
The Principles of Design.pptx
The Principles of Design.pptxThe Principles of Design.pptx
The Principles of Design.pptx
 
Tik
TikTik
Tik
 
Slide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptxSlide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptx
 
Slide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptxSlide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptx
 
Slide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptxSlide_presentasi_desain_grafis_kd.pptx
Slide_presentasi_desain_grafis_kd.pptx
 
14198589.ppt
14198589.ppt14198589.ppt
14198589.ppt
 
KONSEP ASAS GRAFIK MENGHASIL BAHAN GRAFIK YANG BAIK
KONSEP ASAS GRAFIKMENGHASIL BAHAN GRAFIK YANG BAIKKONSEP ASAS GRAFIKMENGHASIL BAHAN GRAFIK YANG BAIK
KONSEP ASAS GRAFIK MENGHASIL BAHAN GRAFIK YANG BAIK
 
Slide pengajaran asas grafik
Slide pengajaran asas grafikSlide pengajaran asas grafik
Slide pengajaran asas grafik
 
Media Visual
Media VisualMedia Visual
Media Visual
 
Media pembelajaran
Media pembelajaranMedia pembelajaran
Media pembelajaran
 
Prinsip desaine grafis dasar berdasarkan
Prinsip desaine grafis dasar berdasarkanPrinsip desaine grafis dasar berdasarkan
Prinsip desaine grafis dasar berdasarkan
 
Prinsip dan Elemen Dasar dalam Desain Grafis
Prinsip dan Elemen Dasar dalam Desain GrafisPrinsip dan Elemen Dasar dalam Desain Grafis
Prinsip dan Elemen Dasar dalam Desain Grafis
 

Plus de Yanuar Rahman

Portfolio 2015 - 2016 - Yanuar
Portfolio 2015 - 2016 - YanuarPortfolio 2015 - 2016 - Yanuar
Portfolio 2015 - 2016 - YanuarYanuar Rahman
 
Kreasi Kertas - Membuat Kura-Kura
Kreasi Kertas - Membuat Kura-KuraKreasi Kertas - Membuat Kura-Kura
Kreasi Kertas - Membuat Kura-KuraYanuar Rahman
 
Worksheets - familia kreativa - Mengenal Fauna
Worksheets - familia kreativa - Mengenal FaunaWorksheets - familia kreativa - Mengenal Fauna
Worksheets - familia kreativa - Mengenal FaunaYanuar Rahman
 
Tips Menggambar ala DRAWING MAMA
Tips Menggambar ala DRAWING MAMATips Menggambar ala DRAWING MAMA
Tips Menggambar ala DRAWING MAMAYanuar Rahman
 
Graphics Standard Manual - Lak Lik
Graphics Standard Manual - Lak LikGraphics Standard Manual - Lak Lik
Graphics Standard Manual - Lak LikYanuar Rahman
 
Graphics Standard Manual - Catfish
Graphics Standard Manual - CatfishGraphics Standard Manual - Catfish
Graphics Standard Manual - CatfishYanuar Rahman
 
Graphics Standard Manual - Tinut
Graphics Standard Manual - TinutGraphics Standard Manual - Tinut
Graphics Standard Manual - TinutYanuar Rahman
 
15 koleksi undangan pernikahan kartun (vol 6)
15 koleksi undangan pernikahan kartun (vol 6)15 koleksi undangan pernikahan kartun (vol 6)
15 koleksi undangan pernikahan kartun (vol 6)Yanuar Rahman
 
Logo Pernikahan - Monogram
Logo Pernikahan - MonogramLogo Pernikahan - Monogram
Logo Pernikahan - MonogramYanuar Rahman
 
Tips Mewujudkan Legenda Pribadi
Tips Mewujudkan Legenda PribadiTips Mewujudkan Legenda Pribadi
Tips Mewujudkan Legenda PribadiYanuar Rahman
 
Gestalt Theory (Bahasa)
Gestalt Theory (Bahasa)Gestalt Theory (Bahasa)
Gestalt Theory (Bahasa)Yanuar Rahman
 
15 koleksi undangan pernikahan kartun (vol 5)
15 koleksi undangan pernikahan kartun (vol 5)15 koleksi undangan pernikahan kartun (vol 5)
15 koleksi undangan pernikahan kartun (vol 5)Yanuar Rahman
 
Multimedia Interaktif
Multimedia InteraktifMultimedia Interaktif
Multimedia InteraktifYanuar Rahman
 
Brand Innovation and Activation
Brand Innovation and ActivationBrand Innovation and Activation
Brand Innovation and ActivationYanuar Rahman
 

Plus de Yanuar Rahman (20)

Identitas Visual
Identitas VisualIdentitas Visual
Identitas Visual
 
Portfolio 2015 - 2016 - Yanuar
Portfolio 2015 - 2016 - YanuarPortfolio 2015 - 2016 - Yanuar
Portfolio 2015 - 2016 - Yanuar
 
Kreasi Kertas - Membuat Kura-Kura
Kreasi Kertas - Membuat Kura-KuraKreasi Kertas - Membuat Kura-Kura
Kreasi Kertas - Membuat Kura-Kura
 
Worksheets - familia kreativa - Mengenal Fauna
Worksheets - familia kreativa - Mengenal FaunaWorksheets - familia kreativa - Mengenal Fauna
Worksheets - familia kreativa - Mengenal Fauna
 
Tips Menggambar ala DRAWING MAMA
Tips Menggambar ala DRAWING MAMATips Menggambar ala DRAWING MAMA
Tips Menggambar ala DRAWING MAMA
 
Menjadi Pemimpin
Menjadi PemimpinMenjadi Pemimpin
Menjadi Pemimpin
 
Sinematografi
SinematografiSinematografi
Sinematografi
 
Graphics Standard Manual - Lak Lik
Graphics Standard Manual - Lak LikGraphics Standard Manual - Lak Lik
Graphics Standard Manual - Lak Lik
 
Graphics Standard Manual - Catfish
Graphics Standard Manual - CatfishGraphics Standard Manual - Catfish
Graphics Standard Manual - Catfish
 
Graphics Standard Manual - Tinut
Graphics Standard Manual - TinutGraphics Standard Manual - Tinut
Graphics Standard Manual - Tinut
 
Prinsip Desain
Prinsip DesainPrinsip Desain
Prinsip Desain
 
15 koleksi undangan pernikahan kartun (vol 6)
15 koleksi undangan pernikahan kartun (vol 6)15 koleksi undangan pernikahan kartun (vol 6)
15 koleksi undangan pernikahan kartun (vol 6)
 
Logo Pernikahan - Monogram
Logo Pernikahan - MonogramLogo Pernikahan - Monogram
Logo Pernikahan - Monogram
 
Tips Mewujudkan Legenda Pribadi
Tips Mewujudkan Legenda PribadiTips Mewujudkan Legenda Pribadi
Tips Mewujudkan Legenda Pribadi
 
Trend undangan 2012
Trend undangan 2012Trend undangan 2012
Trend undangan 2012
 
Gestalt Theory (Bahasa)
Gestalt Theory (Bahasa)Gestalt Theory (Bahasa)
Gestalt Theory (Bahasa)
 
15 koleksi undangan pernikahan kartun (vol 5)
15 koleksi undangan pernikahan kartun (vol 5)15 koleksi undangan pernikahan kartun (vol 5)
15 koleksi undangan pernikahan kartun (vol 5)
 
Multimedia Interaktif
Multimedia InteraktifMultimedia Interaktif
Multimedia Interaktif
 
Strategi Kreatif
Strategi KreatifStrategi Kreatif
Strategi Kreatif
 
Brand Innovation and Activation
Brand Innovation and ActivationBrand Innovation and Activation
Brand Innovation and Activation
 

Tata Letak (layout) - Elemen Desain

  • 1. Yanuar Rahman www.vidiyan.com layout tataletak
  • 2. tataletak definisi tujuan elemen ragam
  • 3. tataletak apaitu? ”usaha menyusun, menata, atau memadukan unsur-unsur komunikasi grafis (teks, gambar, tabel, dll) untuk menjadikan komunikasi visual yang komunikatif, estetik dan menarik” sederhananya…
  • 4. tataletak apaitu? “penempatan elemen-elemen grafis pada dokumen”
  • 5. tataletak tujuan “menghasilkan media yang komunikatif { } dalam efektif efisien menyampaikan pesan” fungsional >=< estetis
  • 6. tataletak elemen (desain) Titik Garis Bentuk Tekstur Huruf Warna Value Ukuran Ruang Kosong
  • 7. tataletak elemen Titik Titik merupakan bagian terkecil dari garis. Dari kombinasi titik-titik dapat diciptakan sebuah elemen grafis yang powerful.
  • 8. tataletak elemen Garis Tanda yang menghubungkan satu titik dengan titik yang lain. (Lurus, kurva, “kurus”, “gemuk”, dsb) Garis dapat digunakan untuk mengatur layout, mengarahkan pembaca dan membawa emosi pembaca.
  • 9. tataletak elemen Bentuk Sesuatu yang memiliki tinggi dan lebar (dan kedalaman 3D). (Geometris, natural & abstrak) Dengan bentuk pembaca dibantu mengenali sebuah objek, mengkomunikasikan ide dan menambah daya tarik sebuah layout.
  • 10. tataletak elemen Tekstur Tampilan/ perasaan sebuah permukaan. Tekstur menambah dimensi dan kekayaan sebuah layout, menegaskan kedalam sebuah rasa/ emosi tertentu.
  • 11. tataletak elemen Huruf Unsur dalam sistem tulisan yang dikaitkan dengan bunyi. Huruf dapat menyampaikan maksud secara eksplisit. Bisa berperan sebagai isi sekaligus wadah.
  • 12. tataletak elemen Warna Pantulan cahaya yang dipengaruhi oleh pigmen permukaan benda. Warna membawa suasana tertentu, menarik perhatian, menegaskan sesuatu dan mengatur elemen dalam layout.
  • 13. tataletak elemen Value Seberapa gelap atau terang sebuah area. Value memberikan suasana dan membuat ilusi kedalaman.
  • 14. tataletak elemen Ukuran Seberapa besar atau kecil sesuatu. Ukuran menunjukkan elemen yang terpenting, menarik perhatian dan mengepaskan seluruh elemen layout.
  • 15. tataletak elemen Ruang Kosong Jarak atau area antara atau disekitar sesuatu. Ruang kosong memisahkan/ menyatukan elemen-elemen layout, menegaskan sebuah elemen, atau sebagai tempat istirahat bagi mata.
  • 17. tataletak contoh ragam cetak elektronik buku majalah koran sama dengan cetak kalendar katalog + interface poster & interaktivitas banner brosur undangan formulir dll
  • 28. tataletak contoh ragam undangan online lihat contohnya disini
  • 31. Yanuar Rahman www.vidiyan.com Referensi diambil dari berbagai sumber; hak cipta gambar, grafis dan elemen visual melekat pada pembuatnya masing-masing. Terima Kasih banyak buat Megan Fox :P terimakasih