Minggu, 07 Juni 2015

Error Prevention – shopious.com

Error Prevention adalah sistem didesain sehingga mencegah pengguna melakukan kesalahan dalam penggunaan sistem. Hal ini dapat dilakukan dengan menggunakan pilihan konfirmasi.

Berikut ini beberapa kesalahan yang saya amati dari website shopious.com berdasarkan prinsip Error Prevention.

1. Tidak ada konfirmasi ketika pengguna membuat akun

Pada website shopious.com, ketika pengguna ingin membuat akun maka pengguna akan dialihkan ke halaman buat akun. Ketika pengguna memasukkan database dengan email yang salah, lalu pengguna memilih “Daftar”. Pengguna tetap berhasil membuat akun walaupun email yang dimasukkan salah. Hal ini dikarenakan tidak adanya konfirmasi pendaftaran. Pengguna tetap dialihkan ke halaman dimana pengguna telah berhasil login dan pengguna juga bisa melakukan update profil.

Gambar 1  Halaman ketika pengguna membuat akun dan memasukkan email yang salah

Gambar 2  Pengguna telah berhasil membuat akun dan login tanpa adanya konfirmasi pendaftaran

Gambar 3  Pengguna dapat melakukan update profil walaupun email yang dimasukkan salah dan tidak ada konfirmasi pendaftaran

Solusi dari permasalahan diatas adalah sebaiknya ketika pengguna melakukan pendaftaran akun, adanya konfirmasi melalui email dengan cara sistem mengirim kode verifikasi. Pengguna harus memasukkan kode verifikasi tersebut jika ingin melanjutkan pendaftaran akun. Jika email yang dimasukkan salah maka pengguna tidak akan bisa melakukan pendaftaran akun, karena tidak ada kode verifikasi yang dikirim oleh sistem.

Dalam hal ini severity rating adalah 3.

---------------------------------------------------------------------------------------------------------------

2. Kesalahan yang tidak terdeteksi ketika pengguna memasukkan id yang salah pada pendaftaran toko

Pada website shopious.com, ketika pengguna ingin mendaftarkan toko untuk di promosikan barang-barangnya, maka pengguna harus memasukkan id instagram toko. Namun, terdapat kesalahan pada sistem ketika pengguna memasukkan id instagram yang salah/tidak sesuai. Sistem tetap memproses permintaan pengguna walaupun id Instagram yang dimasukkan tidak benar.

Gambar 4  Tampilan awal sebelum pengguna memasukkan id instagram

Gambar 5  Tampilan ketika pengguna memasukkan id instagram yang tidak sesuai

Solusi dari permasalahan diatas adalah sebaiknya sistem mempunyai konfirmasi kebenaran dari id yang dimasukkan oleh pengguna. Sistem dapat ditambahkan form berisi email dan nomor telepon jika pengguna ingin mendaftarkan toko pada website tersebut. Sehingga pengguna juga tidak asal memasukkan id instagram saja.

Dalam hal ini severity rating adalah 2.

Sekian pembahasan saya mengenai Error Prevention dari website shopious.com. Terima kasih.

Consistency and Standards – shopious.com

Consistency and Standards adalah prinsip perancangan interaksi antarmuka dimana pengguna tidak perlu mempertanyakan lagi mengenai perbedaan pemahaman pada sebuah kata dan kalimat, situasi dan aksi. Konsistensi merupakan hal penting dalam sebuah website.

Berikut ini beberapa kesalahan yang saya amati dari website shopious.com berdasarkan prinsip Consistency and Standards.

1. Penamaan menu navigasi yang tidak konsisten

Pada website shopious.com, terdapat menu navigasi dengan penamaan yang tidak konsisten. Ketika menu “Kategori” di klik pada menu navigasi, terdapat perbedaan penamaan dengan judul tab. Pada judul tab penamaan bukanlah “Kategori” melainkan “Koleksi”.

Gambar 1  Penamaan yang tidak konsisten

