Desain User Interface untuk Web E-commerce

Pada tugas mata kuliah Interaksi Manusia & Komputer ini, saya mencoba membuat sebuah desain User Interface aplikasi e-commerce dalam bentuk Web Platform. Desain ini saya buat dengan menggunakan aplikasi Adobe Illustrator. Berikut ini merupakan penjelasan tentang desain yang saya buat.

·    Saya membuat sebuah desain tampilan home pada web ini dengan bertemakan “girly”. Karena disini saya membuat web yang menjual berbagai produk dan jenis kosmetik, dimana web ini ditujukan untuk kebutuhan para wanita. Web ini saya beri nama “Beauty Spot”, dan saya beri slogan “get more beauty from this spot”, yang artinya dengan dengan melakukan interaksi pada web ini maka para wanita dapat menambah kebutuhan akan kecantikannya melalui barang-barang yang disediakan oleh web ini.

·      Pada web ini saya desain menggunakan 3 warna utama, yaitu pink, putih, dan hitam. Disini terlihat warna pink paling mendominasi pada web ini. Alasan saya menggunakan warna pink karena pink sering diartikan dengan warna yang identik dengan wanita atau yang disebut warna feminim, karena sesuai dengan barang yang dijual pada web ini yaitu produk-produk kosmetik. Warna putih saya pilih agar dapat menyeimbangkan warna pink ini sehingga web ini tidak terlihat mencolok dan terlihat lebih simple. Dan warna hitam saya gunakan untuk mempertegas warna-warna lainnya, sehingga web ini lebih terlihat solid.

·      Disini saya menggunakan font dan size yang berbeda-beda untuk tulisan-tulisan yang ada pada web ini. Saya menggunakan font “Remachine Script” untuk tulisan yang bergaya sambung karena cocok digunakan untuk nama dan slogan pada web ini agar terlihat lebih menarik dan dekoratif. Lalu untuk bagian kategori saya menggunakan font “dk lomonade” yaitu tulisan yang bergaya tegak karena cocok digunakan sebagai isi pada bagian head di web ini. Kemudian pada tulisan info, dll dibagian kanan bawah web ini menggunakan font “Freestyle script” agar lebih menarik pengunjung dan memberikan kesan jika pada bagian akhir web ini juga masih terdapat layanan dan bantuan yang diberikan oleh web ini.

·     Layout yang saya desain sedemikian rupa ini agar web terlihat lebih interaktif namun tetap user friendly. Disini saya menekankan penawaran utama yang diberikan oleh web ini. Dan menampilkan 3 menu “What’s Tending” agar pengunjung lebih tertarik untuk melihat dan mengakses secara luas pada web ini. Layout utama pada web ini yaitu gambar beberapa produk kosmetik yang dijual untuk meyakinkan pengunjung jika web ini merupakan trusted online shop. Social media links dan informasi lainnya saya letakkan dibagian bawah sebagai layanan tambahan yang diberikan oleh web ini.

Tutorial Animasi Sederhana Menggunakan Etoys

Pada final project mata kuliah Desain Pemodelan Grafik kali ini, saya membuat tutorial animasi racetrack sederhana dengan menggunakan aplikasi Etoys. Yaitu animasi sederhana pada objek mobil yang berjalan mengikuti jalur track yang telah dibuat. Untuk lebih lengkapnya mengenai animasi yang saya buat, lihat video dibawah ini! Happy watching :)

https://www.youtube.com/watch?v=QZmAdQUI_ig&feature=youtu.be

SOFTWARE SIMULASI

1.     Cisco Packet Tracer

Packet Tracer adalah simulator alat-alat jaringan Cisco yang sering digunakan sebagai media pembelajaran dan pelatihan, dan juga dalam bidang penelitian simulasi jaringan komputer. Program ini dibuat oleh Cisco Systems dan disediakan gratis untuk fakultas, siswa dan alumni yang telah berpartisipasi di Cisco Networking Academy. Tujuan utama Packet Tracer adalah untuk menyediakan alat bagi siswa dan pengajar agar dapat memahami prinsip jaringan komputer dan juga membangun skill di bidang alat-alat jaringan Cisco.

