Pengolahan Citra pada Navigasi Robot Mobile

Pendahuluan

Pengolahan citra (Image Processing) adalah setiap bentuk pengolahan sinyal dimana input adalah gambar, seperti foto atau video bingkai, sedangkan output dari pengolahan gambar dapat berupa gambar atau sejumlah karakteristik atau parameter yang berkaitan dengan gambar. Kebanyakan gambar-teknik pemrosesan melibatkan atau memperlakukan foto sebagai dimensi dua sinyal dan menerapkan standar-teknik pemrosesan sinyal untuk itu, biasanya hal tersebut mengacu pada pengolahan gambar digital,tetapi dapat juga digunakan untuk optik dan pengolahan gambar analog. Akuisisi gambar atau yang menghasilkan gambar input di tempat pertama disebut sebagai pencitraan.

Pengolahan citra merupakan proses pengolahan dan analisis citra yang banyak melibatkan persepsi visual. Proses ini mempunyai ciri data masukan dan informasi keluaran yang berbentuk citra. Istilah pengolahan citra digital secara umum didefinisikan sebagai pemrosesan citra dua dimensi dengan komputer. Dalam definisi yang lebih luas, pengolahan citra digital juga mencakup semua data dua dimensi. Citra digital adalah barisan bilangan nyata maupun kompleks yang diwakili oleh bit-bit tertentu.

Umumnya citra digital berbentuk persegi panjang atau bujur sangkar (pada beberapa sistem pencitraan ada pula yang berbentuk segienam) yang memiliki lebar dan tinggi tertentu. Ukuran ini biasanya dinyatakan dalam banyaknya titik atau piksel sehingga ukuran citra selalu bernilai bulat. Setiap titik memiliki koordinat sesuai posisinya dalam citra. Koordinat ini biasanya dinyatakan dalam bilangan bulat positif, yang dapat dimulai dari 0 atau 1 tergantung pada sistem yang digunakan. Setiap titik juga memiliki nilai berupa angka digital yang merepresentasikan informasi yang diwakili oleh titik tersebut.

Format data citra digital berhubungan erat dengan warna. Pada kebanyakan kasus, terutama untuk keperluan penampilan secara visual, nilai data digital merepresentasikan warna dari citra yang diolah. Format citra digital yang banyak dipakai adalah Citra Biner (monokrom), Citra Skala Keabuan ( gray scale ), Citra Warna ( true color ), dan Citra Warna Berindeks.

Perangkat sistem pengolah citra dikelompokkan menjadi tiga bagian yaitu:

1. Perangkat keras (hardware)

2. Perangkat lunak (software)

3. Intelejensi manusia (brainware)

Ketiga pengelompokkan sistem pengolah citra tersebut sudah menjadi hal mutlak dalam pengolah citra. Dimana pada komputer-komputer saat ini sudah hampir dikatakan memenuhi standart spesifikasi untuk melakukan pengolahan citra. Namun kenyataanya masih banyak perangkat yang lainnya yang perlu kita lengkapi untuk melakukan pengolahan citra, bukan hanya sekedar komputer, melainkan perangkat-perangkat lainnya yang tidak include dalam sebuah komputer atau PC.

• Operasi Pengolahan Citra

1.Perbaikan kualitas citra(image enhacement)

Tujuan : memperbaiki kualitas citra dengan memanipulasi parameter-parameter citra.

Operasi perbaikan citra :

•Perbaikan kontras gelap/terang

•Perbaikan tepian objek (edge enhancement)

•Penajaman (sharpening)

•Pemberian warna semu(pseudocoloring)

•Penapisan derau (noise filtering)

2.Pemugaran citra(image restoration)

Tujuan : menghilangkan cacat pada citra.Perbedaannya dengan perbaikan citra : penyebab degradasi citra diketahui.

Operasi pemugaran citra :

•Penghilangan kesamaran (deblurring)

•Penghilangan derau (noise)

3.Pemampatan citra (image compression)

Tujuan : citra direpresentasikan dalam bentuk lebih kompak, sehingga keperluan memori lebih sedikit namun dengan tetap mempertahankan kualitas gambar (misal dari .BMP menjadi .JPG)

4.Segmentasi citra (image segmentation)

Tujuan : memecah suatu citra ke dalam beberapa segmen dengan suatu kriteria tertentu.

Berkaitan erat dengan pengenalan pola.

5.Pengorakan citra (image analysis)