Solusi dari permasalahan diatas adalah sebaiknya kekonsistenan dalam bahasa lenih diperhatikan. Misalnya dalam kasus diatas, jika pada menu navigasi ditulis “Kategori” maka pada judul tab juga ditulis “Kategori”.

Dalam hal ini severity rating adalah 1.

---------------------------------------------------------------------------------------------------------------

2. Penggunaan bahasa yang tidak konsisten

Pada website shopious.com, pada menu navigasi terdapat penggunaan bahasa yang tidak konsisten. Misalnya pada menu navigasi “Daftar Toko” menggunakan Bahasa Indonesia, namun pada menu navigasi “Inspirasi Style” menggunakan Bahasa Indonesia dan Bahasa Inggris. Hal ini membuat tampilan menjadi tidak konsisten.

Gambar 2  Penggunaan Bahasa yang tidak konsisten

Solusi dari permasalahan diatas adalah sebaiknya dalam penamaan menu navigasi menggunakan 1 bahasa saja. Misalnya menggunakan Bahasa Indonesia, sehingga tampilan menjadi lebih konsisten. Selain itu pada website dapat ditambahkan pemilihan bahasa seperti Bahasa Inggris, sehingga tampilan menjadi lebih bagus.

Dalam hal ini severity rating adalah 1.

---------------------------------------------------------------------------------------------------------------

3. Penggunaan link yang terlihat seperti teks biasa

Ketika pengguna mengunjungi website shopious.com, pengguna akan menemukan beberapa link yang terlihat seperti teks biasa. Hal tersebut akan membuat pengguna bingung, karena link tidak terlihat seperti sebuah link karena pewarnaan yang sama dengan teks.

Gambar 3  Penggunaan link yang terlihat seperti teks biasa

Solusi dari permasalahan diatas adalah sebaiknya membuat pewarnaan yang konsisten, sehingga pengguna mudah membedakan mana link dan mana teks. Warna teks biasa dapat menggunakan warna hitam, sedangkan teks yang berupa link dapat menggunakan warna biru sehingga terlihat sebagai sebuah link.

Dalam hal ini severity rating adalah 2.

Sekian pembahasan saya mengenai Consistency and Standards dari website shopious.com. Terima kasih.

Aestethic and Minimalist Design – shopious.com

Aestethic and Minimalist Design adalah setiap dialog yang ada seharusnya tidak berisi informasi yang tidak relevan atau jarang digunakan. Setiap unit tambahan pada dialog bersaing dengan unit-unit informasi yang relevan dan akan mengurangi tingkat visibilitasnya terhadap yang lain.

Berikut ini beberapa kesalahan yang saya amati dari website shopious.com berdasarkan prinsip Aestethic and Minimalist Design.

1. Penggunaan whitespace yang terlalu banyak

Pada website shopious.com, penggunaan whitespace sudah cukup baik. Tidak terlalu rapat dan tidak terlalu renggang. Namun terdapat pemborosan whitespace ketika pengguna memilih menu halaman. Hampir di semua halaman, terdapat penggunaan whitespace yang terlalu banyak. Hal ini tidak baik bagi sebuah interface, karena whitespace tersebut menjadi tidak berguna dan menghabiskan tempat. Selain itu, penggunaan whitespace yang berlebihan membuat tampilan menjadi tidak bagus dilihat.

Gambar 1  Whitespace untuk setiap halaman yang terlalu banyak

Solusi dari permasalahan diatas adalah sebaiknya penggunaan whitespace yang berlebihan dapat dikurangi. Halaman yang kosong tersebut dapat diisi dengan gambar yang berkaitan dengan halaman, sehingga halaman tidak terlihat sepi dan monoton.

Dalam hal ini severity rating adalah 1.

---------------------------------------------------------------------------------------------------------------

2. Tata Letak yang tidak sesuai

