Analisis User Interface Website e-Commerce

                 Sebagai pengantar, User Interface Design adalah suatu bentuk komunikasi pengguna (user) dengan komputer. User Interface menggambarkan bagaimana pengguna dapat berinteraksi dengan komputer melalui tampilan antarmuka yang ada di layar komputer.

            Desain User Interface yang akan saya bahas kali ini adalah sebuah e-commerce barang elektronik yang bernama “Well Commerce”.

1) Analisis Homescreen

            Tema dari desain interface ini adalah simpel dan informatif. Tidak menggunakan terlalu banyak warna sehingga dapat dikatakan simpel, tetapi tetap menyajikan informasi segeneral mungkin sehingga user dapat melihat informasi dalam 1 layar.

            Dari bagian atas terdapat header dengan warna putih, dan logo WellCommerce di sebelah kiri atas. Logo biasanya diletakan di kiri atas dikarenakan bagian kiri atas adalah bagian yang pertama kali terlihat oleh layar, sehingga logo adalah pembuka dari interface homescreen ini. Kemudian di sebelah kanan terdapat tombol navigasi yang bersifat general dengan combo box. Apabila tombol tersebut ditekan, maka akan menampilkan pilihan-pilihan di bawahnya yang lebih spesifik sehingga memudahkan pengguna dalam mencari produk yang diinginkan berdasarkan kategori tertentu. Dan di sebelah kanan atas terdapat tombol cart. Di bawah header, terdapat pilihan jenis produk beserta Big Picture yang bisa dislide, yang menampilkan produk-produk terbaik baik dari segi value maupun kualitas. Perbandingan tombol dengan picture adalah 1:3 karena picturenya diharapkan menjadi sorotan utama user ketika website dibuka. Di bawahnya, terdapat pilihan-pilihan produk yang disajikan dalam bentuk row (baris per baris), disajikan pula nama beserta harganya.

            Font yang digunakan adalah Georgia dengan ukuran 12 untuk paragraf dan 14 untuk Titlenya. Hal ini dikarenakan Georgia menyajikan tulisan yang jelas dan tidak terlalu kaku agar tidak bosan dilihat oleh pengguna. Warna layout yang digunakan adalah warna putih dikarenakan putih adalah warna default dan dapat dipadukan dengan warna apa saja terutama hitam. Sehingga tidak akan menyulitkan pengguna dalam membaca nama ataupun harga produk. Warna tulisan untuk “promotion” adalah merah karena merah merupakan warna yang menarik perhatian dan menimbulkan kesan waw. Untuk new item, digunakan warna hijau yang melambangkan barang yang fresh dan sejuk untuk dilihat. Dan best seller diberikan warna kuning karena kuning melambangkan warna kebaikan/good.

            Untuk layoutnya, diberikan susunan komponen dengan perbandingan 2:5. Dimana 2 mewakili bagian header dan headline news, dan 5 mewakili isi dari websitenya. Isi website dipilah menjadi sebuah persegi, yang menampilkan maksimal 5 produk dalam 1 baris. Terdapat tombol See More untuk menampilkan produk di kategori tertentu secara keseluruhan. Desain layout seperti ini memungkinkan user untuk dapat melihat isi keseluruhan website tanpa harus menscroll ke bawah terlalu banyak, sehingga dapat dikatakan simpel dan informatif.

  

2) Analisis Page Product

            Halaman produk dapat diakses ketika sebuah produk diklik dan akan menampilkan spesifikasi produk secara picture maupun teks. Dengan komponen font, layout dan warna yang sama seperti homescreen, perbedaannya terletak pada susunan layoutnya. Halaman produk memiliki perbandingan 1:1 untuk layoutnya. Dimana setengah layar diisi oleh header, gambar produk secara besar serta deskripsi singkat mengenai produk. Di sebelah kanan juga disediakan harga dan pilihan untuk membeli. Dan setengah layar di bawah diisi oleh spesifikasi details dari sebuah produk dan di sebelah kanan terdapat contact information apabila terdapat kendala secara teknis dalam mengakses website tersebut. Di bagian bawah juga terdapat opinion atau review, bagian ini diletakan di bawah karena memang bagian ini hanya diakses apabila seseorang sudah tertarik pada deskripsi atau spesifikasi yang dijelaskan sebelumnya.

            Sekian analisa user interface dari website e-commerce Well Commerce, tujuan dari tulisan ini adalah untuk memenuhi tugas dari mata kuliah IMK (Interaksi Manusia dan Komputer).