Packet Tracer biasanya digunakan siswa Cisco Networking Academy melalui sertifikasi Cisco Certified Network Associate (CCNA). Dikarenakan batasan pada beberapa fiturnya, software ini digunakan hanya sebagai alat bantu belajar, bukan seabagai pengganti Cisco routers dan switches.

2.     Proteus

Proteus merupakan salah satu software simulasi rangkaian elektronika terbaik dan terpopuler saat ini. Aplikasi ini banyak digunakan oleh kalangan pecinta elektronika karena dianggap memiliki fitur yang lengkap. Software ini mampu mensimulaikan berbagai macam komponen elektronika mulai dari resistor, kapasitor, sampai dengan beberapa IC analog ataupun digital, termasuk IC mikrokontroller. Software ini jika di install menyediakan banyak contoh aplikasi desain yang disertakan sehingga kita bisa belajar dari contoh-contoh yang sudah ada.

3.     SimulationX

SimulationX adalah suatu CAE software khusus untuk simulasi teknik mesin secara fisik; software tersebut diciptakan dan dikomersialisasikan oleh ITI GmbH di Dresden, Jerman. Para ilmuwan, insinyur aplikasi dari industri (untuk riset dan pengembangan produk baru) dan pembina pendidikan tinggi mempergunakan SimulationX untuk mendesain, simulasi, analisis, membuat model secara fisik dan mengetes sistem mekatronik rumit secara virtual. Dengan hanya memakai satu software platform SimulationX mensimulasi interaksi jenis-jenis efek fisikalis dari mekanik 1D, mekanik 3D, proses mekanika mesin, dinamika-dinamika mesin, hydraulik sistem, pneumatik sistem, thermo sistem, proses penyaluran listrik, magnetik dan juga kontrol sistem secara analog/digital. Salah satu pemakaian utama SimulationX dari bermacam-macam aplikasi utama adalah simulasi proses mekanika dan dinamika mesin kendaraan roda empat.

4.     Google Sketchup

SketchUp merupakan sebuah program pemodelan 3D yang dirancang untuk arsitek, insinyur sipil, pembuat film, game developer dan profesi terkait. Aplikasi ini dirancang untuk menjadi lebih mudah digunakan dibandingkan program CAD 3D. Beberapa fi tur kunci dan kegunaan SketchUp antara lain: sistem kursor penggambaran yang smart yang memungkinkan pengguna untuk menggambar obyek 3D melalui layar dan mouse 2D, kapabilitas untuk studi massa simpel via push-pull, Follow Me, untuk membuat bentuk 3D dengan mengembangkan surface 2D pada suatu path yang ditentukan, kemampuan untuk menganimasikan gerakan kamera dan matahari, hingga mencakup fi tur-fitur untuk memfasilitasi model penempatan di Google Earth.

Google SketchUp merupakan sebuah perangkat lunak desain grafis yang dikembangkan oleh Google. Pendesain grafis ini dapat digunakan untuk membuat berbagai jenis model, desain rumah dan interior, perangkat lunak yang satu ini sangat mudah di gunakandan model yang dibuat dapat diletakkan di Google Earth atau dipamerkan di Google 3D Warehouse.

5.     Oracle VM VirtualBox

Oracle VM VirtualBox adalah perangkat lunak virtualisasi, yang dapat digunakan untuk mengeksekusi sistem operasi tambahan di dalam sistem operasi utama. Sebagai contoh, jika seseorang mempunyai sistem operasi MS Windows yang terpasang di komputernya, maka seseorang tersebut dapat pula menjalankan sistem operasi lain yang diinginkan di dalam sistem operasi MS Windows.

Fungsi ini sangat penting jika seseorang ingin melakukan ujicoba dan simulasi instalasi suatu sistem tanpa harus kehilangan sistem yang ada. Aplikasi dengan fungsi sejenis VirtualBox lainnya adalah VMware dan Microsoft Virtual PC. Sistem operasi yang dapat menjalankannya antara lain Linux, Mac OS X, Windows XP, Windows Vista, Windows 7, Windows 8, Solaris, dan OpenSolaris

TEKNOLOGI PADA GAME ROYAL ENVOY