Pada website shopious.com, ketika pengguna membuka halaman koleksi, terdapat tampilan dengan tata letak yang masih kurang baik. Pada tampilan dari halaman koleksi tersebut, semua kategori pilihan terlihat saling tergabung dan tidak ada pemisah yang jelas. Tata letak yang tidak sesuai tersebut membuat tampilan menjadi tidak bagus dilihat dan membuat pengguna bingung.

Gambar 2  Tata letak yang tidak sesuai dan membingungkan pengguna

Solusi dari permasalahan diatas adalah sebaiknya untuk setiap pilihan dikelompokkan berdasarkan kategori masing-masing. Setiap kelompok untuk masing-masing kategori dapat diberi box, sehingga terdapat pemisah yang jelas. Hal ini dapat membuat tampilan lebih bagus dilihat dan lebih memudahkan pengguna.

Dalam hal ini severity rating adalah 2.

---------------------------------------------------------------------------------------------------------------

3. Tata huruf dan tata letak yang tidak sesuai

Pada website shopious.com, ketika pengguna membuka halaman deskripsi barang, terdapat tampilan dengan tata huruf dan tata letak yang masih kurang baik. Pada tampilan deskripsi barang, menggunakan tulisan yang di “bold”, hal ini dirasa kurang tepat. Selain itu, semua tipe dari deskripsi barang saling tergabung dan tidak ada pemisah yang jelas. Tata huruf dan tata letak yang tidak sesuai tersebut membuat tampilan menjadi tidak bagus dilihat dan membuat pengguna bingung.

Gambar 3  Tata huruf dan tata letak yang tidak sesuai

Solusi dari permasalahan diatas adalah sebaiknya deskripsi barang tidak dibuat dalam satu kalimat tetapi dikelompokkan berdasarkan tipe deskripsi, sehingga tidak membingungkan pengguna. Selain itu, deskripsi barang sebaiknya tidak menggunakan tulisan yang di “bold”. Hal ini dirasa dapat membuat tampilan menjadi lebih bagus dan sesuai.

Dalam hal ini severity rating adalah 1.

Sekian pembahasan saya mengenai Aestethic and Minimalist Design dari website shopious.com. Terima kasih.

Sabtu, 06 Juni 2015

Flexibility and Efficiency of Use – shopious.com

Flexibility and Efficiency of Use adalah bagaimana membuat sebuah sistem yang mengakomodasi pengguna yang sudah ahli dan pengguna yang masih pemula.  Sistem harus mempermudah pengguna melakukan task-nya dengan lebih cepat dan efisien.

Berikut ini beberapa kesalahan yang saya amati dari website shopious.com berdasarkan prinsip Flexibility and Efficiency of Use.

1. Sistem tidak menampilkan stock barang pada deskripsi  barang

Website yang baik harus mampu mempermudah pengguna melakukan tasknya dengan lebih cepat. Pada website shopious.com, ketika pengguna melihat deskripsi barang, stock dari barang tersebut tidak ditampilkan. Hal ini dirasa akan membingungkan pengguna apakah stock barang masih tersedia atau barang sedang kosong.


Gambar 1  Tidak terdapat stock barang pada deskripsi barang

Solusi dari permasalahan diatas adalah sebaiknya untuk setiap deskripsi barang, ditambahkan stock barang, sehingga pengguna tahu apakah barang masih tersedia atau barang sedang kosong. Hal ini akan lebih memudahkan pengguna dan lebih efisien.

Dalam hal ini severity rating adalah 1.

---------------------------------------------------------------------------------------------------------------

2. Sistem tidak menampilkan harga barang pada deskripsi  barang

Website yang baik harus mampu mempermudah pengguna melakukan task-nya dengan lebih cepat. Pada website shopious.com, ketika pengguna melihat deskripsi barang, pada beberapa gambar harga dari barang tersebut tidak ditampilkan. Hal ini dirasa akan menyulitkan pengguna, karena pengguna harus menghubungi penjual terlebih dahulu untuk mengetahui harga dari barang. Hal tersebut tidak fleksibel dan efisien bagi pengguna, karena untuk sebuah online shop harga barang sangatlah penting.


