Human-Computer Interaction User Interface Design

Layout [2]

Topik bahasan:

  1. Alignment
  2. Grid

Penjelasan Layout 2 dalam bentuk video dapat diakses pada:


WHITESPACE

Space sangat penting menciptakan hubungan yang membentuk sistem hirarki pada sebuah layout. Menciptakan sebuah sistem desain hampir selalu dimulai dengan pengaturan ruang yang jelas. Whitespace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong, atau ruang kosong pada sebuah halaman.

Meskipun disebut whitespace, bukan berarti ruang tersebut harus berwarna putih. Ruang kosong ini dapat diisi dengan warna apapun asalkan bebas dari elemen apapun seperti teks dan gambar. Contoh penggunaan whitespace yang baik yang kita semua kenal yaitu Google. Homepage Google diisi dengan whitespace sehingga kita fokus pada hal yang penting: pencarian.

Homepage website Google.com

Perhatikan kedua layout di bawah ini.

Perbandingan penggunaan whitespace

Whitespace juga penting untuk membuat layout yang dapat di-scan dengan mudah. Scanning informasi adalah aspek penting pada desain web. Layout dengan whitespace yang dikelola dengan baik memungkinkan user untuk scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.

Layout yang berantakan, atau yang tidak mengatur whitespace secara efektif, menyulitkan user untuk mengidentifikasi pola yang penting untuk men-scan informasi. Bayangkan sekelompok orang yang berkeliaran di sebuah pesta versus barisan prajurit saat absen. Orang-orangnya mungkin sama, tetapi ruang diantara mereka telah diatur sedemikian rupa sehingga tampak teratur.

Beberapa website di bawah ini menunjukkan contoh penggunaan whitespace yang baik dalam layout-nya.

Website Chanel
Website Built by Buffalo
Website Dropbox
Website Apple

Beberapa Case Penggunaan Whitespace

1. Dialogbox yang Padat

Ketika berbicara tentang whitespace pada sebuah layout, maka jangan membuat kontrol dalam satu desain menjadi penuh sesak, bahkan jika Anda mengelompokkan kontrol tersebut. Susunan kontrol yang penuh sesak akan menghambat proses scan informasi, dan menghasilkan efek yang menggunggu ketika dua baris (seperti tepi text field) terlalu dekat.

Gambar di atas adalah contoh dialog box yang penuh sesak, karena:

  • Dialog tidak memiliki margin di tepinya; kontrol-kontrol dikemas sangat rapat; dan garis digunakan untuk pengelompokan; yang seharusnya penggunaan whitespace lebih tepat.
  • Obyek yang penuh sesak ini menyebabkan efek persepsi yang buruk:
    • Garis yang muncul terlalu berdekatan.
    • Seharusnya beberapa pixel whitespace di antara baris akan menghilangkan masalah ini.

2. Menggunakan Whitespace untuk Mengatur Label

Contoh penggunaan whitespace untuk mengatur label sebuah dialog box. Penggunaan whitespace yang efektif adalah menempatkan label di margin kiri di mana whitespace meng-highlight label.

Pada Dialog box (a), Anda tidak dapat men-scan label dan nama grup secara terpisah; mereka saling mengganggu seperti halnya garis-garis pengelompokan.

Gambar Dialog Box (a)

Pada Dialog Box (b) yang didesain ulang, label sekarang disusun sendirian di sebelah kiri, membuatnya lebih mudah di-scan. Ketika penggunaan space dimungkinkan, Anda harus meletakkan label di sebelah kiri kontrol, bukan di atas.

Gambar Dialog Box (b)

3. Whitespace Menghindari Visual Noise

Visual noise pada grafik dapat dikurangi dengan menghilangkan beberapa garis batas seperti pada gambar bagian kanan di atas. Namun, fitur ini tidak terdapat pada Microsoft Excel yang biasa digunakan untuk membuat grafik.


4. Balance & Symmetry

Balance (keseimbangan) dan simetri adalah tool berharga pada toolkit seorang desainer. Dalam desain grafis, yang dimaksud dengan simetri adalah sejumlah komponen yang sama di setiap sisi sumbu. Kita mengukur komponen tersebut dengan massa (jumlah piksel non-white) dan luas (area yang dicakup oleh piksel tersebut); massa dan luasnya harus seimbang.

Cara mudah untuk mencapai keseimbangan adalah dengan membuat elemen-elemen desain di bagian tengah (di pusat tengah). Hal ini secara otomatis mencapai keseimbangan di sekitar sumbu vertikal. Jika Anda melihat homepage Google, Anda akan melihat jenis pendekatan tersebut.

Google

Secara singkat, langkah membuat keseimbangan dalam sebuah dengan adalah:

  • Pilih sebuah sumbu (biasanya vertikal).
  • Distribusikan elemen secara merata di sekitar sumbu
  • Seimbangkan massa dan luasnya.


ALIGNMENT & GRID SYSTEM

Alignment

Mari perhatikan contoh gambar di bawah ini dengan melihat pada aligment kontrol-kontrol di dalamnya.

Alignment berkontribusi pada Simplicity sebuah desain. Posisi alignment yang lebih sedikit berarti desain yang lebih sederhana. Dialog box pada halaman di atas menampilkan alignment yang benar-benar serampangan/ tidak teratur, yang membuatnya tampak rumit. Sederhanakan desain Anda dengan menyelaraskan elemen-elemen secara horizontal dan vertikal.

Pengaturan Label (misalnya “Wait” dan “Retry after”):

  • Label panjang dan label pendek digunakan pada layar yang sama.
  • Anda akan mendapatkan hasil terbaik jika Anda membuat semua label dengan ukuran yang sama, atau memecah label panjang menjadi beberapa baris.

Pengaturan Kontrol (misalnya text field, combobox, checkbox):

  • Kolom kontrol harus disejajarkan di kiri dan kanan.
  • Terkadang hal ini tampak tidak masuk akal – haruskah misalnya field “short date” dilebarkan agar ukurannya sama dengan lebar field “filename” pada sebuah desain?
  • Tidak ada salahnya field tanggal menjadi lebih lebar dari yang diperlukan kecuali mungkin mengurangi persepsi Affordance untuk tanggal.
  • Anda juga dapat menyelesaikan masalah seperti ini dengan mengatur ulang tampilan dengan memindahkan field tanggal ke tempat lain, meskipun harus hati-hati agar tidak mengganggu pengelompokan fungsional pada desain Anda atau mengganggu ekspektasi user Anda.

Anda dapat melihat perbedaan layout Advanced Search pada Google.

Interface Lama untuk Advanced Search pada Website Google

Pada desain yang baru di bawah ini, terlihat keteraturan penggunaan label, kontrol-kontrol dan teks berisi keterangan di sebelah kanan. Hal ini lebih memudahkan user dalam pemilihan dan pengisian tiap kontrol yang disediakan.

Interface Baru untuk Advanced Search pada Website Google

Anatomi Halaman Website

Sebelum melangkah lebih jauh membahas Sistem Grid, mari terlebih dahulu meninjau kembali tentang anatomi halaman website, agar dapat lebih cepat dalam memahami Sistem Grid nantinya.

Secara umum, sebuah halaman website terdiri dari:

  1. Header
  2. Navigation
  3. Feature
  4. Body/Content
  5. Sidebar
  6. Footer
  7. Background

HEADER

Header pada halaman web bertindak sebagai landasan bagi user dengan mengidentifikasi dan secara visual menyatukan sebuah halaman web. Header menetapkan look & feel dari brand sebuah website dan sering kali akan memberi user sebuah call to action – search, buy, register, dll. Header sering berisi navigasi utama sebuah website. Karena navigasi sangat penting untuk Usability sebuah web, maka logis bahwa navigasi ditempatkan secara jelas di bagian atas.

Bagian Header
Header pada Website HOOQ
Header pada Website Michigan University

FEATURE AREA

Salah satu indikasi desain yang efektif adalah hirarki informasi yang didefinisikan dengan jelas. Untuk mencapai hal ini, desainer menggunakan titik fokus, yang dalam desain web sering merupakan feature area utama. Area ini biasanya memakan sebagian besar homepage, memiliki warna dan tipografi paling cerah, dan biasanya menampilkan semacam motion atau animasi. Opsi paling umum untuk feature area adalah slideshow gambar-gambar dan konten dari web.

Bagian Feature Area
Feature Area pada Website Kyoto University

BODY/ CONTENT

Body atau isi web adalah tempat user menghabiskan sebagian besar waktu mereka, karena bisanya merupakan akhir pencarian mereka untuk sebuah konten. Pada area inilah konsep desain Legibility (keterbacaan) dan Clarity (kejelasan) ikut bermain, tetapi dengan beberapa pertimbangan tambahan. Sebuah halaman web tingginya tidak terbatas, sehingga penting untuk memecah konten panjang dengan whitespace dan subheading. Mode “break”/ istirahat dalam konten ini memungkinkan user untuk membaca halaman dengan cepat dan memberi beberapa entry point ke dalam konten.

Bagian Body/ Content
Content pada Website University of Michigan
Content pada Website Tilburg University

SIDEBAR

Sidebar pada halaman web berisi informasi sekunder yang mendukung konten utama atau mengarahkan user ke konten terkait melalui penggunaan submenu dan link. Area sidebar sering kali dijual untuk ruang iklan. Seperti halnya header, desain sidebar harus menyatu dengan tampilan web untuk membantu menciptakan kesan menyeluruh pada halaman web.

Bagian Sidebar
Sidebar pada Website Kyoto University

FOOTER

Pada masa awal desain web, footer berisi informasi hak cipta web serta beberapa link. Seiring waktu, footer halaman web telah berkembang menjadi sitemap mini, dengan link ke masing-masing halaman utama web.

Bagian Footer
Footer pada Website University of Nebraska-Lincoln

BACKGROUND

Background halaman web digunakan untuk melengkapi konten sebuah halaman. Background dapat digunakan untuk membuat kedalaman atau dimensi, menambahkan kekayaan dengan tekstur dan warna pada sebuah halaman, atau bahkan memperluas konten di luar batas halaman.

Bagian Background
Background Gambar pada Website University of Nebraska-Lincoln

Sistem Grid

Salah satu cara tertua untuk menciptakan keseimbangan adalah dengan penggunaan sistem grid. Grid tidak hanya mengatur elemen-elemen desain, tetapi juga mengatur ruang (space) dalam suatu desain. Menyelaraskan elemen desain dengan jelas melalui penggunaan kolom yang menciptakan ruang dan ruang inilah yang memberikan pengaturan tampilan. Setelah sistem grid ditetapkan, elemen desain ditempatkan dalam grid. Obyek dapat menjangkau lebih dari satu lebar kolom, tetapi setiap elemen yang memiliki hubungan yang jelas dengan grid itu sendiri.