Sumber :

https://github.com/WellCommerce/WellCommerce

http://waseso.net/?p=245

Link tambahan :

http://studentsite.gunadarma.ac.id/

http://baak.gunadarma.ac.id/

http://library.gunadarma.ac.id/

Project Etoys

Tutorial project etoys dapat dilihat di link youtube berikut ini :

https://www.youtube.com/watch?v=OWBhZ7tS5-c

Software Simulasi

Cisco IT Essentials Virtual Desktop

Cisco IT Essentials Virtual Desktop dan Laptop v4.0 adalah software simulasi bagi Anda yang ingin belajar merakit Komputer Desktop dan Laptop. Disertai petunjuk mengenai pemasangan, detail hardware, dan lainnya. Cocok bagi Anda yang ingin belajar merakit atau membongkar komputer tanpa harus khawatir rusak.

Bagi anda yang sering mengoprek PC atau Laptop, pasti sudah tidak asing lagi dengan hardware - hardware yang terisntal didalam PC atau Laptop tersebut. Tetapi bagi seorang pemula, hardware - hardware tersebut mungkin suatu hal yang asing, mungkin baru pertama kali dilihat.

Biasanya orang hanya tahu nama dari sebuah hardware, tetapi secara fisik orang tidak pernah melihatnya, 

terutama bagi mereka yang baru mengenal Komputer. Selain mengenal semua hardware yang terinstal, software ini juga memberikan pengetahuan kepada user tentang merakit sebuah PC dan Laptop dari awal.

Software ini sangat cocok untuk para pengajar atau pelajar yang ingin mempelajari cara merakit sebuah PC atau Laptop. Dengan software ini anda tidak memerlukan hardware - hardware yang nyata untuk belajar merakit PC dan Laptop.

Aplikasi ini mungkin lebih cocok disebut sebagai Tutorial merakit PC dengan virtual PC, karena aplikasi ini ditujukan untuk itu. Tampilan aplikasi ini sangat mudah dan juga sangat detail dan hampir sama sepeti aslinya pada gambar hardwarenya.

Aplikasi tidak hanya memberikan petunjuk bagaimana dalam merakit sebuah PC, tetapi meng-ikutsertakan user dalam merakit-nya, dengan kata lain user yang merakit PC virtual ini. Silakan anda explore sendiri aplikasi ini untuk lebih jelasnya.

Jadi bagi yang ingin tahu caranya memasang sebuah hardware yang ada didalam casing anda, maupun cara merakit sebuah PC, aplikasi ini merupakan solusi yang tepat untuk anda, karena hanya dengan "manual book" bagi sebagian orang itu masih belum cukup.

Sumber :

https://kampung-klik.blogspot.co.id/2014/05/download-software-simulasi-perakitan.html

http://studentsite.gunadarma.ac.id/

http://baak.gunadarma.ac.id/

Teknologi dalam Game Harvest Moon

Setelah sebelumnya kita telah membahas manfaat dari game Harvest Moon