Gambar 2  Tidak terdapat harga barang pada deskripsi barang

Solusi dari permasalahan diatas adalah sebaiknya untuk setiap deskripsi barang menampilkan harga barang, sehingga pengguna tidak harus menghubungi penjual untuk mengetahui berapa harga barang tersebut. Hal ini akan lebih memudahkan pengguna dan lebih efisien.

Dalam hal ini severity rating adalah 3.

---------------------------------------------------------------------------------------------------------------

3. Tampilan barang yang terlalu banyak pada Home

Website yang baik harus mampu mempermudah pengguna melakukan task-nya dengan lebih cepat. Pada website shopious.com, halaman “home” dan halaman kategori digabung. Halaman tersebut menampilkan barang yang terlalu banyak, yaitu menampilkan barang untuk semua kategori. Hal tersebut membuat halaman terlalu panjang, sehingga pengguna harus melakukan scroll ke bawah.


Gambar 3  Halaman home yang panjang ke bawah

Solusi dari permasalahan diatas adalah sebaiknya halaman home dan halaman kategori dipisah. Pada halaman home sebaiknya hanya menampilkan beberapa barang terbaru saja, sehingga tampilan halaman home menjadi lebih enak dilihat dan tidak terlalu ramai. Selain itu, juga menghindari halaman yang panjang dan harus melakukan scroll ke bawah. Hal ini akan lebih memudahkan pengguna dan lebih efisien.

Dalam hal ini severity rating adalah 2.

Sekian pembahasan saya mengenai Flexibility and Efficiency of Use dari website shopious.com. Terima kasih.

Visibility of System Status - shopious.com

Visibility of System Status adalah prinsip perancangan interaksi antarmuka dimana sistem harus selalu menginformasikan kepada pengguna mengenai apa yang sedang terjadi, melalui pesan yang baik dan waktu yang sesuai.

Berikut ini beberapa kesalahan yang saya amati dari website shopious.com berdasarkan prinsip Visibility of System Status.

1. Pengguna tidak mengetahui halaman yang sedang diakses karena tidak ada informasi/penanda bahwa halaman sedang aktif

Website yang baik akan memberikan informasi kepada pengguna mengenai apa yang sedang dilakukan oleh pengguna. Ketika pengguna membuka website shopious.compengguna akan berada pada halaman utama dari website. Ketika pengguna memilih salah satu halaman misalnya “Kategori”, user akan dialihkan ke halaman “Kategori”. Namun, ketika pengguna telah berada di halaman tersebut, tidak terdapat informasi/penanda bahwa pengguna telah berada di halaman tersebut. Perbedaan hanya bisa dilihat pada url dari halaman tersebut.

Gambar 1  Halaman kategori tidak ada penanda bahwa halaman sedang aktif

Gambar 2  Halaman koleksi tidak ada penanda bahwa halaman sedang aktif

Tidak terdapat penanda halaman yang sedang aktif pada kedua halaman diatas. Sehingga tidak ada perbedaan halaman yang sedang diakses dengan halaman yang tidak diakses. Hal tersebut dirasa akan menyulitkan pengguna.

Solusi dari permasalahan tersebut adalah sebaiknya ketika pengguna sedang mengakses suatu halaman, terdapat informasi/penanda bahwa halaman tersebut sedang aktif, sehingga pengguna mengetahui halaman yang sedang diakses. Misalnya ketika pengguna membuka sebuah halaman, terdapat perbedaan warna pada menu navigasi dengan halaman yang tidak diakses. Pada website tersebut misalnya dengan memberikan perbedaan tulisan dengan “bold” atau memberikan warna yang berbeda. Selain itu juga bisa dengan memberikan penanda kotak pada menu navigasi yang sedang aktif.

Dalam hal ini severity rating adalah 2.

---------------------------------------------------------------------------------------------------------------