Tujuan : menghitung besaran kuantitatif dari citra untuk menghasilkan deskripsinya. Diperlukan untuk melokalisasi objek yang diinginkan dari sekelilingnya

Operasi pengorakan citra :

–Pendeteksian tepi objek (edge detection)

–Ekstraksi batas (boundary)

–Represenasi daerah (region)

6.Rekonstruksi citra (Image recontruction)

Tujuan : membentuk ulang objek dari beberapa citra hasil proyeksi.

Pembahasan Pengolahan Citra pada Navigasi Robot Mobile

Dengan teknologi Visual guided autonomous navigation, maka bisa lebih memajukan di bidang pemetaan dan robotika. Jika sebelumya teknologi robot menggunakan peta yang diterjemahkan manual, maka setelah adanya Visual guided autonomous navigation, sebuah robot bisa langsung menerjemahkan peta-peta tanpa kita harus mengisi apa yang ada di dalam robot tersebut. Teknologi Visual guided autonomous navigation bisa membantu di bidang militer dalam peperangan, kemudian gografi dalam pemetaan landmark.

Jika teknologi Visual guided autonomous navigation diterapkan di sebuah robot, robot akan diberi sensor dimana di bisa membedakan atau membuat jalur mana yang harus dilewati tanpa harus kita membuat logika kita yang menentukan. Dikarenakan teknologi ini sangat berguna untuk menjunjukan jalur jalur yang belum diketahui medannya.

Robot yang mengguankan  teknologi 

Visual guided autonomous navigation

Produk

Teknologi Visual guided autonomous navigation banyak dipakai di pembuatan robot robot sekarang. Sudah dijelaskan di atas, karena robot sekarang yang sudah memakai teknologi ini, akan bisa lebih memilih jalur tersendiri mana yang harus dilewati, jadi bisa mempermudah cara kerja dari robot tersebut.
Selain robot yang menggunakan teknologi ini, ada juga untuk pembuatan GPS. Pada GPS yang sudah menggunakan  teknologi Visual guided autonomous navigation, akan lebih bisa meneliti dan melihat dengan lebih detail dan jelas. misalnya ada gundukan bukit di depan, maka dengan GPS yang sudah dilengkapi teknologi ini, akan lebih gampang untuk menampilkan tinggi bukit tersebut, luas dari bukit tersebut dan lebih terarah.

Pengembangan Teknologi Visual guided autonomous navigation

Sekarang teknologi ini sedang dalam research, agar lebih sempurna dan detail dalam menangkap sebuah objek. Agar dalam implementasi teknologi ini dalam robot bisa lebih bagus lagi. Sehingga bisa mempermudah sebuah robot dalam menagkap suatu objek.

Research yang dilakukan dengan menggunakan
Visual guided autonomous navigation

Mengenail apa itu CMS

Hampir pada saat ini banyak sekali CMS yang bertebaran diluar sana dari mulai yang free alias gratis sampai yang berbayar (konon memiliki fitur canggih). Yang dibuat menggunakan PHP, Ruby sampai dengan node.js. Banyak sekali jenis variannya.

Sebelum mengkaji lebih jauh fitur dasar yang ada di sebuah CMS baiknya kita mempelajari apa itu CMS. Definisi CMS dalam bahasa Indonesia bisa dibaca di Wikipedia bagian content management system.

Yang paling terkenal pada saat ini adalah WordPress. Pada awalnya WordPress ini dibuat untuk blogging platform atau platform yang digunakan untuk menulis blog, namun berjalan dengan seiring waktu WordPress sekarang menjadi sebuah CMS. Ada yang lain seperti Joomla, Drupal, Moogle dan masih banyak lagi. Jika ingin membaca lebih jauh mengenai daftar CMS yang pernah ada silahkan buka Wikipedia halaman daftar CMS.

Saya memiliki beberapa referensi tentang perbandingan CMS terbaik yang yaitu dispyrestudios dan di net.tutsplus.com. Silahkan baca pada referensi tersebut untuk mengetahui kelebihan dan kekurangan dari masing masing CMS.

Fitur basic pada CMS

Pada umumnya sebuah CMS itu mampu untuk mengelola data blogpost, news, page atau halaman, melakukan manajemen file seperti upload dan menghapus file, menbuat sebuah category yang nantinya dibuat untuk filter blogpost atau news. Jadi menurut saya sebuah CMS itu hanya memiliki beberapa fungsi basic dibawah ini, yaitu:

Create, Update, Delete data yang ada di database
Ini merupakan fitur basic yang membangun sebuah CMS. Biasanya disebut CRUD (CReate, Update, Delete). Data yang di manage disini bisa berupa data blogpost, category, page, tag, atau tipe lainnya.

Upload File
Biasanya jenis file yang diupload adalah berupa image, yang nantinya akan digunakan untuk keperluan konten dari website tersebut. Namun bisa juga berupa file lain seperti Word Document, Excel Document, PDF, atau Archive file.

Bagaimana memilih CMS yang tepat

Ada beberapa hal seperti kemudahan penggunaan, popularitas, dukungan themes, kemudahan pembuatan theme sampai dengan security merupakan faktor yang menjadi pertimbangan pada saat memilih CMS. pada intinya pilihlah CMS yang sesuai dengan kebutuhan anda.

Apa itu enkripsi dan penggunaannya

Jika kita sedang merencakanan sebuah sistem maka kita juga akan berurusan dengan security dan salah satunya adalah enkripsi. Definisi enkripsi secara detail adalah proses mengamankan suatu informasi dengan membuat informasi tersebut tidak dapat dibaca tanpa bantuan pengetahuan khusus (Sumber Wikipedia).

Kapan kita perlu menggunakan enkripsi
Berikut adalah beberapa kasus yang menyebabkan kenapa kita harus menggunakan sebuah enkripsi:

1. Jika kita akan menyimpan password member ada user kedalam table user, jika didalam php biasanya menggunakan enkripsi MD5.
2. Pada aplikasi instant messaging seperti pada BBM, Whatsapp, Line, KakaoTalk. Biasanya enkripsi dilakukan ketika aplikasi mengirim pesan ke server dan response dikembalikan dari server.

Sebenarnya masih banyak contoh penggunaan lain dari enkripsi, namun menurut saya kedua contoh diatas merupakan contoh yang paling mudah dipahami karena banyak yang menggunakannya.

Mari kita jelaskan secara detail mengapa kedua contoh diatas memerlukan sebuah enkripsi.

1. Enkripsi pada saat menyimpan password user
Jika kita membuat sebuah website yang didalamnya ada module admin yang dipergunakan untuk melakukan maintenance content (jika anda menggunakan CMS seperti WordPress, Joomla, Drupal pasti anda akan selalu menggunakannya). Sebenarnya pada saat melakukan insert kedalam database kita tidak perlu mengenkripsi password data anda, namun karena alasan keamanan sebaiknya anda melakukannya umumnya pada website basic enkripsi itu adalah menggunakan metode MD5. Ada beberapa hal yang harus anda perhatikan disini yakni ketika anda menyimpan kedalam database maka data sudah di enkripsi menggunakan sebuah metode tertentu (dalam hal ini MD5), maka anda akan benar benar tidak tahu apa passwordnya ketika melihat di database.

Bagaimana jika user lupa password mereka? ini adalah pertanyaan lanjutan dari kasus diatas, karena kita menyimpan data password yang sudah di enkripsi maka jika kita lupa password yang bisa dilakukan adalah membuat sebuah form yang nantinya akan mensubmit data email atau username yang akan dicocokan dengan entry database. Jika ditemukan maka system akan mengirimkan email berisi link untuk mereset password anda. Yang ketika link tersebut anda buka anda akan mengentry password baru anda dan link ini haruslah valid ketika belum dibuka dan memiliki expired time (untuk menjaga orang yang tidak bertanggung jawab).

2. Enkripsi pada aplikasi instant messaging
Pada aplikasi instant messaging seperti BBM, Whatsapp, Line dan sebagainya ada sebuah enkripsi yang dilakukan ketika user mengirim data ke server, dan ketika server mengirim data ke aplikasi lagi. Mengapa hal ini perlu dilakukan alasannya sederhana yakni aplikasi instant messaging adalah aplikasi personal yang isi data dari percakapan itu umumnya data yang tidak boleh diketahui oleh orang lain (kecuali dari si pembuat aplikasi). Biasanya para pembuat aplikasi ini bisa membalikan proses enkripsinya sehingga bisa mendapatkan data aslinya.

Pada contoh pertama biasanya disebut enkripsi satu arah atau enkripsi yang tidak bisa dibalik prosesnya (decrypt), sedangkan pada contoh kedua biasanya disebut enkripsi dua arah atau enkripsi yang bisa dibalik prosesnya (decrypt).

Basic Style CSS