Game Royal Envoy merupakan game yang bergenre time management dan strategi. Royal Envoy adalah game yang cara memainkannya yaitu mengharuskan kita untuk menyelamatkan sebuah kota yang ada di pulau terpencil, kebetulan kota tersebut membutuhkan pemimpin yang bisa membangun kembali keterpurukannya.

Karena game ini bergenre strategi, game ini merupakan game dengan menggunakan tipe kamera wide (dari jauh) agar dapat mengontrol semua object yang terlibat dalam permainan tersebut. Dalam game Royal Envoy ini, mereka harus meminimalisasi setiap unit pasukan agar tidak salah dalam strategi pembangunan.

Teknologi yang digunakan dalam game ini yaitu adanya penggunaan mesin pengolah kayu otomatis dan mesin pengolah buah-buahan. Disini juga terdapat cara pengaturan pekerja dalam membangun sebuah bangunan, dan memperbaiki kota dengan management  waktu serta keuangan yang pas dan sesuai untuk pembangunan tersebut.

Referensi :

http://teknologi-permainan.blogspot.co.id/

REVIEW GAME ROYAL ENVOY

Game             : Royal Envoy

Batasan         : 12+

Genre             : Time management & strategi

Platform         : PC, Android

Game Royal Envoy merupakan game yang bergenre time management dan strategi. Royal Envoy adalah game yang cara memainkannya yaitu mengharuskan kita untuk menyelamatkan sebuah kota yang ada di pulau terpencil, kebetulan kota tersebut membutuhkan pemimpin yang bisa membangun kembali keterpurukannya seperti kelaparan, bangunan hancur karena bencana alam badai, hujan besar yang bisa menghasilkan banjir, angin besar, dan kurangnya pasokan makanan karena perekonomian dalam kota tersebut kurang berjalan mulus. Pada game ini diperlukan seorang Raja yang bijaksana, jujur, dan tidak korupsi, serta bisa menjadi panutan bagi warganya. Maka disini kita dapat berperan bagaikan seorang raja.

Alasan saya memilih game ini karena disini terdapat beberapa manfaat  yang dapat diterapkan pada kehidupan manusia. Berikut ini alasannya:

·      Melatih kita bagaimana menjadi seorang pemimpin yang baik dan bijaksana

Dalam game ini kita berperan sebagai seorang raja yang ingin membangun kembali kotanya dari keterpurukan. Seorang pemimpin harus dapat bersikap bijaksana dalam menghadapi setiap persoalan yang dihadapinya. Dia harus tau apa yang harus diperbuatnya tetapi tidak boleh merugikan rakyatnya.

·      Melatih kecepatan dan time management yang baik

Menjadi seorang pemimpin tentu mengharuskan kita agar dapat bersikap cepat dan tanggap ketika sedang berada pada sebuah masalah. Contoh pada game ini ketika kota tersebut hancur karena bencana alam, kita harus dapat dengan cepat membangun kembali kota tersebut dengan pengaturan perekonomian yang tepat.

·      Dapat menyusun strategi yang tepat dalam suatu masalah

Contoh pada game ini yaitu ketika rakyat mengalami kelaparan dan kondisi keuangan kota tersebut sedang menurun, kita harus dapat menyusun strategi dan menemukan jalan keluarnya. Seperti lebih mengolah lagi sumber daya alam yang sudah dimiliki oleh kota tersebut.

·      Bagaimana menjadi seseorang yang ramah dan sabar

Ketika masalah banyak menimpa sebuah kota, banyak rakyat yang kontra terhadap pemimpinnya. Disini kita harus dapat bersikap tetap ramah dan sabar menghadapi tekanan yang sedang dialami.


Referensi:
http://www.plimbi.com/review/91241/game-android-terbaru?force_desktop=1

APLIKASI PENCIL

Pencil adalah adalah grafis 2D animasi perangkat lunak yang berjalan pada Mac , Windows , Linux danBSD . Pensil menggunakan unik bitmap / vektor antarmuka gambar untuk menghasilkan grafis 2D sederhana serta animasi . Pensil ditulis dalam C++ dan Qt berbasis. Lisensi aplikasi GNU General Public License . Ini dimulai sebagai sebuah "uji pensil" program yang sederhana oleh Patrick Corrieri, diperpanjang ke aplikasi Pensil saat ini terutama oleh Pascal Naidon.