2. Pengguna tidak mengetahui bahwa sistem sedang loading, karena tidak terdapat penanda seperti throbber/progress bar

Website yang baik akan memberikan informasi/penanda kepada pengguna bahwa sistem sedang loading. Ketika pengguna melihat koleksi tas dari shopious.com, tidak terdapat penanda bahwa sistem sedang loading. Hal ini membuat pengguna tidak mengetahui bahwa permintaannya terhadap sistem sedang di proses untuk ditampilkan/tidak.

Gambar 3  Halaman tidak ada penanda ketika sistem sedang loading

Solusi dari permasalahan tersebut adalah sebaiknya ketika pengguna sedang mengakses koleksi barang, terdapat informasi/penanda bahwa gambar yang diakses sedang loading. Misalnya ketika pengguna melihat koleksi barang, terdapat “throbber” yang menandakan bahwa gambar yang akan ditampilkan sedang loading.

Dalam hal ini severity rating adalah 2.

Sekian pembahasan saya mengenai Visibility of System Status dari website shopious.com. Terima kasih.

Selasa, 12 Mei 2015

Interaksi Manusia-Komputer - Visualisasi Informasi

Berikut saya akan membahas tentang visualisasi informasi. Visualisasi Informasi adalah suatu metode penggunaan komputer untuk menemukan metode terbaik dalam menampilkan data untuk mengingat informasi dengan cara penerimaan alami manusia serta memberikan cara untuk melihat data yang sulit dilihat, sehingga peneliti bisa mengamati simulasi dan komputasi, juga memperkaya proses penemuan ilmiah dan mengembangkan pemahaman yang lebih dalam dan tak diduga, salah satu contohnya adalah dengan menampilkan data/informasi dalam bentuk gambar.

Data yang saya gunakan yaitu Jumlah Pegawai Negeri Sipil Menurut Tingkat Pendidikan dan Jenis Kelamin, Desember 2007 - Desember 2013. Tools yang saya gunakan untuk memvisualisasikan data tersebut adalah infogr.am.

Sumber data : Badan Pusat Statistika

Berikut tampilan dari visualisasi informasi yang saya kerjakan :
Jumlah Pegawai Negeri Sipil Menurut Tingkat Pendidikan dan Jenis Kelamin, Desember 2007 - Desember 2013



Senin, 30 Maret 2015

Komdat & Jarkom - Wget

Assalamu'alaikum Wr..Wb..

Wget utilitas adalah paket yang tersedia secara bebas dan lisensi di bawah lisensi GNU GPL. Utilitas ini dapat menginstal sistem operasi Unix termasuk Windows dan MAC OS. GNU Wget adalah utilitas jaringan untuk mengambil file dari World Wide Web menggunakan HTTP dan FTP, dua hal yang paling banyak digunakan protokol internet. Ini adalah piranti baris perintah yang tidak interaktif, sehingga memungkinkan bekerja di latar belakang setelah memiliki log.

Fitur utama dari Wget adalah ketahanan. Hal ini dirancang sedemikian rupa sehingga bekerja dalam koneksi jaringan yang lambat atau tidak stabil. Wget secara otomatis memulai download yang mana ia tinggalkan jika terjadi masalah jaringan. Download file juga secara rekursif. Pencarian rekursif halaman HTML, serta situs FTP didukung, sehingga dapat menggunakan Wget membuat mirror dari arsip atau melintasi web seperti robot WWW (Wget memahami /robots.txt). Wget bekerja sangat baik pada koneksi lambat atau tidak stabil, menjaga untuk mendapatkan dokumen/file sampai diperoleh sepenuhnya.

Pertama, periksa apakah wget utilitas telah terinstal atau tidak dalam kotak Linux Anda, menggunakan perintah.  

# rpm -qa wget

Silahkan install menggunakan perintah YUM dalam hal wget tidak diinstal sudah atau Anda juga dapat men-download binari paket pada http://ftp.gnu.org/gnu/wget/.

# yum -y install wget