Sistem grid dapat digunakan untuk mendefinisikan variabel-variabel berikut:

  • Lebar margin
  • Proporsi area pada sebuah halaman
  • Jumlah dan ukuran kolom
  • Posisi gambar
  • Heading
  • Body text
  • Penempatan nomor halaman dan footnote.

Alasan Menggunakan Grid

Manfaat menggunakan grid adalah

  • Bahwa grid dapat menciptakan kontinuitas (Continuity) pada urutan halaman.
  • Terkait kecepatan; grid adalah alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat.
  • Dalam hal komposisi single-page, grid dapat membantu desainer menciptakan harmonisasi visual dan secara estetika menghubungkan beragam komposisi elemen.

Grid tidak hanya menjadi alat berharga bagi desainer, tetapi juga berguna bagi pembaca web. Dalam dokumen sekuensial (berurutan), penggunaan sistem organisasi memungkinkan pembaca untuk menelusuri konten dengan mudah. Hal ini terutama berlaku untuk layout yang mengandung kombinasi elemen visual yang kompleks.


Elemen Grid

Terdapat beberapa elemen pada grid, yaitu:

  1. Columns
  2. Modules
  3. Margins
  4. Spatial zones
  5. Flowlines
  6. Markers

Gambaran elemen grid dapat dilihat pada gambar di bawah ini.

Penjelasan elemeen-elemen grid

1. Columns
Kolom adalah wadah vertikal yang menampung teks atau gambar. Lebar dan jumlah kolom pada halaman atau layar dapat bervariasi, tergantung pada konten.

2. Modules
Modul adalah area individual yang dipisahkan oleh ruang yang konsisten, menyediakan grid yang berulang dan teratur. Menggabungkan modul dapat membuat kolom dan baris dengan berbagai ukuran.

3. Margins
Margin adalah zona penyangga. Margin mewakili jumlah ruang antara ukuran tepi halaman, termasuk gutter (space antara tepi halaman dengan konten) dan konten halaman. Margin juga dapat menampung informasi sekunder, seperti catatan dan caption (keterangan).

4. Spatial Zones
Zona spasial adalah kelompok modul atau kolom yang dapat membentuk area spesifik untuk teks, iklan, gambar atau informasi lainnya.

5. Flowlines
Flowlines adalah alignment yang memecah ruang menjadi pita horizontal. Flowline bukan garis nyata. Flowline adalah metode untuk menggunakan ruang dan elemen untuk memandu pembaca melintasi halaman.

6. Markers
Marker membantu pembaca menavigasi dokumen. Mengindikasikan penempatan untuk materi yang muncul di lokasi yang sama, marker mencakup nomor halaman, header dan footer serta icon.


Beberapa jenis grid:

  1. Single column grid
  2. Two column grid
  3. Multicolumn grids
  4. Modular grids
  5. Hierarchical grids

1. SINGLE COLUMN GRID
Single-Column Grid umumnya digunakan untuk teks yang berjalan terus menerus seperti esai, laporan atau buku. Fitur utama pada halaman adalah blok teks.

Ilustrasi Single-Column Grid
Contoh Single Column Grid: Medium.com

2. TWO COLUMN GRID
Two-Column Grid dapat digunakan untuk mengontrol banyak teks atau untuk menyajikan berbagai jenis informasi dalam kolom terpisah. Two-column grid ini dapat disusun dengan lebar kolom yang sama atau berbeda. Pada proporsi yang ideal, ketika satu kolom lebih lebar dari yang lain, kolom yang lebih luas berukuran dua kali lipat atau kelipatannya.

Ilustrasi Two-Column Grid

3. MULTICOLUMN GRID
Multicolumn grid memberikan fleksibilitas yang lebih besar daripada single-column grid dan two-column grid, menggabungkan banyak kolom dengan lebar yang bervariasi, berguna untuk majalah atau web.

Ilustrasi Multicolumn Grid
Contoh 1 Multicolumn Grid
Contoh 2 Multicolumn Grid
Contoh 3 Multicolumn Grid
Contoh 4 Multicolumn Grid
Contoh 5 Multicolumn Grid

4. MODULAR GRID
Modular grid paling baik digunakan untuk mengendalikan jenis informasi yang kompleks yang dapat ditemukan pada koran, kalender, grafik dan tabel. Pada grid ini dilakukan penggabungan kolom vertikal dan horizontal yang mengatur struktur menjadi potongan (chunk) ruang yang lebih kecil.

Ilustrasi Modular Grid
Contoh 1 Modular Grid
Contoh 2 Modular Grid

5. HIERARCHICAL GRID
Hierarchical grid memecah halaman menjadi zona-zona. Banyak hierarchical grid disusun dari kolom horizontal. Grid ini biasanya digunakan ketika rancangan layout tidak memenuhi kriteria dari jenis grid-grid lainnya (single, double, multiple dan modular grid).

Ilustrasi Hierarchical Grid

Fixed Width Grid untuk Website

Untuk membuat fixed-width grid pada web, desainer harus terlebih dahulu menentukan lebar desain, yang ditentukan oleh resolusi monitor target user. Sebagian besar web masih dioptimalkan untuk ukuran 1024 x 768 pixel, sehingga sebagian besar grid web berukuran lebar antara 950-990 pixel. Alasan lebarnya dikurangi 25-50 pixel dari resolusi monitor adalah untuk mengakomodir elemen web seperti scrollbar atau window frame, menghindari side scrolling. Setelah lebar ditentukan, seorang desainer memutuskan berapa banyak kolom yang dibutuhkan.

Secara umum, tiga kolom terlalu membatasi, dan lebih banyak kolom berarti desain lebih fleksibel. Namun, terlalu banyak kolom dapat membuat kesulitan dalam mengenali relasi komponen. Tidak ada jumlah kolom yang tepat, tetapi grid yang optimal memberikan layout dengan pengaturan yang jelas dengan tetap memperhatikan fleksibilitas. Lebar kolom untuk grid ditentukan oleh lebar keseluruhan dibagi dengan jumlah kolom. Dan akhirnya jarak antar kolom ditambahkan, memberikan pemisah antar elemen di setiap kolom.

Contoh perhitungan lebar kolom untuk fixed-width grid

Referensi



