“ ANALISIS PERBANDINGAN WEBSITE E-LEARNING ”

KIDS-E-LAND DAN PENDIDIKAN.NET

Disusun Oleh :

1. HARASHTA MAIDA (10108911)

2. HELMI SHATRY (10108938)
3. HIDAYAT SIDDIQ KURNIAWAN (10108972)
4. HUTAMA AUDI (10108976)

Kelas : 3KA15

 
UNIVERSITAS GUNADARMA
1. METAFORA
 
Aplikasi dari nama atau deskripsi istilah objek lain yang tidak dapat diartikan secara harafiah. Menghubungkan
presentasi dan elemen-elemen visual dengan item-item yang berkaitan. Metafora akan membuat para pengunjung
seolah-olah berada di tempat yang sebenarnya, atau bisa dikatakan juga bahwa metafora dibuat mirip seperti
tempat yang dikunjungi. Contohnya, website suatu toko online yang memiliki metafora, dimana pengunjung
dibawa ke tempat seolah-olah mereka benar ada di toko online tersebut.

2. CLARITY
 
Harus ada alasan yang kuat/masuk akal dan jelas mengapa menggunakan setiap elemen yang berada dalam suatu
interface yang kita buat,contohnya dalam peletakan suatu button,pembuat harus memiliki alasan mengapa
diletakkan di tempat tersebut. Penggunaan elemen yang lebih sedikit akan lebih baik. Penggunaan background
berwarna putih dianjurkan untuk memimpin mata dan membuat mata tidak lelah dengan aktifitas elemen yang
ada pada suatu website.

3. KONSISTENSI
 
Keseragaman dalam suatu program aplikasi. Konsistensi dalam tampilan, pewarnaan, gambar, ikon, typography
(model form yang digunakan pada suatu website), teks, dll. Harus ada konsistensi baik dalam layar maupun antar
layar. Dan harus selalu ada metafora dimanapun juga. Setiap platform mungkin memiliki panduannya.

4. ALIGMENT
 
Untuk perataan dapat digunakan rata kiri, kanan atau tengah. Pada umumnya suatu teks pada website dimulai
dari kiri atas (left alignment), dimana left alignment akan mengijinkan mata untuk menguraikan tampilan dengan
lebih mudah. Selain itu dengan menggunakan bantuan garis akan membantu dalam hal perataan. Sembunyikan
garis horizontal dan vertical untuk membantu mengalokasikan komponen window/jendela. Garis juga membantu
menghubungkan hal-hal yang berhubungan dan memudahkan perataannya.
 
5. PROXIMITY
 
Item-item yang berkaitan ditampilkan bersama pasti memiliki hubungan karena jarak yang jauh mengimplikasikan bahwa tidak ada
hubungan antara item-item tersebut.

6. KONTRAS

Kontras adalah perbedaan antara dua buah atau lebih elemen. Dengan memakai teknik kontras, seorang designer dapat
menciptakan daya tarik visual dan perhatian tunggal dari pengunjung website. Bayangkanlah apabila sebuah halaman website
memiliki gaya dan penampakan yang sama, maka halaman website tersebut menjadi membosankan dan tanpa daya tarik. Bahkan
isinyapun menjadi sulit untuk dicerna, karena itulah membuat elemen menjadi kontras adalah salah satu dari web design yang
efektif. Kontras dalam sebuah halaman website dapat dibuat dengan memainkan 3 aspek design yaitu: warna, bentuk dan posisi.
A. Kontras dalam warna
B. Kontras dalam bentuk ukuran
C. Kontras dalam posisi

7. WARNA
 
Warna merupakan pertimbangan emosional, karena variasi warna dapat menyebabkan
emosi yang berbeda pada tiap orang.

8. ICON
 
A. Mempresentasikan obyek atau tindakan yang mudah dikenal secara luas
B. Mewakili obyek atau tindakan dalam cara yang lazim dan dikenali
C. Batasan jumlah icon-icon yang berbeda
D. Buat icon yang menonjol dari latar belakang
E. Pastikan bahwa icon-icon yang telah diseleksi satu persatu secara jelas dapat dilihat jika dikelilingi dengan icon-icon yang tidak
terseleksi.
F. Buat setiap icon berbeda
G. Buat anggota-anggota icon-icon yang harmonis dari kumpulan icon
H. Hindari perincian yang berlebihan
 Metafora
Web “Kids-E-Land” Web “Pendidikan.net”

Kalangan yang di tujukan untuk Untuk tampilan pendidikan yang

website ini tidak terlalu jelas. Di ditunjukkan untuk pelajar .
karenakan bila di tunjukkan untuk Tampilannya memudahkan para
anak-anak pra sekolah atau baru mulai pengguna untuk mencari informasi
belajar mengenal huruf, dapat yang dibutuhkan. Kekurangannya
dikatakan bahwa penggunaan website penggunaan warna yang teralu minim
ini kurang baik karena penggunaannya menyebabkan tampilan web ini kurang
menggunakan kata dan mereka (anak- menarik.
anak) belum mengerti apa itu huruf
jadi bila disimpulkan penggunaan
website ini memerlukan bantuan
pendamping sehingga mereka baru
dapat mengaksesnya.
 Clarity