Berikut contoh penggunaan Wget :

1.      Satu file download
Perintah akan men-download file tunggal dan toko-toko dalam direktori saat ini. Ia juga menunjukkan proses download, ukuran, tanggal dan waktu saat men-download.

# wget http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz

2.      Download file dengan nama yang berbeda
Menggunakan opsi - O (huruf besar), download file dengan nama file yang berbeda. Di sini kita diberi nama berkas wget.zip seperti ditunjukkan di bawah.

# wget -O wget.zip http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz

3.      Download beberapa file dengan protokol http dan ftp
Di sini kita lihat bagaimana untuk men-download beberapa file menggunakan protokol HTTP dan FTP dengan perintah wget.

# wget http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz ftp://ftp.gnu.org/gnu/wget/wget-1.10.1.tar.gz.sig

4.      Baca URL dari file
Anda dapat menyimpan jumlah URL dalam file teks dan men-download mereka dengan -i pilihan. Di bawah ini kami telah menciptakan tmp.txt di bawah wget direktori mana kita menempatkan serangkaian URL untuk men-download.

# wget -i /wget/tmp.txt

5.      Resume download yang belum selesai
Dalam kasus download file besar, mungkin terjadi kadang-kadang untuk menghentikan download dalam bahwa kita dapat melanjutkan kasus men-download file yang sama di mana itu ditinggalkan dengan opsi - c. Tetapi ketika Anda mulai download file tanpa menentukan - c pilihan wget akan menambahkan ekstensi.1 pada akhir file, mempertimbangkan sebagai download segar. Jadi, itu adalah praktik yang baik untuk menambahkan - c beralih ketika Anda men-download file-file besar.

# wget -c http://mirrors.hns.net.in/centos/6.3/isos/x86_64/CentOS-6.3-x86_64-LiveDVD.iso

6.      Download file dengan ditambahkan.1 dalam nama file
Ketika Anda mulai download tanpa wget opsi - c Tambahkan.1 pada akhir file dan mulai dengan download segar. Jika.1 sudah ada.2 menambahkan pada akhir file.

# wget http://mirrors.hns.net.in/centos/6.3/isos/x86_64/CentOS-6.3-x86_64-LiveDVD.iso

7.      Download file di latar belakang
Dengan opsi -b, Anda dapat mengirim download di latar belakang segera setelah memulai download dan log ditulis dalam /wget/log.txt file.

# wget -b /wget/log.txt ftp://ftp.iinet.net.au/debian/debian-cd/6.0.5/i386/iso-dvd/debian-6.0.5-i386-DVD-1.iso

8.      Membatasi batas kecepatan download
Dengan opsi-batas-tingkat = 100k, batas kecepatan download dibatasi ke 100k dan log akan dibuat di bawah /wget/log.txt seperti yang ditunjukkan di bawah ini.

# wget -c --limit-rate=100k  /wget/log.txt ftp://ftp.iinet.net.au/debian/debian-cd/6.0.5/i386/iso-dvd/debian-6.0.5-i386-DVD-1.iso

9.      Pembatasan FTP dan HTTP download dengan username dan password
Dengan pilihan http-user = username, http-password = password & ftp-pengguna = username, ftp-password = password, sehingga dapat men-download password dibatasi HTTP atau situs FTP seperti ditunjukkan di bawah.

# wget --http-user=narad --http-password=password http://mirror.hns.net.in/centos/6.3/isos/x86_64/CentOS-6.3-x86_64-LiveDVD.iso

# wget --ftp-user=narad --ftp-password=password ftp://ftp.iinet.net.au/debian/debian-cd/6.0.5/i386/iso-dvd/debian-6.0.5-i386-DVD-1.iso

10.    Menemukan versi wget dan bantuan
Dengan pilihan versi dan bantuan, sehingga dapat melihat versi dan membantu sesuai kebutuhan.
 
# wget –version

# wget --help 

Sekian pembahasan saya mengenai Wget. Terima kasih :)