57 thoughts on “Layout [2]

  1. Nama : Clarita Butarbutar
    NIM : 11419067
    Whitespace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman yang tidak ada gambar dan teks.
    Pentingnya Whitespace adalah
    1. Menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    2. Membuat layout yang dapat discan
    3. Memungkinkan user untuk menscan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.
    Alligment adalah menyelaraskan elemen secara vertikal dan hrizontal dan juga berkontribusi pada simplicity. Posisi alligment yang lebih sedikit menunjukkan bentuk desain yang lebih sederhana.
    Sistem grid adalah salah satu cara untuk menciptakan keseimbangan dengan cara mengatur elemen-elemen desain dan space dalam suatu desain. Sistem grid ini menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.
    Alasan menggunakan grid yaitu:
    1. Grid dapat menciptakan kontinuitas pada urutan halaman
    2. Grid adalah alat untuk mengatur informasi dan menyusun halaman dengan cepat
    3. Grid dapat membantu menciptakan harmonisasi visual dan menghubungkan beragam komposisi elemen
    4. Grid dapat membantu pembaca menelusuri konten dengan mudah
    Elemen Grid ada 6 yaitu : Columns, modules, margins, spatial zones, flowlines, markers.
    Diagram dasar Grid yaitu : Single column grid, Two column grid, Multicolumn grid, Modular grid, Hierarchical grid.
    Fixed-width Grid untuk web:
    1. Desainer harus menentukan lebar desain terlebih dahulu
    2. Mengoptimalkan besar web ukuran 1024 x 768 menjadi lebarnya 950-990 untuk mengakomodir elemen web seperti scrollbar atau windows frame sehingga mengurangi side scrolling.
    3. Desainer memutuskan berapa banyak kolom yang dibutuhkan
    4. Lebar kolom untuk grid ditentukan oleh lebar keseluruhan dibagi dengan jumlah kolom.
    5. Jarak antara kolom ditambahkan dan memmberikan pemisah antara elemen setiap kolom

  2. Nama : Santo L Harianja
    Nim : 11419027
    Kelas : 42 TRPL 1

    Layout 2
    .
    .
    .

    WhiteSpace
    whitespace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.

    Pentingnya whitespace
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat
    Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.

    Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical. alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain.Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang.
    Sistem grid digunakan untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text ,dll.
    Alasan menggunakan Grid
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

  3. Nama : Gahasa Timothius B.P Purba
    NIM : 11419048
    Prodi : 42TRPL2

    Hierarki visual yang bagus bukanlah dengan menggunakan gambar-gambar grafis yang hebat tetapi bagaimana kita mengatur dan mengelola informasi sehingga berguna dan mudah diakses oleh pengunjung dari website kita.

    Whitespace : Bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong, atau ruang kosong pada sebuah halaman. Tetapi bukan berarti ruang tersebut harus berwarna putih.

    Pentingnya Whitespace :
    – Menciptakan hubungan yang membentuk sistem yang mengarah ke hierarki
    – Membuat layout yang dapat di scan
    – Memungkinkan user untuk menscan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat

    Alignment :
    – Menyelaraskan elemen secara horizontal dan vertical
    – Berkontribusi pada simplicity

    Grid :
    – Cara menciptakan keseimbangan
    – Mengatur elemen-elemen desain dan space dalam suatu desain
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang

    Pentingnya Grid :
    – Grid dapat menciptakan kontinuitas pada urutan halaman
    – Grid adalah alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat
    – Dalam single-page, grid dapat membantu desainer menciptakan harmonisasi visual dan menghubungkan beragam komposisi elemen
    – Bagi pembaca web: dalam dokumen sekuensial, memungkinkan pembaca untuk menelusuri konten dengan mudah

    Diagram Dasar Grid :
    1. Single Column
    Digunakan untuk teks yang berjalan terus menerus seperti esai, laporan atau buku. Fitur utama pada halaman adalah blok teks.
    2. Two Column
    Digunakan untuk mengontrol banyak teks atau untuk menyajikan berbagai jenis informasi dalam kolom terpisah
    Dapat disusun dengan lebar kolom yang sama atau berbeda
    3.Multicolumn
    Memberikan fleksibilitas yang lebih besar daripada single-column grid dan two-column grid
    Menggabungkan banyak kolom dengan lebar yang bervariasi berguna untuk majalah
    4.Modular
    Paling baik digunakan untuk mengendalikan jenis informasi yang kompleks yang dapat ditemukan pada koran, kalender, grafik, dan tabel
    Dilakukan penggabungan kolom vertikal dan horizontal yang mengatur struktur menjadi chunk ruang yang lebih kecil
    5.Hierarchical
    Hierarchical grid memecah halaman menjadi zona-zona
    Banyak hierarchical grid disusun dari kolom horizontal

  4. Nama : Evelin Sinurat
    NIM : 11419056
    Kelas : 42 TRPL 2

    Layout 2
    A. Whitespace
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong, ruang kosong yang terdapat pada sebuah halaman. Ruang tersebut tidak diwajibkan berwarna putih. Contohnya adalah Google.

    Pentingnya Whitespace:
    1. Dapat menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    2. Membuat layout dapat di-scan.
    3. Memungkinkan user dapat men-scan informasi untuk menemukan apa yang dicari dengan cepat.
    4. Balance & Symmetry

    B. Alignment
    – Menyelaraskan elemen secara horizontal dan vertical.
    – Berkontribusi pada simplicity.
    – Posisi alignment jika lebih sedikit maka desain yang lebih sederhana

    C. Sistem Grid
    – Menciptakan keseimbangan.
    – Mengatur elemen-elemen desain dan space dalam suatu desain.
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  5. Nama : Ervina Sipahutar
    NIM : 11419066
    Kelas : 42 TRPL 2

    Whitespace :
    Merupakan bagian dari halaman yang tidak ditandai atau bagian yang dibiarkan kosong. Ruang kosong tersebut tidak harus berwarna putih.

    Pentingnya Whitespace :
    – menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    – membuat layout yang dapat di scan.
    – memungkinkan user untuk melakukan scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.

    Alignment :
    Menyelaraskan elemen secara horizontal dan vertical dan berkontribusi pada simplicity.

    Sistem Grid :
    – cara menciptakan keseimbangan
    – mengatur elemen-elemen desain dan space dalam suatu desain.
    – menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Sistem grid digunakan untuk mendefinisikan:
    – lebar margin
    – proporsi area pada sebuah halaman
    – jumlah dan ukuran kolom
    – posisi gambar
    – heading
    – body text
    – penempatan nomor halaman pada footnote

    Elemen-elemen Grid :
    a. Columns
    b. Modules
    c. Margins
    d. Spatial zones
    e. Flowlines
    f. Markers

    Diagram dasar Grid :
    a. Single column grid
    b. Two column grid
    c. Multicolumn grid
    d. Modular grids
    e. Hierarchical grids

  6. Nama : Naldo Tua Samosir
    NIM : 11419024
    Kelas : 42 TRPL 1

    Layout 2
    Komponen-komponen layout antara lain grouping, hirarki, whitespace, alignment and grids.
    3. Whitespace
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong, ruang kosong yang terdapat pada sebuah halaman. Ruang tersebut tidak diwajibkan berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat.
    4. Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical. Alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.
    5. Gird
    Grid merupakan cara untuk menciptakan keseimbangan ,mengatur elemen-elemen desain dari space dalam suatu desain.Grid juga berguna untuk menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.
    Elemen – elemen Grid :
    -Columns
    -Modules
    -Margins
    -Spatial zones
    -Flowlines
    -Markers

  7. Nama : Hilman Sijabat
    Nim : 11419025
    Kelas : 42TRPL 1

    Layout 2
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong, ruang kosong yang terdapat pada sebuah halaman. Ruang tersebut tidak diwajibkan berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat..

    Pentingnya whitespace, yakni:
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.
    – Balance & Symmetry

    Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical. Alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain. Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang.
    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

    Alasan menggunakan Grid adalah:
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman.
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

  8. Nama : Suryanto Ray S Panjaitan
    NIM : 11419031
    Kelas : 42 TRPL 1

    Whitespace
    -Bagian dari halaman yang tidak ditandai,bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman
    -bukan berarti ruang tersebut harus berwarna putih
    -cth : Google

    PENTINGNYA WHITESPACE
    -menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    -membuat layout yang dapat discan
    -memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat

    Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical. alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain.Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang.
    Sistem grid digunakan untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text ,dll.
    Alasan menggunakan Grid adalah:
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

  9. Nama : Mikhael Hutapea
    NIM : 11419037
    Kelas : 42TRPL 2

    Layout 2

    Whitespace
    Whitespace adalah bagian dari halaman yang tidak ditandai/bagian yang kosong. Whitespace membuat layout dapat di scan dan memungkinkan user menscan informasi atau kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.

    Alignment
    Aligment berkontribusi untuk simplicity sebuah desain, menyelaraskan elemen secara horizontal dan vertical.
    Posisi alignment yang sedikit berarti desain yang lebih sederhana.

    Sistem Grid
    Grid merupakan salah satu cara untuk menciptakan keseimbangan, mengatur elemen-elemen desain dan space dalam desain, dan meyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Alasan menggunakan Grid:
    1. Grid mengatur dan menyusun halaman dengan cepat.
    2. Grid menciptakan kontinuitas pada urutan halaman
    3. Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah
    Diagram dasar grid:
    1. Single Colum Grid
    2. Two Column Grid
    3. Multicolumn Grid
    4. Modular Grid
    5. Hierarchical Grid

  10. Nama : Ivanowsky Fernandes Habeahan
    NIM : 11419030
    Kelas : 42 TRPL 1

    WHITESPACE
    Whitespace adalah bagian dari sebuah halaman yang tidak ditandai yang dibiarkan kosong namun bagian tersebut tidak berwarna putih. Whitespace sangan penting karenadapt mencipatakan hubungan yang mengarah ke hirarki, layout yang dapat di scan dan user dapat menscan informasi/kelompok.

    GRID
    Grid merupakan cara untuk menciptakan keseimbangan ,mengatur elemen-elemen desain dari space dalam suatu desain.Grid juga berguna untuk menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    ALASAN MENGAPA MENGGUNAKAN GRID :
    1. Dapat mengatur dan menyusun halaman dengan cepat
    2. Menciptakan kontinuitas pada urutan halaman
    3. Membantu pembaca menelusuri konten dengan mudah

    Sistem grid dapat digunakan untuk mendefinisikan:
    – lebar margin
    – proporsi area pada sebuah halaman
    – jumlah dan ukuran kolom
    – posisi gambar
    – heading
    – body text
    – penempatan nomor halaman pada footnote

    Elemen – Elemen Grid :
    1.Columns
    2.Modules
    3.Margins
    4.Spatial zones
    5.Flowlines
    6.Markers

  11. Nama : Meyliza Veronica Siregar
    NIM : 11419058

    Whitespace
    Whitespace adalah bagian yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman, tetapi bukan berarti halaman kosong tersebut harus berwarna putih.
    Whitespace penting untuk:
    – Menciptakan hubungan yang membentuk sistem yang mengarah ke hierarki
    – Membuat layout yang dapat di scan
    – Memungkinkan user untuk menscan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat

    Alignment
    Alignment menyelaraskan elemen secar horizontal dan vertical dan berkontribusi pada simplicity.

    Sistem Grid
    Sistem grid adalah cara untuk menciptakan keseimbangan dengan mengatur elemen-elemen desain dan space dalam suatu desain dan menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Alasan Menggunakan Sistem Grid :
    – Grid menciptakan kontinuitas pada urutan halaman.
    – Grid alat yang ampun mengatur informasi dan menyusun halaman.
    – Grid membantu menciptakan harmonisasi visual dalam single-page,
    – Bagi pembaca web, memungkinkan pembaca untuk menelusuri konten dengan mudah.

    Elemen-elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  12. Nama: Maristella Sitanggang
    NIM: 11419064
    Kelas: 42TRPL 2

    Whitespace
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong, ruang kosong yang terdapat pada sebuah halaman. Ruang tersebut tidak diwajibkan berwarna putih.
    Pentingnya Whitespace:
    1. Dapat menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    2. Membuat layout dapat di-scan.
    3. Memungkinkan user dapat men-scan informasi untuk menemukan apa yang dicari dengan cepat.
    4. Balance & Symmetry

    Alignment
    Menyelaraskan elemen secara horizontal dan vertical. Berkontribusi pada simplicity. Posisi alignment jika lebih sedikit maka desain lebih sederhana

    Sistem Grid
    – Menciptakan keseimbangan.
    – Mengatur elemen-elemen desain dan space dalam suatu desain.
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.
    Alasan menggunakan Grid:
    – Grid mengatur dan menyusun halaman dengan cepat.
    – Grid menciptakan kontinuitas pada urutan halaman
    – Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    – Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.
    Ada 5 diagram dasar Grid:
    – Single Colum Grid
    Teks yang berjalan terus menerus seperti esai
    – Two Column Grid
    Mengontrol banyak teks
    – Multicolumn Grid
    Menggabungkan banyak kolom dengan lebar bervariasi, berguna untuk majalah
    – Modular Grid
    Penggabungan kolom vertical dan horizontal
    – Hierarchical Grid
    Memecah halaman menjadi zona-zona

  13. Nama : Tantri H. Silaen
    NIM : 11419059
    Kelas : 42 TRPL 2

    Layout 2

    Whitespace
    Bagian dari halaman yang tidak ditandai,bagian yang dibiarkan kosong,atau
    ruang kosong pada sebuah halaman.
    Whitespace sangat penting untuk meciptakan hubungan yang membentuk sistem yang
    mengarah ke hirarki, membuat layout yang dapat di scan,dan memungkinkan user untuk
    menscan informasi dan kelompok informasi untuk menemukan apa yang merek cari dengan cepat.

    Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical.Brkontribusi pada
    simplicity.Posisi alignment yang lebih sedikit berarti desainnya lebih sederhana.

    Sistem Grid
    Sistem grid adalah cara untuk meciptakan keseimbangan, dengan cara mengatur elemen-elemen
    desain dan space dalam suatu desain, menyelaraskan elemen desain melalui pengggunaan kolom
    yang menciptakan ruang.
    Sistem grid digunakan untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom,
    posisi gambar, heading body text ,dll.
    Alasan menggunakan grid:
    -Grid dapat menciptakan kontinuitas pada urutan halaman.
    -Grid adalah alat yang ampuh untuk mengatur informasi dan menyusun halaman
    dengan cepat
    -Dalam single-page, grid dapat membantu desainer menciptakan harmonisasi
    visual dan menghubungkan beragam komposisi elemen
    -Bagi pembaca web:dalam dokumen sekuensial, memungkinkan pembaca untuk menelusuri
    konten dengan mudah.

    Diagram dasar grid:
    1.Single column grid
    –>Digunakan untuk teks yang berjalan terus menerus sepert esai, laporan
    atau buku
    2.Two column grid
    –>Digunakan untuk mengontrol banyak teks atau untuk menyajikan berbagai jenis
    informasi dalam kolom terpisah.
    3.Multicolumn grids
    –>Memberikan fleksibilitas yang lebih besar daripada single-column grid dan two-column grid.
    4.Modular grids
    –>Digunakan untuk mengendalikan jenis informasi yang kompleks yang dapat ditemukan pada koran, kalender,
    grafik, dan tebal.
    5.Hierarchical grids
    –>Digunakan untuk memecah halaman menjadi zona-zona

  14. Nama : Ares J. M. Pardosi
    NIM : 11419062
    Kelas : 42TRPL2

    WhiteSpace
    whitespace didefenisikan sebagai suatu bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.

    Berikut alasan mengapa whitespace penting :
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat
    Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.

    Alignment
    Alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid
    Cara tertua untuk menciptakan suatu keseimbangan merupakan pengertian dari Sistem Grid. Sistem Grid dilakukan dengan cara mengatur elemen elemen desain dan space dalam satu desain.Sistem grid juga menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang.

    Sistem grid dapat digunakan untuk mendefinisikan:
    -lebar margin
    -proporsi area pada sebuah halaman
    -jumlah dan ukuran kolom
    -posisi gambar
    -heading
    -body text
    -penempatan nomor halaman dan footnote

    Adapun alasan mengapa kita menggunakan grid:
    -Menciptakan kontinuitas pada urutan halaman
    -Alat yang ampuh untuk mengatur informasi dan menyusun halaman yang cepat
    -Dalam single-page, grid dapat membantu desainer menciptakan harmonisasi visual dan mengubungkan beragam komposisi elemen
    -Bagi pembaca web : dalam dokumen sekuensial,memungkinkan pembaca untuk menelusuri konten dengan mudah

    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  15. Nama : Mei Pane
    NIM : 11419006
    Kelas : 42 TRPL 1

    LAYOUT 2

    3.Whitespace
    Whitespace merupakan bagian dari sebuah halaman yang tidak ditandai yang dibiarkan kosong namun bagian tersebut tidak berwarna putih. Whitespace sangan penting karenadapt mencipatakan hubungan yang mengarah ke hirarki, layout yang dapat di scan dan user dapat menscan informasi/kelompok.

    4.Aligment
    Menyelaraskan elemen secara horizontal dan vertikal, berkontribusi pada simplicity dan membuat desain yang sederhana
    5. Sistem Grid
    Cara untuk menciptakan keseimbangan dengan cara mengatur elemen desain dan space, menyelaraskan elemen desain melalui penggunaan kolom yang dapat menciptakan ruang.
    Sistem grid dapat digunakan dalam mendefinisikan leber margin, proporsi area, jumlah dan ukuran kolom, posisi gambar, heading, body text dan penempatan nomor halaman dan footnote.
    Alasan mengapa menggunakan grid yaitu:
    – grid dapat menciptakan continuitas urutan halaman
    – Grid alat yang dapat mengatur informasi dan menyusun halaman dengan cepat
    – Grid membantu desainer menciptakan harmonisasi visual dan menghubungkan komposisi elemen
    – User dapat menyelusuri konten dengan mudah
    Elemen pada Grid yaitu Columns,Modules,Margins,Spatial Zones,Flowlines dan Markers.
    Ada 5 diagram dasar grid yaitu, singel column grid, two column grid, multi column grid,modular grid dan hierarchical grid

  16. Nama : Fretty L M Silalahi
    Nim : 11419057
    Kelas : 42 TRPL 2

    Layout 2
    WhiteSpace
    whitespace adalah suatu bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.

    Pentingnya whitespace, yakni:
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat
    Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.

    Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical. alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain.Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang.
    Sistem grid digunakan untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text ,dll.
    Alasan menggunakan Grid adalah:
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  17. Nama :Thumphak Adhitio Ariotnang
    NIM:11419035
    Kelas:42 TRPL 1
    A.Whitespace
    Whitespace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong, atau ruang kosong pada sebuah halaman.Meskipun disebut whitespace, bukan berarti ruang tersebut harus berwarna putih. Ruang kosong ini dapat diisi dengan warna apapun asalkan bebas dari elemen apapun seperti teks dan gambar.
    Beberapa case penggunaan whitespace
    1.Dialogbox yang tepat
    2.Menngunakan White Space untuk mengatur label
    3.White space menghindari visual noise
    4.Balance and Simetry

    B.Aligment and Grid System Alignment
    Alignment berkontribusi pada Simplicity sebuah desain. Posisi alignment yang lebih sedikit berarti desain yang lebih sederhana.
    Anatomi Halaman Website
    Secara umum,sebuah halaman website terdiri dari:
    1. Header
    Header pada halaman web bertindak sebagai landasan bagi user dengan mengidentifikasi dan secara visual menyatukan sebuah halaman web.
    2. Navigation
    3. Feature
    Salah satu indikasi desain yang efektif adalah hirarki informasi yang didefinisikan dengan jelas.
    4. Body/Content
    Body atau isi web adalah tempat user menghabiskan sebagian besar waktu mereka, karena bisanya merupakan akhir pencarian mereka untuk sebuah konten.
    5. Sidebar
    Body atau isi web adalah tempat user menghabiskan sebagian besar waktu mereka, karena bisanya merupakan akhir pencarian mereka untuk sebuah konten.
    6. Footer
    Footer berisi informasi hak cipta web serta beberapa link.
    7. Background
    Background halaman web digunakan untuk melengkapi konten sebuah halaman. Background dapat digunakan untuk membuat kedalaman atau dimensi, menambahkan kekayaan dengan tekstur dan warna pada sebuah halaman, atau bahkan memperluas konten di luar batas halaman.
    C.Sistem Grid
    Sistem grid dapat digunakan untuk mendefinisikan variabel-variabel berikut:
    • Lebar margin
    • Proporsi area pada sebuah halaman
    • Jumlah dan ukuran kolom
    • Posisi gambar
    • Heading
    • Body text
    • Penempatan nomor halaman dan footnote.
    Manfaat menggunakan Grid:
    • Bahwa grid dapat menciptakan kontinuitas (Continuity) pada urutan halaman.
    • Terkait kecepatan; grid adalah alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat.
    • Dalam hal komposisi single-page, grid dapat membantu desainer menciptakan harmonisasi visual dan secara estetika menghubungkan beragam komposisi elemen.

    Elemen Grid
    1.Columns
    Kolom adalah wadah vertikal yang menampung teks atau gambar
    2.Modules
    Modul adalah area individual yang dipisahkan oleh ruang yang konsisten, menyediakan grid yang berulang dan teratur.
    3.Margins
    Margin adalah zona penyangga. Margin mewakili jumlah ruang antara ukuran tepi halaman, termasuk gutter (space antara tepi halaman dengan konten) dan konten halaman.
    4.Spatial Zones
    Zona spasial adalah kelompok modul atau kolom yang dapat membentuk area spesifik untuk teks, iklan, gambar atau informasi lainnya
    5.Flowlines
    Flowlines adalah alignment yang memecah ruang menjadi horizontal pita.
    6.Markers
    Marker membantu pembaca menavigasi dokumen.
    Jenis_jenis Grid:
    1.Sinlge Column Grid
    Single-Column Grid umumnya digunakan untuk teks yang berjalan terus menerus seperti esai, laporan atau buku. Fitur utama pada halaman adalah blok teks.
    2.Two Column Grid
    Two-Column Grid dapat digunakan untuk mengontrol banyak teks atau untuk menyajikan berbagai jenis informasi dalam kolom terpisah.
    3.Multi Column Grid
    Multicolumn grid memberikan fleksibilitas yang lebih besar daripada single-column grid dan two-column grid, menggabungkan banyak kolom dengan lebar yang bervariasi, berguna untuk majalah atau web.
    4.Modular Grid
    Modular grid paling baik digunakan untuk mengendalikan jenis informasi yang kompleks yang dapat ditemukan pada koran, kalender, grafik dan tabel.
    5.Hierarchicak Grid
    Hierarchical grid memecah halaman menjadi zona-zona. Banyak hierarchical grid disusun dari kolom horizontal.

  18. Nama : Lastri Rohani Nababan
    NIM : 11419060
    Kelas : 42 TRPL 2

    1. Whitespace
    Bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman, dan ruang tersebut bukan harus berwarna putih.
    Pentingnya Whitespace :
    – Menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    – Membuat layout yang dapat di-scan.

    2. Alignment
    Menyelaraskan elemen secara horizontal dan vertical, berkontribusi pada simplicity dan posisi alignment lebih sedikit berarti desain lebih sederhana.
    Sistem Grid :
    – Cara untuk menciptakan keseimbangan.
    – Mengatur elemen-elemen desain dan space pada suatu desain.
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.
    Alasan menggunakan Grid :
    – Grid dapat menciptakan kontinuitas pada urutan halaman.
    – Grid merupakan alat yang ampuh untuk mengatur informasi dan Menyusun halaman dengan cepat.

    Elemen Grid, yaitu :
    1. Columns
    2. Modules
    3. Margins
    4. Spatial zones
    5. Flowlines
    6. Markers

    Diagram dasar Grid, yaitu :
    1. Single column grid
    2. Two column grid
    3. Multicolumn grid
    4. Modulator grid
    5. Hierarchical grid

  19. Nama : Febryanti Melati
    NIM : 11419061
    Kelas : 42TRPL2

    Whitespace
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong yang terdapat pada sebuah halaman.
    Ruang tersebut tidak diwajibkan berwarna putih.

    Pentingnya Whitespace:
    1. Dapat menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    2. Membuat layout dapat di-scan.
    3. Memungkinkan user dapat men-scan informasi untuk menemukan apa yang dicari dengan cepat.
    4. Seimbang

    Alignment
    – Menyelaraskan elemen secara horizontal dan vertical.
    – Berkontribusi pada simplicity.
    – Posisi alignment jika lebih sedikit maka desain yang lebih sederhana

    Sistem Grid
    – Menciptakan keseimbangan.
    – Mengatur elemen-elemen desain dan space dalam suatu desain.
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  20. Nama : Darwin Sibarani
    Nim : 11419029
    Kelas : 42 TRPL 1

    Layout II

    Whitespace
    Bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong,
    atau ruang kosong pada sebuah halaman.Bukan berarti ruang tersebut harus berwarna putih,
    Contohnya : Google
    Fungsi Whitespace :
    -Menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    -Membuat layout yang dapat di-scan
    -Memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan
    apa yang mereka cari dengan cepat.

    Alignment
    berkontribusi pada simplicity desain.Posisi alignment yang lebih sedikit berarti
    desain yang lebih sederhana.

    Sistem Grid
    Salah satu cara tertua untuk menciptakan keseimbangan dengan cara mengatur
    elemen-elemen desain dan space dalam suatu desain.Jadi sistem grid ini menyelaraskan
    elemen desain melalui penggunaan kolom yang menciptakan ruang.
    Alasan kita harus menggunakan Grid :
    -Grid menciptakan kontinuitas pada urutan halaman
    -Grid adalah alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat
    -Dalam single-page,grid dapat membantu desainer menciptakan harmonisasi visual dan
    menghubungkan beragam komposisi elemen
    *Bagi pembaca web: dalam dokumen sekuensi,memungkinkan pembaca untuk menelusuri konten
    dengan mudah

    Elemen-Elemen dari grid :
    -Columns
    -Modules
    -Margins
    -Spatial zones
    -Flowlines
    -Makers

  21. Nama: Josua Simbolon
    Nim : 11419032
    Kelas : 42TRPL1

    Whitespace
    Whitespace merupakan bagian dari halaman yang dibiarkan kosong, namun bukan
    berarti halaman tersebut harus berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan
    user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat.

    Grid
    Grid adalah struktur yang terdiri dari garis-garis horizontal atau gabungan garis vertikal dan horizontal yang saling bertemu yang digunakan untuk mengatur layout atau interface. Dengan grid ini kita membagi suatu layout berdasarkan kolom-kolom, selanjutnya dengan kolom – kolom ini content diatur dan ditemp.
    Sistem Grid
    – Menciptakan keseimbangan.
    – Mengatur elemen-elemen desain dan space dalam suatu desain.
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  22. SAHAT HUTAURUK
    11419010 / 42TRPL1

    — Whitespace
    Whitespace merupakan bagian dari halaman yang dibiarkan kosong, namun bukan berarti halaman tersebut harus berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat.’

    — Alignment
    Berkontribusi pada simplicity untuk menyelaraskan elemen secara horizontal dan vertical.

    — Sistem Grid
    Sistem grid merupakan cara menciptakan keseimbangan, mengatur elemen- elemen desain dari space dalam suatu desain.

    ** alasan menggunakan grid :
    1) dapat menciptakan kontinuitas pada urutan halaman
    2)dapat mengatur informasi dan menyusun halaman dengan cepat
    3) dapat menciptakan harmonisasi visual melalui penggabungan beberapa elemen
    4) memungkinkan pembaca menelusuri dengan mudah.

    **Diagram dasar grid :
    1) single column grid
    2) two colum grid
    3) multi column grid
    4) Modular grids
    5) Hirarcchical grids

  23. Nama : Daniel A.C Simamora
    Nim : 11419001
    Kelas : 42 TRPL 1

    3.Whitespace
    =>Bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong, atau ruang kosong pada sebuah halaman.Bukan berarti ruang tersebut harus berwarna putih.
    Contoh : Google
    Fungsi Whitespace, yaitu :
    *Menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    *Membuat layout yang dapat di-scan
    *Memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan
    apa yang mereka cari dengan cepat.

    4.Alignment
    =>berkontribusi pada simplicity desain.Posisi alignment yang lebih sedikit berarti
    desain yang lebih sederhana.

    5.Sistem Grid
    =>Salah satu cara tertua untuk menciptakan keseimbangan dengan cara mengatur
    elemen-elemen desain dan space dalam suatu desain.Jadi sistem grid ini menyelaraskan
    elemen desain melalui penggunaan kolom yang menciptakan ruang.
    Alasan kita harus menggunakan Grid :
    *Grid menciptakan kontinuitas pada urutan halaman
    *Grid adalah alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat
    *Dalam single-page,grid dapat membantu desainer menciptakan harmonisasi visual dan
    menghubungkan beragam komposisi elemen
    *Bagi pembaca web: dalam dokumen sekuensi,memungkinkan pembaca untuk menelusuri konten
    dengan mudah

    elemen dari grid :
    *Columns
    *Modules
    *Margins
    *Spatial zones
    *Flowlines
    *Makers

  24. Oriza Sitanggang_11419018

    Whitespace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong.
    Pentingnya whitespace , yaitu:
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki. – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.

    Alignment merupakan keselarasan elemen secara horizontal dan vertical.
    Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem grid berfungsi untuk menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.
    Alasan menggunakan Grid adalah:
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

  25. Nama : Zico Andreas Aritonang
    NIM : 11419049
    Kelas : 42TRPL2

    A. Whitespace
    Bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong,
    atau ruang kosong pada sebuah halaman ( halaman tidak harus berwarna putih)

    Pentingnya Whitespace
    menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    memungkinkan user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat.
    Balance & Symmetry

    B. Alignment
    – Menyelaraskan elemen secara horizontal dan vertical.
    – Berkontribusi pada simplicity.
    – Posisi alignment jika lebih sedikit (lebih sederhana)

    C. Sistem Grid
    – Sistem grid menciptakan urutan halaman.
    – Sistem grid mengatur elemen-elemen desain dan space dalam suatu desain.
    – Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  26. Nama : Hepniwer Nur Aisah Purba
    NIM : 11419019
    Kelas : 42 TRPL 1

    WhiteSpace
    Whitespace adalah suatu bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.
    Pentingnya whitespace , yaitu:
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki. – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.
    Alignment
    Alignment merupakan keselarasan elemen secara horizontal dan vertical. Alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.
    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain.Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang. Sistem grid digunakan untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text ,dll.
    Alasan menggunakan Grid adalah:
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen. 4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.
    Diagram dasar grid:
    1.Single Colum Grid
    2.Two Column Grid
    3.Multicolumn Grid
    4.Modular Grid
    5.Hierarchical Grid

  27. Nama : Kevin Yoyada Tambunan
    NIM : 11419033
    Kelas : 42 TRPL 1

    Whitespace
    Whitespace adalah bagian dari halaman yang tidak ditandai/bagian yang kosong. Whitespace membuat layout dapat di scan dan memungkinkan user menscan informasi atau kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.
    Pentingnya whitespace
    – menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    – membuat layout yang dapat di scan
    – memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.

    Alignment
    menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    memungkinkan user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat

    Sistem Grid
    Grid merupakan salah satu cara untuk menciptakan keseimbangan, mengatur elemen-elemen desain dan space dalam desain, dan meyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Alasan menggunakan Grid:
    1. Grid mengatur dan menyusun halaman dengan cepat.
    2. Grid menciptakan kontinuitas pada urutan halaman
    3. Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah

    Elemen Grid
    1. Columns
    2. Modules
    3. Margins
    4. Spatial zones
    5. Flowlines
    6. Markers

    Diagram dasar grid:
    1. Single Colum Grid
    2. Two Column Grid
    3. Multicolumn Grid
    4. Modular Grid
    5. Hierarchical Grid

  28. Nama : Lilis Marito Pardosi
    NIM : 11419015
    Kelas : 42TRPL1

    WhiteSpace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan .
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.

    Alignment adalah keselarasan elemen secara horizontal dan vertical. Alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid adalah salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain.Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang. Sistem grid digunakan untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text.

    Alasan menggunakan Grid yaitu :
    – Grid dapat mengatur dan menyusun halaman dengan cepat.
    – Grid menciptakan kontinuitas pada urutan halaman.
    – Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    – Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

  29. Nama : Kevin Johanes Pakpahan
    NIM : 11419042
    Kelas : 42 TRPL 2

    Whitespace
    Whitespace adalah bagian dari halaman yang tidak ditandai/bagian yang kosong. Whitespace membuat layout dapat di scan dan memungkinkan user menscan informasi atau kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.

    Alignment
    Aligment berkontribusi untuk simplicity sebuah desain, menyelaraskan elemen secara horizontal dan vertical.
    Posisi alignment yang sedikit berarti desain yang lebih sederhana.

    Sistem Grid
    Grid merupakan salah satu cara untuk menciptakan keseimbangan, mengatur elemen-elemen desain dan space dalam desain, dan meyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Elemen yang terdapat pada Grid diantaranya :

    – .Columns
    – .Modules
    – .Margins
    – .Spatial zones
    – .Flowlines
    – .Markers

  30. Nama : Agus Rokyanto S
    NIM : 11419045
    Kelas : 42TRPL2

    1. Whitespace
    Whitespace adalah ruang kosong yang terdapat pada sebuah halaman yang penting agar user dapat menscan informasi dalam menemukan apa yang dicari dengan cepat.

    Pentingnya Whitespace:
    1. Membuat layout dapat di-scan.
    2. Memungkinkan user dapat men-scan informasi untuk menemukan apa yang dicari dengan cepat.
    3. Balance & Symmetry

    2. Alignment
    – Menyelaraskan elemen secara horizontal dan vertical.
    – Berkontribusi pada simplicity.
    – Posisi alignment jika lebih sedikit maka desain yang lebih sederhana

    3. Sistem Grid
    – Menciptakan keseimbangan.
    – Mengatur elemen-elemen desain dan space dalam suatu desain.
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Elemen Grid:
    1. Columns
    2. Modules
    3. Margins
    4. Spatial zones
    5. Flowlines
    6. Markers

  31. Nama : Nathan F L Tobing
    NIM : 11419003
    Kelas : 42 TRPL 1

    Whitespace :
    1. Bagian dari halaman yang dibiarkan kosong
    2. Tidak harus berwarna putih.

    Fungsi whitespace :
    1. menciptakan hubungan yang mengarahkan sistem ke hirarki
    2. membuat layout yang dapat di scan.
    3. memungkinkan user untuk menscan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan tepat.

    Grid :
    1. Cara menciptakan keseimbangan
    2. Mengatur elemen-elemen desain dan space dalam suatu desain
    3. Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang

    Fungsi Grid :
    1 .Grid dapat menciptakan kontinuitas pada urutan halaman
    2. Grid adalah alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat
    3. Dalam single-page, grid dapat membantu desainer menciptakan harmonisasi visual
    4. memungkinkan pembaca untuk menelusuri konten dengan mudah

    Elemen Grid :
    1. Columns
    2. Modules
    3. Margins
    4. Spatial zones
    5. Flowlines
    6. Markers

  32. Nama : Denny Abraham Sinaga
    NIM : 11419036
    Kelas : 42TRPL2

    Whitespaces : ruang kosong dalam sebuah halaman yang menjadi sebuah elemen dalam layout.
    Whitespaces membantu memfokuskan informasi yang terdapat dalam ruangnya yang dapat diartikan melalui hal ini whitespaces membantu penyampaian informasi secara tepat dan cepat kepada pengguna.

    Mengatur whitespaces membantu pengguna yang sedang mencari informasi.
    Implementasi whitespaces dapat ditemukan dalam halnya mengatur label, dialog box, visual noise, keseimbangan simetris.

    Alignment : keteraturan kesejajaran struktur elemen desain yang bertujuan menyederhanakan dan membantu pengalaman membaca pengguna.
    Sistem Grid : mengatur setiap elemen desain dan ruang dalam sebuah desain dengan tujuan menciptakan keseimbangan seperti keterhubungan setiap halaman yang mengatur informasi dan menyusun halaman dengan cepat dan tepat.

    Grid memiliki diagram dasar yaitu single column, two column, multicolumn, modular, dan hierarchical grid.
    Elemen dalam sistem grid : columns, modules, margins, spatial zones, flowlines, markers.

    Sistem grid dapat digunakan untuk mendefinisikan:
    – lebar margin
    – proporsi area pada sebuah halaman
    – jumlah dan ukuran kolom
    – posisi gambar
    – heading
    – body text
    – penempatan nomor halaman pada footnote

  33. Nama : Daniel naibaho
    Nim : 11419047
    Kelas : 42 TRPL2

    1.WhiteSpace
    whitespace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Halaman kosong tersebut tidak harus berwarna putih.

    Pentingnya whitespace yaitu
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan
    – Memungkinkan user untuk dapat men-scan informasi untuk menemukan apa yang mereka cari dengan cepat
    -Balance dan Symetry

    2.Alignment
    keselarasan elemen secara horizontal dan vertical dan berkontribusi pada simplicity.

    3.Sistem Grid
    Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang.

    Elemen Grid Yaitu :
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  34. Nama : Riris Lasmarito Malau
    Nim : 11419022
    Kelas : 42 TRPL 1

    Whitespace: Bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong, atau ruang kosong pada sebuah halaman.
    Contoh: Google

    Pentingnya Whitespace:
    1. Menciptakan hubungan yang membentuk system yang mengarah ke hirarki
    2. Membuat layout yang dapat di-scan
    3. Memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.
    Alignment:
    – menyelaraskan elemen secar horizontal dan vertical
    – berkontribusi pada simplicity
    – posisi alignment yang sedikit, berarti desain yang lebih sederhana.

    Sistem Grid:
    – cara menciptakan keseimbangan
    – mengatur elemen elemen desain dan space dalam suatu desain
    – menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Alasan menggunakan sistem grid:
    – dapat menciptakan kontinuitas pada urutan halaman
    – dapat mengatur informasi dan menyusun halaman dengan cepat
    – dapat menciptakan harmonisasi visual melalui penggabungan beberapa elemen
    – memungkinkan pembaca menelusuri dengan mudah.

    Diagram dasar grid:
    – single column grid, untuk teks yang terus berjalan seperti essai
    – two colum grid, menyajikan banyak teks dengan meletakkannya dalam beberapa kolom
    – multi column grid, memberikan fleksibilitas lebih daripada single dan two column grid.
    – modular grid, menyajikan informasi yang lebih kompleks seperti berita dan tabel atau yang lainnya yang disusun lebih kompleks
    – hierarchical grid, memecah halaman menjadi zona zona.

  35. Nama : Samuel Halomoan Manalu
    NIM : 11419041

    1. Whitespace
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong, ruang kosong yang terdapat pada sebuah halaman. Ruang tersebut tidak diwajibkan berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat.

    Pentingnya Whitespace:
    – Dapat menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    – Membuat layout dapat di-scan.
    – Memungkinkan user dapat men-scan informasi untuk menemukan apa yang dicari dengan cepat.
    – Balance & Symmetry

    2. Alignment :
    – Menyelaraskan elemen secar horizontal dan vertical
    – Berkontribusi pada simplicity
    – Posisi alignment yang sedikit, berarti desain yang lebih sederhana.

    3. Sistem Grid :
    – Cara menciptakan keseimbangan
    – Mengatur elemen elemen desain dan space dalam suatu desain
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

    Alasan menggunakan sistem grid :
    – Dapat menciptakan kontinuitas pada urutan halaman
    – Dapat mengatur informasi dan menyusun halaman dengan cepat
    – Dapat menciptakan harmonisasi visual melalui penggabungan beberapa elemen
    – Memungkinkan pembaca menelusuri dengan mudah.

    Diagram dasar grid :
    – Single-column grid, untuk teks yang terus berjalan seperti essai
    – Two-colum grid, menyajikan banyak teks dengan meletakkannya dalam beberapa kolom
    – Multi-column grid, memberikan fleksibilitas lebih daripada single dan two column grid.
    – Modular grid, menyajikan informasi yang lebih kompleks seperti berita dan tabel atau yang lainnya yang disusun lebih kompleks
    – Hierarchical grid, memecah halaman menjadi zona zona.

  36. Nama : Arijona Purba
    NIM : 11419034
    Kelas : 42TRPL1

    WhiteSpace
    whitespace adalah suatu bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.
    Pentingnya Whitespace :
    – Menciptakan hubungan yang membentuk sistem yang mengarah ke hierarki
    – Membuat layout yang dapat di scan
    – Memungkinkan user untuk menscan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat

    Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical. alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem grid berfungsi untuk menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.
    Alasan menggunakan Grid adalah:
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

  37. Nama : Mario Wira Pratama Purba
    NIM : 114190350
    Kelas : 42TRPL2

    Layout 2

    1. Whitespace
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong, ruang kosong yang terdapat pada sebuah halaman. Ruang tersebut tidak diwajibkan berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan user untuk menscan informasi dalam menemukan apa yang dicari dengan cepat.

    Alignment
    1.Menyelaraskan elemen secara horizontal dan vertical
    2.Berkontribusi pada simplicity
    3.Posisi alignment yang lebih sedikit, berarti desain yang lebih sederhana.

    Sistem Grid
    Grid merupakan cara untuk menciptakan keseimbangan, mengatur elemen-elemen desain dan space dalam desain, dan meyelaraskan elemen desain menggunakan penggunaan kolom yang menciptakan ruang.

    Alasan digunakannya Grid:
    1. Grid mengatur dan menyusun halaman dengan cepat.
    2. Grid menciptakan kontinuitas pada urutan halaman
    3. Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah
    Diagram dasar grid:
    1. Single Colum Grid
    2. Two Column Grid
    3. Multicolumn Grid
    4. Modular Grid
    5. Hierarchical Grid

  38. Nama : Jovan Imanuel Sigalingging
    NIM : 11419021
    Kelas : 42TRPL1

    1. Whitespace
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong, ruang kosong yang terdapat pada sebuah halaman. Ruang tersebut tidak diwajibkan berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan user untuk menscan informasi dalam menemukan apa yang dicari dengan cepat.

    Pentingnya Whitespace:
    1. Dapat menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    2. Membuat layout dapat di-scan.
    3. Memungkinkan user dapat men-scan informasi untuk menemukan apa yang dicari dengan cepat.
    4. Balance & Symmetry

    2. Alignment
    – Menyelaraskan elemen secara horizontal dan vertical.
    – Berkontribusi pada simplicity.
    – Posisi alignment jika lebih sedikit maka desain yang lebih sederhana

    3. Sistem Grid
    – Menciptakan keseimbangan.
    – Mengatur elemen-elemen desain dan space dalam suatu desain.
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Elemen Grid:
    1. Columns
    2. Modules
    3. Margins
    4. Spatial zones
    5. Flowlines
    6. Markers

  39. Nama : Timothy J F Henan
    Nim. : 11419028
    Kelas. : 42 TRPL 1

    WhiteSpace
    whitespace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.

    Pentingnya whitespace
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat
    Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.

    Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical. alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain.Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang.
    Sistem grid digunakan untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text ,dll.
    Alasan menggunakan Grid
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

  40. Nama : Hotnida Siagian
    NIM : 11419023
    Kelas : 42 TRPL 1

    Layout 2

    => Whitespace
    Whitespace adalah bagian dari halaman yang tidak ditandai/bagian yang kosong.
    Whitespace membuat layout dapat di scan dan memungkinkan user menscan informasi atau kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.

    => Alignment
    Aligment berkontribusi untuk simplicity sebuah desain, menyelaraskan elemen secara horizontal dan vertical.
    Posisi alignment yang sedikit berarti desain yang lebih sederhana.

    => Sistem Grid
    Grid merupakan salah satu cara untuk menciptakan keseimbangan, mengatur elemen-elemen desain dan space dalam desain,
    dan meyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Alasan menggunakan Grid:
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4.Grid memungkinkan pembaca untuk menelusuri konten dengan mudah

    Diagram dasar grid:
    1.Single Colum Grid
    2.Two Column Grid
    3.Multicolumn Grid
    4.Modular Grid
    5.Hierarchical Grid

  41. Nama: Anjelina Sihombing
    NIM : 11419063
    Kelas : 42 TRPL 2

    Whitespace
    Whitespace adalah bagian halaman yang tidak ditandai, bagian yang dibiarkan kosong, ruang kosong yang terdapat pada sebuah halaman. Ruang tersebut tidak diwajibkan berwarna putih.
    Contoh: Google

    Aligment
    Menyelaraskan elemen secara horizontal dan vertikal, berkontribusi pada simplicity dan membuat desain yang sederhana
    Menyelaraskan elemen secara horizontal dan vertical.
    Berkontribusi pada simplicity.

    Grid
    Grid adalah struktur yang terdiri dari garis-garis horizontal atau gabungan garis vertikal dan horizontal yang saling bertemu yang digunakan untuk mengatur layout atau interface.

    Elemen Grid:
    Columns
    Modules
    Margins
    Spatial zones
    Flowlines
    Markers

  42. Nama : Dwiky F. N. Sitorus
    NIM : 11419004
    Kelas : 42 TRPL 1

    Whitespace, Bagian dari halaman yang tidak ditandai,bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman, namun bukan berarti ruang tersebut harus berwarna putih. Pentingnya Whitespace yaitu : -memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat

    Aligment, keselarasan elemen secara horizontal dan vertical. Alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid, salah satu cara tertua untuk menciptakan keseimbangan dengan cara mengatur elemen elemen desain dan space dalam satu desain. Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang. Sistem grid dapat digunakan untuk mendefinisikan:
    – lebar margin
    – proporsi area pada sebuah halaman
    – jumlah dan ukuran kolom
    – posisi gambar
    – heading
    – body text
    – penempatan nomor halaman dan footnote
    Alasan menggunakan grid:- Bagi pembaca web : dalam dokumen sekuensial,memungkinkan pembaca untuk menelusuri konten dengan mudah
    Elemen Grid
    1.Columns
    2.Modules
    3.Margins
    4.Spatial zones
    5.Flowlines
    6.Markers

  43. Nama : Edwin Immanuel Damanik
    NIM : 11419011
    Kelas : 42TRPL1

    Whitespace
    – Bagian yang tidak ditandai, diberikan ruang kosong pada sebuah halaman.
    – Tidak berarti harus berwarna putih
    – Contoh : Google

    Fungsi whitespace :
    – menciptakan hubungan yang mengarahkan sistem ke hirarki
    – membuat layout yang dapat di scan.
    – memungkinkan user untuk me scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan tepat.

    Alignment :
    – menyelaraskan elemen secar horizontal dan vertical
    – berkontribusi pada simplicity
    – posisi alignment yang sedikit, berarti desain yang lebih sederhana.

    Sistem Grid :
    – cara menciptakan keseimbangan
    – mengatur elemen elemen desain dan space dalam suatu desain
    – menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    alasan menggunakan sistem grid :
    – dapat menciptakan kontinuitas pada urutan halaman
    – dapat mengatur informasi dan menyusun halaman dengan cepat
    – dapat menciptakan harmonisasi visual melalui penggabungan beberapa elemen
    – memungkinkan pembaca menelusuri dengan mudah.

    Diagram dasar grid :
    – single column grid, untuk teks yang terus berjalan seperti essai
    – two colum grid, menyajikan banyak teks dengan meletakkannya dalam beberapa kolom
    – multi column grid, memberikan fleksibilitas lebih daripada single dan two column grid.
    – modular grid, menyajikan informasi yang lebih kompleks seperti berita dan tabel atau yang lainnya yang disusun lebih kompleks
    – hierarchical grid, memecah halaman menjadi zona zona.

  44. Nama : Geby W P Lumban Gaol
    NIM : 11419068
    Kelas : 42 TRPL 2

    1. Whitespace
    White space adalah bagian yang dibiarkan kosong atau ruang kosong pada suatu halaman. Ruang kosong dapat diisi dengan warna apapun, namun tidak boleh diisi gambar atau teks. White space penting karena
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki. – Membuat layout yang dapat di scan
    – Memungkinkan user scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.
    2. Alignment
    Berkontribusi pada simplicity untuk menyelaraskan elemen secara horizontal
    dan vertical.
    3. Sistem Grid
    Sistem grid adalah salah satu cara untuk menciptakan keseimbangan, mengatur elemen- elemen desain dari space dalam suatu desain.
    Jenis grid :
    1. Single column grid
    bentuk begini biasanya dipakai untuk desain konten teks berjalan terus menerus seperti esai.
    2. Two column grid
    Digunakan untuk mengontrol banyak teks atau untuk menyajikan berbagai jenis informasi dalam kolom terpisah
    3. Multicolumn grids
    menggabungkan banyak kolom dengan lebar bervariasi.
    4. Modular grids
    biasanya dipakai untuk informasi yg kompleks seperti koran, kalender dll. Pada grid ini dilakukan penggabungan kolom vertikal dan horizontal yang mengatur struktur menjadi potongan (chunk) ruang yang lebih kecil.
    5. Hierarchical grids
    Jenis grid yg dipakai kalau desain kita tidak masuk ke salah satu jenis grid yg disebut sebelumnya.

  45. Nama : Yohana Sihombing
    NIM : 11419055
    Kelas : 42 TRPL-2

    Whitespace
    -Bagian dari halaman yang tidak ditandai,bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman
    -bukan berarti ruang tersebut harus berwarna putih
    -menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    -membuat layout yang dapat discan
    -memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat
    Balance & symmetry jumlah komponen yang sama dari setiap sumbu(seimbang)

    Aligment

    -Menyeleraskan elemen secara horizontal dan vertical
    -berkontribusi pada simplicity
    -posisi alignment yang lebih sedikit berarti desain yang lebih sederhana

    Sistem Grid
    Cara menciptakan keseimbangan,mengatur elemen-elemen desain dan space dalam suatu desain dan menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang

    • Sistem grid dapat digunakan untuk mendefinisikan:
    -lebar margin
    -proporsi area pada sebuah halaman
    -jumlah dan ukuran kolom
    -posisi gambar
    -heading
    -body text
    -penempatan nomor halaman dan footnote
    • Alasan menggunakan grid:
    -Menciptakan kontinuitas pada urutan halaman
    -Alat yang ampuh untuk mengatur informasi dan menyusun halaman yang cepat
    -Dalam single-page, grid dapat membantu desainer menciptakan harmonisasi visual dan mengubungkan beragam komposisi elemen
    -Bagi pembaca web : dalam dokumen sekuensial,memungkinkan pembaca untuk menelusuri konten dengan mudah

    • Elemen Grid
    1.Columns
    2.Modules
    3.Margins
    4.Spatial zones
    5.Flowlines
    6.Markers

    • Diagram Dasar Grid
    1.Single column grid
    2.Two column grid

    3.Multicolumn grids
    4.Modular grids
    5.Hierarchical grids

    • Fixed-Width Grid untuk Web
    1.Desainer harus terlebih dahulu menentukan lebar desain,yang ditentukan oleh resolusi monitor tager user
    2.Sebagian besar web masih dioptimalkan untuk ukuran 1024 x 768 pixel,sehingga sebagian besar grid web berukuran lebar antara 950-990 pixel
    3.Lebarnya dikurangi 25-50 pixel dari resolusi monitor adalah untuk mengakomodir elemen web seperti scrollbar atau window frame,menghindari side scrolling
    4.Seorang desainer memutuskan berapa banyak kolom yang dibutuhkan
    5.Lebar kolom untuk grid ditentukan oleh lebar keseluruhan dibagi dengan jumlah kolom
    6.Jarak antar kolom ditambahkan,memberikan pemisah antar elemen

  46. Nama : Andree Panjaitan
    NIM : 11419014
    Kelas : 42 TRPL1

    Whitespace
    whitespace adalah suatu bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.akan tetapi halaman kosong tersebut tidak harus berwarna putih.

    Pentingnya Whitespace
    – Menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    – Membuat layout dapat di scan
    – Memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukannya dengan cepat.

    Alignment
    – Menyelaraskan elemen secara horizontal dan vertical
    – Berkontribusi pada simplicity
    – Posisi alignment yang lebih sedikit, berarti desain yang lebih sederhana.

    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan.
    Sistem grid juga berfungsi untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text.

    Alasan Menggunakan Grid
    – Grid dapat menciptakan kontinuitas pada urutan halaman.
    – Grid alat yang ampun mengatur informasi dan menyusun halaman.
    – Dalam single-page, grid membantu menciptakan harmonisasi visual.
    – Bagi pembaca web, memungkinkan pembaca untuk menelusuri konten dengan mudah.

    Elemen yang terdapat pada Grid
    1. Coloumns
    2. Modules
    3. Margins
    4. Spatial Zones
    5. Flowlines
    6. Markes

  47. Nama : Revi Angeli Siahaan
    NIM : 11419054

    – Whitespace
    Whitespace merupakan bagian dari halaman yang dibiarkan kosong, namun bukan berarti halaman tersebut harus berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat.
    – Alignment
    Berkontribusi pada simplicity untuk menyelaraskan elemen secara horizontal dan vertical.
    – Sistem Grid
    Sistem grid merupakan cara menciptakan keseimbangan, mengatur elemen- elemen desain dari space dalam suatu desain. Alasan menggunakan grid yaitu:
    • Dapat menciptakan kontinuitas pada urutan halaman
    • Alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat.
    • Dalam single page dapat membantu desainer menciptakan harmonisasi visual.
    • Memungkinkan pembaca untuk menelusuri konten dengan mudah.
    Ada beberapa elemen grid yaitu columns, modules, margins, spatial zones, flowlines dan markers. Ada 5 diagram dasar grid yaitu:
    • Single Colum Grid : untuk teks yang berjalan terus menerus seperti esai
    • Two Column Grid : untuk mengontrol banyak teks
    • Multicolumn Grid : menggabungkan banyak kolom dengan lebar bervariasi, berguna untuk majalah
    • Modular Grid : penggabungan kolom vertical dan horizontal yang mengatur struktur menjadi chunk ruang yang kecil, terdapat di koran, kalender
    • Hierarchical Grid : memecah halaman menjadi zona-zona.

  48. Nama: Jerry Andrianto Pangaribuan
    NIM: 11419046
    Kelas: 42TRPL2

    Whitespace
    – Bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong, atau ruamh kosong pada sebuah halaman.
    – bukan berarti ruang tersebut harus berwarna putih

    Pentingnya whitespace
    – menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki.
    – membuat layout yang dapat di scan
    – memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat.

    Alignment
    – menyelaraskan elemen secara horizontal dan vertical
    – berkontribusi pada simplicity
    – posisi alignment yang lebih sedikit berarti desain yang lebih sederhana.

    Sistem Grid
    – cara menciptakan keseimbangan
    – mengatur elemen-elemen desain dan space dalam suatu desain.
    – menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Sistem grid dapat digunakan untuk mendefinisikan:
    – lebar nargin
    – proporsi area pada sebuah halaman
    – jumlah dan ukuran kolom
    – posisi gambar
    – heading
    – body text
    – penempatan nomor halaman pada footnote

    Elemen Grid
    1. Columns
    2. Modules
    3. Margins
    4. Spatial zones
    5. Flowlines
    6. Markers

    Diagram dasar grid
    1. Single column grid
    2. two column grid
    3. multicolumn grid
    4. modular grids
    5. hierarchical grids

  49. Nama : Cyntia Evelin Simamora
    NIM : 11419065
    Kelas : 42TRPL2

    3. Whitespace merupakan bagian dari halaman yang dibiarkan kosong, namun bukan berarti halaman tersebut harus berwarna putih. Whitespace penting untuk menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki dan memungkinkan user untuk men-scan informasi dalam menemukan apa yang dicari dengan cepat.

    4. Alignment adalah keselarasan elemen secara horizontal dan vertical. alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    – Sistem Grid
    Sistem grid merupakan salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain.
    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

  50. Nama : Michael Binsar Tua Sinaga
    NIM : 11419012
    Kelas : 42 TRPL 1

    LAYOUT 2
    Whitespace
    Bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong, atau ruang kosong pada sebuah halaman.
    Bukan berarti ruang tersebut harus berwarna putih.
    Contoh: Google
    Pentingnya Whitespace :
    1. Menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    2. Membuat layout yang dapat di-scan

    Alignment
    -> berkontribusi pada simplicity desain.Posisi alignment yang lebih sedikit berarti
    desain yang lebih sederhana.

    Sistem Grid
    Salah satu cara tertua untuk menciptakan keseimbangan dengan cara mengatur
    elemen-elemen desain dan space dalam suatu desain.Jadi sistem grid ini menyelaraskan
    elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Alasan kita harus menggunakan Grid :
    -Grid menciptakan kontinuitas pada urutan halaman
    -Grid adalah alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat
    -Dalam single-page,grid dapat membantu desainer menciptakan harmonisasi visual dan
    menghubungkan beragam komposisi elemen
    -memungkinkan pembaca untuk menelusuri konten dengan mudah

    elemen dari grid :
    -> Columns
    -> Modules
    -> Margins
    -> Spatial zones
    -> Flowlines
    -> Makers

  51. Nama : Nazir Manahan Manurung
    Nim : 11419020
    Kelas : 42 TRPL 1

    Layout 2
    WhiteSpace
    whitespace adalah suatu bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.

    Pentingnya whitespace, yakni:
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat
    Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.

    Alignment
    Alignment adalah keselarasan elemen secara horizontal dan vertical. alignment berkontribusi pada simplicity. Posisi alignment yang lebih sedikit menandakan desain yang lebih sederhana.

    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan. Yaitu dengan cara mengatur elemen elemen desain dan space dalam satu desain.Sistem grid menyelaraskan elemen desain melalui penggunaan kolom yang menciptkan ruang.
    Sistem grid digunakan untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text ,dll.
    Alasan menggunakan Grid adalah:
    1.Grid mengatur dan menyusun halaman dengan cepat.
    2.Grid menciptakan kontinuitas pada urutan halaman
    3.Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    4. Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

  52. Nama : Berliana L. Simamora
    NIM : 11419016
    Kelas : 42 TRPL 1

    Layout 2
    Whitespace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong, atau ruang kosong pada sebuah halaman.
    Pentingnya white space:
    – Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    – Membuat layout yang dapat di scan
    – Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat

    Dalam desain grafis, yang dimaksud dengan simetri adalah sejumlah komponen yang sama di setiap sisi sumbu.

    Alignment = keselarasan elemen secara horizontal dan vertical. Alignment berkontribusi pada simplicity sebuah design.

    Sistem Grid Salah satu cara tertua untuk menciptakan keseimbangan.
    o Mengatur elemen-elemen desain, dan space dalam suatu desain.
    o Menyelaraskan elemen desain dengan jelas melalui penggunaan kolom yang menciptakan ruang

    Sistem grid dapat digunakan untuk mendefinisikan :
     lebar margin
     proporsi area pada sebuah halaman
     jumlah dan ukuran kolom
     posisi gambar
     heading
     body text
     penempatan nomor halaman dan footnote.

    Alasan menggunakan grid yaitu:
    o Dapat menciptakan kontinuitas pada urutan halaman
    o Alat yang ampuh untuk mengatur informasi dan menyusun halaman dengan cepat.
    o Dalam single page, grid dapat membantu desainer menciptakan harmonisasi visual dan menghubungkan beragam komposisi element
    o Memungkinkan pembaca untuk menelusuri konten dengan mudah.

    elemen grid :
     columns,
     modules,
     margins,
     spatial zones,
     flowlines
     markers.

    Diagram dasar grid:
    • Single Colum Grid : digunakan untuk teks yang berjalan terus menerus
    • Two Column Grid : digunakan untuk mengontrol banyak teks atau untuk menyajikan berbagai jenis informasi dalam kolom terpisah.
    • Multicolumn Grid : menggabungkan banyak kolom dengan lebar yang bervariasi, berguna untuk majalah atau web.
    • Modular Grid : dilakukan penggabungan kolom vertikal dan horizontal yang mengatur struktur menjadi chunk ruang yang lebih kecil.
    • Hierarchical Grid : memecah halaman menjadi zona-zona.

  53. Layout 2:

    3.Whitespace
    Whitespace merupakan bagian dari sebuah halaman yang tidak ditandai yang dibiarkan kosong namun masih merupakan bagian tersebut.
    dan tidak harus berwarna putih. Whitespace sangan penting karena mencipatakan hubungan yang mengarah ke hirarki,
    layout yang dapat di scan dan user dapat menscan informasi yang penting-penting, juga menghindari visual noise.

    4.Aligment
    Menyelaraskan elemen secara horizontal dan vertikal, berkontribusi pada simplicity dan membuat desain yang lebih sederhana

    5. Sistem Grid
    Cara untuk menciptakan keseimbangan dengan cara mengatur elemen desain dan space, menyelaraskan elemen desain melalui
    penggunaan kolom yang dapat menciptakan ruang.Sistem grid dapat digunakan dalam mendefinisikan lebar margin,
    proporsi area, jumlah dan ukuran kolom, posisi gambar, heading, body text dan penempatan nomor halaman dan footnote.
    Alasan mengapa menggunakan grid yaitu:
    – grid dapat menciptakan urutan halaman
    – Grid alat yang dapat mengatur informasi dan menyusun halaman dengan cepat
    – Grid membantu desainer menciptakan harmonisasi visual dan menghubungkan komposisi elemen
    – User dapat menyelusuri konten dengan mudah, dan berurutan

    Elemen pada Grid terdiri dari Columns,Modules,Margins,Spatial Zones,Flowlines dan Markers.
    Ada 5 diagram dasar grid yaitu, singel column grid (teks yg banyak), two column grid, multi column grid,
    modular grid dan hierarchical grid(memecah halaman).

  54. Nama : John Ryan Siallagan
    NIM : 11419013
    Kelas : 42TRPL1

    Whitespace => Bagian yang tidak ditandai, diberikan ruang kosong pada sebuah halaman. Ruang tidak diharuskan berwarna putih
    Fungsi Whitespace :
    – Menciptakan hubungan yang mengarahkan sistem ke hirarki
    – Membuat layout yang dapat di scan.
    – Memungkinkan user untuk menscan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan tepat.

    Alignment :
    – Menyelaraskan elemen secar horizontal dan vertical
    – Berkontribusi pada simplicity
    – Posisi alignment yang sedikit, berarti desain yang lebih sederhana.

    Sistem Grid :
    – Cara menciptakan keseimbangan
    – Mengatur elemen elemen desain dan space dalam suatu desain
    – Menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang.

    Fungsi Sistem Grid :
    – Menciptakan kontinuitas pada urutan halaman
    – Mengatur informasi dan menyusun halaman dengan cepat
    – Menciptakan harmonisasi visual melalui penggabungan beberapa elemen
    – Pembaca dimungkinkan dapat menelusuri dengan mudah.

    Elemen Grid:
    – Columns
    – Modules
    – Margins
    – Spatial zones
    – Flowlines
    – Markers

    Diagram dasar grid :
    – Single Column Grid => Teks yang terus berjalan seperti essai
    – Two Colum Grid => Menyajikan banyak teks dengan meletakkannya dalam beberapa kolom
    – Multi Column Grid => Memberikan fleksibilitas lebih daripada single dan two column grid.
    – Modular Grid => Menyajikan informasi yang lebih kompleks seperti berita dan tabel atau yang lainnya yang disusun lebih kompleks
    – Hierarchical Grid => Memecah halaman menjadi zona zona.

  55. Nama : Yonatan A.P.L Tobing
    NIM : 11419038
    Kelas : 42 TRPL-2

    Whitespace
    -Bagian dari halaman yang tidak ditandai,bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman
    -bukan berarti ruang tersebut harus berwarna putih
    -menciptakan hubungan yang membentuk sistem yang mengarah ke hirarki
    -membuat layout yang dapat discan
    -memungkinkan user untuk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat
    Balance & symmetry jumlah komponen yang sama dari setiap sumbu(seimbang)

    Aligment

    -Menyeleraskan elemen secara horizontal dan vertical
    -berkontribusi pada simplicity
    -posisi alignment yang lebih sedikit berarti desain yang lebih sederhana

    Sistem Grid
    Cara menciptakan keseimbangan,mengatur elemen-elemen desain dan space dalam suatu desain dan menyelaraskan elemen desain melalui penggunaan kolom yang menciptakan ruang

    • Sistem grid dapat digunakan untuk mendefinisikan:
    -lebar margin
    -proporsi area pada sebuah halaman
    -jumlah dan ukuran kolom
    -posisi gambar
    -heading
    -body text
    -penempatan nomor halaman dan footnote
    • Alasan menggunakan grid:
    -Menciptakan kontinuitas pada urutan halaman
    -Alat yang ampuh untuk mengatur informasi dan menyusun halaman yang cepat
    -Dalam single-page, grid dapat membantu desainer menciptakan harmonisasi visual dan mengubungkan beragam komposisi elemen
    -Bagi pembaca web : dalam dokumen sekuensial,memungkinkan pembaca untuk menelusuri konten dengan mudah

    • Elemen Grid
    1.Columns
    2.Modules
    3.Margins
    4.Spatial zones
    5.Flowlines
    6.Markers

    • Diagram Dasar Grid
    1.Single column grid
    2.Two column grid

    3.Multicolumn grids
    4.Modular grids
    5.Hierarchical grids

    • Fixed-Width Grid untuk Web
    1.Desainer harus terlebih dahulu menentukan lebar desain,yang ditentukan oleh resolusi monitor tager user
    2.Sebagian besar web masih dioptimalkan untuk ukuran 1024 x 768 pixel,sehingga sebagian besar grid web berukuran lebar antara 950-990 pixel
    3.Lebarnya dikurangi 25-50 pixel dari resolusi monitor adalah untuk mengakomodir elemen web seperti scrollbar atau window frame,menghindari side scrolling
    4.Seorang desainer memutuskan berapa banyak kolom yang dibutuhkan
    5.Lebar kolom untuk grid ditentukan oleh lebar keseluruhan dibagi dengan jumlah kolom
    6.Jarak antar kolom ditambahkan,memberikan pemisah antar elemen

  56. Nama :Michael Situmorang
    NIM :11419005
    Kelas :42TRPL1

    Whitespace
    Whitespace merupakan bagian dari sebuah halaman yang tidak ditandai yang dibiarkan kosong namun masih merupakan bagian tersebut.
    dan tidak harus berwarna putih. Whitespace sangan penting karena mencipatakan hubungan yang mengarah ke hirarki,
    layout yang dapat di scan dan user dapat menscan informasi yang penting-penting, juga menghindari visual noise.

    3. Alignment =>keselarasan elemen secara horizontal dan vertical. alignment berkontribusi pada simplicity.(kesederhanaan pun bisa memuaskan pandangan)

    4. Grid =>dalam grid ini, semua sebenarnya bisa diseimbangkan, apapun jenisnya, seperti pada paragraf yg awalnya 1 kolom, dapat menjadi 2 kolom, 4 atau berapapun.
    Elemen Grid
    1.Columns
    2.Modules
    3.Margins
    4.Spatial zones
    5.Flowlines
    6.Markers

  57. WhiteSpace adalah bagian dari halaman yang tidak ditandai, bagian yang dibiarkan kosong atau ruang kosong pada sebuah halaman.Bukan berarti halaman kosong tersebut harus berwarna putih.

    Pentingnya Whitespace adalah :
    1. Menciptakan Hubungan yang membentuk sistem yang mengarah ke hierarki.
    2. Membuat layout yang dapat di scan
    3. Memungkinkan user unutk men-scan informasi dan kelompok informasi untuk menemukan apa yang mereka cari dengan cepat Balance dan Symetry adalah sejumlah komponen yang sama disetiap suku.

    Alligment
    – Menyelaraskan elemen secara horizontal dan vertical
    – Berkontribusi pada simplicity
    – Posisi alignment yang lebih sedikit berarti desain yang lebih sederhana.

    Sistem Grid
    Sistem grid adalah salah satu cara tertua untuk menciptakan keseimbangan.
    Sistem grid juga berfungsi untuk mendefinisikan lebar margin, proporsi area , jumlah dan ukuran kolom, posisi gambar, heading body text.

    Alasan menggunakan Grid
    – Grid mengatur dan menyusun halaman dengan cepat.
    – Grid menciptakan kontinuitas pada urutan halaman.
    – Grid dapat menciptakan harmonisasi visual dan menggabungkan beragam komposisi elemen.
    -Grid memungkinkan pembaca untuk menelusuri konten dengan mudah.

Comments are closed.