(http://yoshua-gunadarma-l.blogspot.co.id/2017/01/manfaat-game-harvest-moon-back-to-nature.html)

kali ini saya akan membahas teknologi yang ada dalam game Harvest Moon Back to Nature.

            1) Platform

                        Harvest Moon Back to Nature merupakan salah 1 seri Harvest Moon yang tersukses karena saat itu orang sedang tergila-gila dengan Playstation. Game ini dikembangkan oleh Victor Interactive Software, dipublish oleh Natsume dan   didistribusikan ulang oleh PALAPA (versi bahasa Indonesia) untuk dimainkan di platform Playstation 1 (PSX).  Karakter dari game ini kebanyakan pindahan dari    Harvest Moon 64, dengan gaya hidup yang baru, karakter baru dan pilihan gadis          yang bisa dinikahi lebih banyak.

            2) Parameter

                        Di dalam game tersebut, terdapat beberapa parameter yang menjadi tolak ukur dan dapat dikalkulasikan menjadi sebuah angka. Yang pertama adalah gold, gold merupakan mata uang di game Harvest moon yang digunakan untuk membeli items. Tiap-tiap item seperti bibit juga memiliki parameter harga, quantity dan season-compatibility (musim yang cocok untuk ditanami tanaman tertentu). Parameter kedua  adalah transaksi jual beli, dimana tiap item memiliki nilai beli dan juga nilai jual, pemain dapat menghitung total penghasilan dan pengeluaran, di start menu. Parameter             ketiga adalah stamina, walaupun tidak disajikan dalam bentuk angka ataupun graph,   tapi stamina yang dimiliki MC terbatas dan bisa habis. Stamina juga dapat dipulihkan dengan item obat, sehingga tentunya ada kalkukasi tambah kurang apabila stamina dikonversikan ke dalam bentuk angka. Parameter berikutnya adalah afeksi. Apabila MC memberikan hadiah kepada gadis tertentu, ada meteran hati yang semula hitam, bisa perlahan-lahan memiliki warna. Warna ini menunjukan sebarapa dekat afeksi gadis tersebut. Untuk melakukan perubaha warna ini, tentunya ada angka yang             bekerja dibalik semua itu, dimana nilai afeksi ini akan bertambah saat kita   memberikan hadiah dan berkurang saat kita memberikan barang yang dia tidak suka. Dan masih banyak parameter lain seperti berry, afefksi hewan, hari, inventory dan  semacamnya.

            3) Grafik

                        Harvesmoon back to nature menawarkan penyajian grafik 2 dimensi yang   seperti 3 dimensi. Pemain hanya bisa bergerak 4 arah, atas bawah kiri kanan, dan tidak ada opsi untuk merubah angle kamera, karena kamera dilock ke pemain dan bergerak sesuai dengan pergerakan pemain. Warna yang disajikan terbatas dan tidak    terdapat bayangan yang spesifik karena sumber cahaya yang tidak jelas juga.

Sumber :

http://studentsite.gunadarma.ac.id/

http://baak.gunadarma.ac.id/

Manfaat Game Harvest Moon Back to Nature

Judul               : Harvest Moon Back to Nature

Platform          : Playstation X (PS1)

Mode               : Single Player

Genre              : Life simulation

            1) SINOPSIS

                        Siapa yang tidak kenal game harvest moon? Yang telah mengisi masa anak-anak khususnya mereka yang lahir pada tahun 90an. Game bergenre life simulation ini memiliki rating E (Everyone) yang dapat dimainkan oleh segala usia dan kalangan.

                        Mengkisahkan seorang main character (kita) yang adalah cucu dari seorang             kakek   petani di kota Mineral. Saat kecil di musim panas, main character pernah        berlibur di kebun kakeknya dan bertemu dengan seorang gadis kecil, MC berjanji         suatu saat akan kembali ke Mineral Town dan bertemu lagi dengan gadis tersebut.          Bertahun-tahun telah berlalu dan MC kembali ke kota. Kondisi kebun kakeknya    cukup mengenaskan, dan MC ditugaskan untuk mengembalikan kondisi kebunnya ke       semula dalam kurun waktu 3 tahun atas kesepakatan penduduk Mineral Town.

            2) MANFAAT

                        Dari segi gameplaypun, manfaatnya akan langsung terasa. Harvestmoon     adalah game yang menuntut pemainnya memiliki time-management dan resource-        management untuk mendapatkan keuntungan yang maksimal dengan modal awal    yang begitu kecil. Hal ini bisa dilakukan dengan membeli bibit, bertambang, atau     menjual hasil di gunung. Dengan keterbatasan waktu dan stamina, pemain dituntut            untuk mengefisiensikan aktivitas agar bisa menjadi seorang petani yang sukses. Hal          ini tentunya sangat bermanfaat bagi generasi 90an saat itu, karena mayoritas kita      sebagai pemain adalah anak sekolahan (SD atau SMP atau sekitarnya), dan kita yang       terbiasa memainkan game dengan gameplay management ini, kita akan terlatih untuk             menerapkannya walau secara langsung maupun tidak langsung dalam kehidupan kita         sehari-hari.

                        Harvest Moon juga menyediakan adanya opsi dialog dimana pemain harus             memilih pilihan dialog agar bisa meningkatkan afeksi pada penduduk kota di event-            event tertentu. Hal ini tentunya menuntut pemain untuk membaca dan memahami         situasi percakapan untuk dapat menentukan jawaban yang sesuai dan mendapatkan   afeksi lebih banyak. Oleh karenanya, harvestmoon memberikan manfaat dari segi   sosial.

                        Harvest Moon mengajari kita untuk melakukan rutinitas yang sama. Setelah            masuk ke tahun kedua menjelang ketiga, sebagian besar gameplay yang tersedia       menjadi terbatas. Gameplay akan terkesan monoton karena pemain harus mengulang      rutinitas sehari-hari seperti menyiram tanaman/memberi makan hewan/bersosialisasi    dengan penduduk kota, dan hal ini akan terjadi berulang-ulang hingga tahun ketiga             dimana permainan tamat. Tentunya ada yang bisa dipetik dari rutinitas ini, dalam   kehidupan sehari-hari khususnya di dunia pekerjaan, kita harus terbiasa menghadapi          rutinitas dan menemukan esensi dari kehidupan ini. Harvest moon mengajarkan          bahwa walaupun yang kita lakukan adalah rutinitas, tetapi itu adalah tanggung jawab   yang harus kita lakukan agar menjaga kestabilan dan menjadi semakin makmur.

            3) KESIMPULAN

                        Dibalik manfaat yang begitu banyak, tentunya game ini tidak luput dari      kesalahan dan tidaklah sempurna. Akan tetapi, banyak sekali manfaat yang bisa kita            petik dari bermain game dengan genre ini, dan tentunya game di genre lain juga        memiliki manfaat dari sisi yang berbeda. Semua kembali pada kita, bagaimana kita      mengintepretasikan sebuah permainan.