Sebuah dokumen Pensil diatur berlapis-lapis. Saat ini ada empat jenis layer: gambar bitmap, gambar vektor, suara dan kamera. Jendela Time Line di bagian bawah layar menunjukkan layer yang ada. Secara default, sebuah dokumen baru berisi layer bitmap dan vektor layer di atasnya, tetapi Anda dapat menambahkan dan menghapus layer seperti yang anda inginkan (menggunakan baik atau di samping "Layers", atau menu Layer) tombol.

Menu pada pencil :

1.        Document berfungsi untuk mengatur file dokumen seperti membuat, membuka, menyimpan, mengexport, mencetak hingga menutup suatu dokumen.

2.        Edit berfungsi untuk mengedit (melakukan perubahan) suatu dokumen seperti membatalkan, mengembalikan, memotong, menyalin, mengambil objek yang disalin, menghapus serta menyeleksi objek.

3.        View berfungsi untuk mengatur seperti apa tampilan layar dokumen seperti menampilkan atau tidak menampilkan collection pane, menampilkan atau tidak menampilkan hide heavy elements, serta menampilkan dokumen secara full.

4.        Shape berfungsi untuk mengatur desain yang akan kita buat seperti menggabungkan objek, membuat objek dengan lebar yang sama, mengatur rata kiri, tengah, kanan, bawah, atas, dll.

5.        Tools terdapat clipart browser, install new collection, manage export template, developer tools, dan options.

6.        Help berfungsi untuk menampilkan deskripsi aplikasi pencil seperti siapa saja pembuat aplikasi pencil, siapa saja yang berkontribusi dalam pembuatan aplikasi pencil, dan lisensi aplikasi pencil.

Pada aplikasi pencil pengguna dimudahkan untuk membuat sebuah desain karena pada pencil sudah tersedia koleksi objek-objek yang bisa digunakan untuk membuat desain.

·           Common shapes berisi koleksi dari bentuk-bentuk dasar objek pada umumnya seperti bentuk persegi, oval, trapesium, jajargenjang, dll serta untuk membuat text pada desain

·           Basic Web Elements berisi koleksi dari elemen yang biasanya digunakan dalam sebuah website seperti html text, hyperlink, dll.

·           Desktop – GTK Widgets berisi koleksi tampilan dari suatu aplikasi sederhana seperti radio, button, combo box, dll.

·           Desktop – Native UI Widgets berisi koleksi tampilan user interface suatu aplikasi yang lebih kompleks seperti radio, checkbox, spin input, dll.

·           Desktop – Sketchy GUI berisi koleksi tampilan untuk prototyping seperti box, line, sketchy circle, dll.

                             

·           Desktop – Windows XP Widgets bersisi koleksi tampilan dari Windows XP, fitur yang ada hanya fitur-fitur standar pada umumnya seperti window frame, tab panel, menu, dll.

·           Flowchart berisi koleksi gambaran alur kerja sistem atau program yang dibuat seperti terminator, process, connector, dll.

                                   

·           Mobile – Android ICS berisi koleksi tampilan dari sebuah perangkat yang berbasis android seperti phone, tablet, keyboard, status bar, dll. 

             

 

·           Mobile – iOS UI Stencils berisi koleksi tampilan standar dari sebuah perangkat yang berbasis iOS seperti iphone, ipad, keyboard, status bar, dll.

          

          

          

·           Mobil1 – iOS Wireframe berisi koleksi tampilan yang lebih kompleks dari sebuah perangkat yang berbasis iOS seperti iphone, ipad, message box, list item, dll.

    

                       

      

Cara membuat sebuah desain pada aplikasi pencil yaitu kita hanya menarik dan menaruh (drag and drop) objek tersebut ke workspace kita sesuai yang kita inginkan. Setelah sudah selesai mendesain kemudian kita gabungkan semua objek yang ada didesain tersebut dengan menekan Ctrl+G atau klik menu shape à group. Kemudian untuk menyimpan hasil desain yang sudah dibuat klik document export selection as PNG.