Jika anda seorang yang ingin mendalami website development, dalam hal ini lebih kearah style website (bukan programming). Saya memiliki basic style css yang biasa saya gunakan ketika saya membuat sebuah website.

Dengan menggunakan basic style css yang saya kumpulkan dari beberapa resource ini anda dapat menghemat waktu development pada bagian set typography, css reset. Yang terdapat pada basic style css ini ada 2 bagian utama yakni CSS reset (untuk mereset css tyle anda yang sudah menghandle banyak browser) dan css typography (style untuk h1, h2, h3, sampai h6 basic paragraph, ul li dan basic HTML tag lainnya)

Untuk lebih jelasnya silahkan lihat halaman demo untuk hasil akhirnya.

Memang pada bahasan kita saat ini kita hanya akan membuat 2 bagian utama didalam css yakni css reset dan typography. Berikut source lengkap dari halaman demo diatas.

index.html

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36

<!DOCTYPE html> <html lang="en" class="no-js"> <head>     <meta charset="utf-8" />           <title>belajarngoding.com | basic css style</title>           <link rel="stylesheet" href="style.css" type="text/css" /> </head> <body>   <h1>This is Heading 1</h1> <h2>This is Heading 2</h2> <h3>This is Heading 3</h3> <h4>This is Heading 4</h4> <h5>This is Heading 5</h5> <h6>This is Heading 6</h6>   <p>     Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. A small river named Duden flows by their place and supplies it with the necessary regelialia. It is a paradisematic country, in which roasted parts of sentences fly into your mouth. Even the all-powerful Pointing has no control about the blind texts it is an almost unorthographic life One day however a small line of blind text by the name of Lorem Ipsum decided to leave for the far World of Grammar.  </p>   <ul>     <li>first list</li>     <li>second list</li>     <li>third list</li> </ul>   <ol>     <li>first</li>     <li>second</li>     <li>third</li> </ol>       </body> </html>

style.css

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102

.clearfix { *zoom:1; } .clearfix:before, .clearfix:after {   display:table;   content:""; } .clearfix:after { clear:both; } .fade-out { opacity:0 !important; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {   margin:0;   padding:0;   border:0;   font-size:100%;   vertical-align:baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; } body { line-height:1; } blockquote, q { quotes:none; } blockquote:before, blockquote:after, q:before, q:after {   content:'';   content:none; } table {   border-collapse:collapse;   border-spacing:0; } body {   background: url('background.png') repeat;   font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;   color:#3b3a37;   font-size:100%;   line-height:1.6; } a, a:link, a:visited, a:active, a:focus {   color: #363636;   text-decoration:none;   outline:none;   -webkit-tap-highlight-color:rgba(0,0,0,0.1); } a:hover {   color:#cc0000;   text-decoration:none; } a:focus { outline:thin dotted; } a:hover, a:active { outline:0; } ::-moz-selection, ::selection {   background:#cc0000;   color:#ffffff;   text-shadow:none; } p a, li a, blockquote a, .text-block a {   border-bottom:1px solid #000000;   border-bottom-color:rgba(0,0,0,0.3); } p a:hover, li a:hover, blockquote a:hover, .text-block a:hover { border-bottom-color:#cc0000; } .underlined {   border-bottom:1px solid #000000;   border-bottom-color:rgba(0,0,0,0.3); } .underlined:hover { border-bottom-color:#cc0000; } small { font-size:0.75em; } h1, h2, h3, h4, h5, h6 {   font-weight:bold;   font-family:inherit; } h1 {   font-size:2.5em;   line-height:1.1em; } h2 {   font-size:1.8em;   margin:1.05em 0 .55em;   line-height:1.2em; } h3 {   font-size:1.25em;   margin:1.1em 0 0.5em;   line-height:1.2em; } h4, h5, h6 {   font-size:1em;   margin:1.5em 0 0.5em; } p { margin-bottom:1em; } p img {   display:block;   height:auto;   width:auto;   max-width:768px;   max-width: 620px; } ul, ol { margin:0 0 1em 2em; } li { margin:0 0 0.5em 0; } blockquote { margin:1em 0 1em 2em; } pre {   font-family:Courier, monospace;   font-size:0.75em;   line-height:1.2em; }   /*  * put your custom section here  */

Pada style.css diatas baris 1 sampai 7 merupakan css reset, sedangkan baris berikutnya mengatur style pada basic tag HTML. Untuk lebih jelasnya lihat demo untuk tutorial ini.