http://studentsite.gunadarma.ac.id/

http://baak.gunadarma.ac.id/

Review Pencil2D

Review Pencil2D

            Pencil2D adalah program open source untuk membuat sebuah animasi 2 dimensi yang tersedia untuk sistem operasi Windows, macOS dan linux. Aplikasi ini menggunakan interface bitmap/vektor untuk menghasilkan sebuah grafik 2D sederhana dan juga animasi 2 dimensi. Pencil ditulis menggunakan bahasa C++ oleh Patrict Corrieri.

            Dalam artikel kali ini, akan dibahas lebih lanjut mengenai aplikasi Pencil dan akan dimulai dari tampilan awal

            Di sebelah kiri layar terdapat tools, di bawahnya terdapat display, timeline untuk animasi dan pilihan Colors di sebelah kanan untuk mengubah warna yang aktif.

            Terdapat 4 pilihan layer, yaitu Vector layer, Bitmap Layer, Sound Layer dan Camera Layer. Untuk menghapus atau menambahkan layer, dapat tekan tombol + dan -.

            Layer ditampilkan dengan urutan bottom to up, dimana layer di bawah akan menempati posisi teratas di layar. Dengan memindahkan layer ke atas, maka akan mengubah prioritas gambar di screen. (Dalam hal ini, apabila bitmap layer digeser ke atas vector layer, maka tulisan bitmap akan tertimpa oleh tulisan vektor).

            Layer juga dapat diatur visibilitynya, sebagai active, inactive or invisible dan diindikasikan dengan bulatan hitam di sebelah nama layer. Apabila warnanya hitam, maka layernya aktif, apabila warnanya abu-abu berarti inactive, apabila kosong, maka layernya invisible.

            Untuk mengubah ukuran gambar, bisa digunakan select tool untuk menseleksi gambar, dan tombol arrow dapat digunakan untuk mengubah ukuran gambar dengan mendrag point yang ada di ujung kanan/kiri atas/bawah agar gambar dapat diubah menjadi semakin besar atau semakin kecil.

            Perbedaan bitmap layer dengan vektor layer adalah, bitmap layer yang berbasis bitmap akan mengalami degradasi kualitas apabila ukurannya diubah. Tidak seperti vektor yang berbasis vektor sehingga kualitas gambar akan tetap terjaga walau ukuran gambar berubah.

Referensi

http://www.slideshare.net/TanjaGvozdeva/how-to-use-pencil-animation-software

https://en.wikipedia.org/wiki/Pencil2D          

                

Adobe Photoshop vs GIMP vs Paint

Adobe Photoshop vs GIMP vs Paint

            Pengolahan citra merupakan proses memperbaiki kualitas citra agar mudah diinterpretasi oleh manusia atau komputer. Teknik pengolahan citra dilakukan dengan mentransformasikan citra menjadi citra lain, misalnya : pemampatan citra (Image compression). Pengolahan citra merupakan proses awal (preprocessing) dari komputer visi. Pengelompokkan data numerik dan simbollik (termasuk citra) dilakukan secara otomatis oleh komputer agar suatu objek dalam citra dapat dikneali dan diintepretasi.

            Adapun dalam melakukan pengolahan citra, terdapat beberapa aplikasi yang dapat digunakan. Dan dalam blog kali ini akan dibahas 3 aplikasi dengan fungsi yang sama, tetapi memiliki perbedaan, baik itu dari kelebihan atau kekurangannya. Yaitu :