Web “Kids-E-Land” Web “Pendidikan.net”

Warna yang digunakan dibuat Warna yang di gunakan adalah merah

berwarna-warni untuk menarik dan putih pewarnaannya simple namun
perhatian para penggunanya yaitu sedikit kurang menarik .sehingga
anak-anak.Tataletak tombol nya rapih terlihat teralu monoton tombol yang di
tidak berantakan Pengistirahatan mata gunakan di buat simple agar simetris
dalam web ini tegolong baik karena dengan tampilan web nya. Pada
tidak banyak tulisan yang element pengistirahatan mata web ini
memusingkan mata dan setiap kita terkesan kurang karena teralu banyak
ingin mengakses video nya ada jeda terdadapat tulisan atau padat tulisan.
yang membuat mata sedikit Web ini tergolong simple dan elegan.
beristirahat. Web ini tergolong
sederhana dan menarik.
 Konsistensi
Web “Kids-E-Land”
Konsistensi atau kesinambungan pada
web Kids-E-Land tergolong baik karena
kesinambungan pada tampilan awal
atau muka dan tampilan setelah masuk
ke dalam salah satu pilihan yang di tuju
sama. Tombol dan pilihan yang adapun
tidak berubah. Warna warni pada web
ini yang memang di tujukan pada anak-
anak juga sangat cocok karena
menggambarkan dunia anak yang
berwarna.
Web “Pendidikan.net”
Posisi tulisan pada web pendidikan.net
tergolong baik karena terlihat teratur
dan tertata rapi seperti pada web
kidseland dalam hal tampilan,
pewarnaan,ikon, serta typography yang
digunakan. Dalam hal tampilan dan
pewarnaan, web ini menyesuaikan para
pengunjung web yang sebagian besar
merupakan pelajar.
 Alignment
Web “Kids-E-Land” Web “Pendidikan.net”

Posisi tulisan pada web kids e land Pada web pendidikan.net tata letak
tergolong baik karena terlihat teratur tulisan terlihat jelas dan teratur dari kiri
dan tertata rapi baik pada tampilan ke kanan dan atas ke bawah. Sehingga
awal atau muka dan tampilan di memudahkan pemakai dalam
dalamnya sehingga tidak membuat mengaksesnya.
penggunanya khususnya anak-anak
merasa nyaman.
 Proximity
Web “Kids-E-Land” Web “Pendidikan.net”

Untuk web ini, dalam hal Untuk Web pendidikan.net

pengelompokan yang ingin di pengelompokannya baik yang
tampilkan tergolong baik dan sesuai membuat pengguna mudah untuk
dengan apa yang dibutuhkan dalam mencari artikel dan item-item yang di
melakukan pengarahan, dalam arti butuhkan.
pilihan yang terdapat didalam menu
tersebut sesuai dengan yang
dimaksudkan dengan menu tersebut.
 Contrast
Web “Kids-E-Land” Web “Pendidikan.net”

Pada website kids-e-land teratur dan Sedangkan kalau kontras pada

dapat membuat anak-anak sebagai pendidikan.net terlihat kurang menarik
usernya lebih merasakan kenyamanan karena terlalu mengunakan warna-
dalam penggunaan wabsite ini. warna yang terlalu terang.
 Warna
Web “Kids-E-Land”
Pemberian warna pada website Kids-E-
Land cukup soft karena anak-anak
menyukai warna yang lembut, dan
cerah sehingga membangkitkan para
anak-anak untuk belajar dan
mengetahui hal-hal baru.
Web “Pendidikan.net”
Pewarnaan pada website
pendidikan.net di donimasi oleh warna
merah dan putih yang mengartikan
semangat dan energi untuk para
pemuda giat belajar, dan warna putih
yang mengartikan kemurnian para
pembaca untuk memberi inspirasi
baru.
 Icon
Web “Kids-E-Land”
Icon balita pada kids-e-Land ini cukup
mengesankan para anak-anak bayi
karena web ini di khususkan untuk
anak-anak pre-school agar lebih
mengetahui tentang berbagai
informasi, dan juga penulisan kata-kata
Kids-E-Land di kiri atas.
Web “Pendidikan.net”
Icon pada pendidikan.net yang terdiri
atas buku-buku, bola dunia, dan poto
dokumenter yang mengartikan bahwa
kita itu harus membaca buku dimana
buku adalah jendela ilmu, jika bola
dunia membuat para pembaca untuk
lebih giat lagi belajar agar bisa Go
Global, sedangkan foto dokumenter
mengartikan pelajar-pelajar yang giat
meraih prestasi.