1.) Adobe Photoshop

              Adobe photoshop adalah perangkat lunak untuk melakukan pengolahan citra yang dikembangkan oleh adobe khusus untuk pengeditan gambar atau pembuatan efek. Adobe photoshop memiliki format PSD sebagai format defaultnya dan dapat mengolah gambar dengan berbagai format seperti .png, .jpg, .jpeg, .gif dan lain-lain.

            Berikut adalah keunggulan adobe photoshop :

-          Lebih mudah digunakan dibandingkan software lain seperti corel draw (relatif)

-          Memiliki fasilitas yang cukup lengkap

-          Support berbagai macam format dengan variasi kualitas gambar maupun resolusi

-          Bisa memberikan efek tambahan pada citra

            Berikut adalah kelemahan adobe photoshop :

-          Ukuran penyimpanan gambar cukup besar apabila terdapat banyak layer dalam workspace

-          Memiliki tingkat kerumitan yang tinggi apabila terdapat banyak layer yang digabung.

            Berikut adalah tampilan awal dari Adobe Photoshop :

            Dan fitur photoshop yang akan dijadikan contoh adalah crop. Berikut adalah tampilan gambar dalam photoshop yang belum dicrop

            Dan berikut tampilan gambar yang telah dicrop di photoshop :

2) GIMP (GNU Image Manipulation Program)

            GNU Image manipulation program adalah perangkat lunak untuk memanipulasi grafik berbasis raster. Grafik yang dihasilkan oleh GIMP disimpan dengan format XCF dan bisa diekspor ke format lain seperti .bmp, .gif, .jpg, .png, dan lain-lain.

            Adapun keunggulan GIMP antara lain :

-          Bisa digunakan di seluruh sistem operasi seperti linux dan macOS.

-          Open source

-          Aplikasi yang ringan dengan spesifikasi rendah

-          Bisa membuat gambar animasi

-          Bisa ditambahkan plug-in seperti photoshop dengan gratis

            Adapun kelemahan GIMP antara lain :

-          Hanya mendukung 8 bits per-channel

-          Masih sedikit plug-in yang tersedia.,

-          Filter dan efek belum lengkap selayaknya photoshop.

            Berikut adalah tampilan awal GIMP

3) Paint

            Siapa yang tidak kenal aplikasi bawaan windows yang terkenal atas fungsinya untuk menyimpan hasil printscreen maupun citra lainnya. Paint adalah pengolahan citra sederhana yang telah termasuk dalam segala versi microsoft windows. Aplikasi ini umumnya menyimpan file dalam bentuk Windows bitmap (24 bit, 256 color, 16 color, monochrome) dengan ekstensi .bmp, JPG, GIF, PNG, TIFF.

            Keunggulan microsoft Paint adalah :

-          Simpel dan tidak memerlukan keahlian khusus

-          Cepat dan responsif

-          Ringan, mudah digunakan

            Kelemahannya adalah :

-          Fitur sangat terbatas

-          Tidak bisa memanipulasi citra terlalu lanjut

            Berikut adalah tampilan awal Microsoft Paint :

            Sebagai kesimpulan, Adobe photoshop memiliki keunggulan dari segi fitur dan tingkat pengolahan citra yang lebih tinggi dibandingkan aplikasi lain. Sebagai gantinya, adobe photoshop merupakan aplikasi berbayar dan digunakan oleh profesional karena membutuhkan keahllian dalam menggunakan aplikasinya. Apabila dibandingkan dengan GIMP dan Paint, kedua aplikasi gratis ini lebih mudah untuk digunakan dengan keterbatasan fitur dalam pengolahan citra.

            Tidak ada aplikasi yang sempurna, masing-masing memiliki kelebihan dan kekurangan, hanya tergantung dari pengguna dan kebutuhan pengguna itu sendiri yang bisa menentukan aplikasi mana yang akan digunakan.

Referensi :

https://en.wikipedia.org/wiki/Microsoft_Paint

https://id.wikipedia.org/wiki/Adobe_Photoshop

https://id.wikipedia.org/wiki/GIMP