diff --git a/data/db_dagojek.sql b/data/db_dagojek.sql
index 6c164f369f5b2c6a139447ff8f0abaf09d1b895a..35f64d7921c0854ac7966fcc69ff4f926a83f40a 100644
--- a/data/db_dagojek.sql
+++ b/data/db_dagojek.sql
@@ -3,7 +3,7 @@
 -- http://www.phpmyadmin.net
 --
 -- Host: localhost
--- Generation Time: Oct 06, 2017 at 10:54 AM
+-- Generation Time: Oct 07, 2017 at 10:30 AM
 -- Server version: 10.0.31-MariaDB-0ubuntu0.16.04.2
 -- PHP Version: 7.0.22-0ubuntu0.16.04.1
 
@@ -37,24 +37,10 @@ CREATE TABLE `driver` (
 --
 
 INSERT INTO `driver` (`id`, `rating`, `sum_order`) VALUES
-(1, 4.3, 121);
-
--- --------------------------------------------------------
-
---
--- Table structure for table `order`
---
-
-CREATE TABLE `order` (
-  `id_order` int(11) NOT NULL,
-  `id_driver` int(11) NOT NULL,
-  `id_customer` int(11) NOT NULL,
-  `source` varchar(20) NOT NULL,
-  `destination` varchar(20) NOT NULL,
-  `rating` int(11) NOT NULL,
-  `comment` varchar(120) NOT NULL,
-  `time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
-) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
+(1, 4.15, 122),
+(2, 3.875, 131),
+(3, 0, 0),
+(4, 4, 1);
 
 -- --------------------------------------------------------
 
@@ -77,7 +63,13 @@ INSERT INTO `prefered_location` (`id_driver`, `location`) VALUES
 (1, 'Dago Pojok'),
 (1, 'Lembang'),
 (1, 'Mantheos'),
-(1, 'Tubagus');
+(1, 'Tubagus'),
+(2, 'Buah Batu'),
+(2, 'Cicaheum'),
+(2, 'Cikutra'),
+(2, 'Parongpong'),
+(2, 'Tubagus'),
+(4, 'Tubagus');
 
 -- --------------------------------------------------------
 
@@ -101,7 +93,38 @@ CREATE TABLE `user` (
 --
 
 INSERT INTO `user` (`id`, `name`, `username`, `email`, `password`, `phone`, `photo`, `is_driver`) VALUES
-(1, 'Fadhil Imam Kurnia', 'fadhilimamk', '13515146@std.stei.itb.ac.id', 'dtashfVATSaashdbgasdjy78123bahsVJSF72vsahsj', '085797490039', '/img/profile/VGdWZUZ2dlJlUkM5eWpjVDcyQXJoZz09', 1);
+(1, 'Fadhil Imam Kurnia', 'fadhilimamk', '13515146@std.stei.itb.ac.id', 'dtashfVATSaashdbgasdjy78123bahsVJSF72vsahsj', '085797490039', '/img/profile/VGdWZUZ2dlJlUkM5eWpjVDcyQXJoZz09', 1),
+(2, 'Joko Susilo', 'jokosusilo', 'rahasia@gmail.com', 'd41d8cd98f00b204e9800998ecf8427e', '0247624517', '/img/profile/cXNNb1RtOXg0ckxtUVpoZGpiK3NTZz09', 1),
+(3, 'Abdul Majid', 'abdulmajid', 'abdul@gmail.com', 'jhasdTUAShasdbasdjask', '085741627404', '/img/profile/R2dXM01NcDVRV0lrVXdGTE5nbDZDdz09', 1),
+(4, 'Abdullah Malik Ibrahim', 'malikibrahim', 'malik@gmail.com', 'JHdgasjhdkjashjasd8asdjhas', '0247657917', '/img/profile/UFBqemxTWmtkZytjSmNSVWE4S2lTQT09', 1);
+
+-- --------------------------------------------------------
+
+--
+-- Table structure for table `user_order`
+--
+
+CREATE TABLE `user_order` (
+  `id_order` int(11) NOT NULL,
+  `id_driver` int(11) NOT NULL,
+  `id_customer` int(11) NOT NULL,
+  `source` varchar(20) NOT NULL,
+  `destination` varchar(20) NOT NULL,
+  `rating` int(11) NOT NULL,
+  `comment` varchar(120) NOT NULL,
+  `time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
+) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
+
+--
+-- Dumping data for table `user_order`
+--
+
+INSERT INTO `user_order` (`id_order`, `id_driver`, `id_customer`, `source`, `destination`, `rating`, `comment`, `time`) VALUES
+(1, 4, 4, 'Tubagus', 'Dago Asri', 4, 'Mantap bang, pelayanan prima!', '2017-10-07 01:53:24'),
+(2, 1, 4, 'Tubagus', 'Dago Asri', 4, 'kjasdh kasjd', '2017-10-07 02:02:42'),
+(3, 2, 4, 'Tubagus', 'Dago Asri', 4, 'Pelayanannya terbaik!', '2017-10-07 02:03:23'),
+(4, 4, 4, 'Tubagus', 'Dago Asri', 4, 'Ini kan aku sendiri (?)', '2017-10-07 02:04:04'),
+(5, 2, 4, 'Tubagus', 'Dago Asri', 4, 'Mantap bang!', '2017-10-07 02:25:18');
 
 --
 -- Indexes for dumped tables
@@ -113,12 +136,6 @@ INSERT INTO `user` (`id`, `name`, `username`, `email`, `password`, `phone`, `pho
 ALTER TABLE `driver`
   ADD PRIMARY KEY (`id`);
 
---
--- Indexes for table `order`
---
-ALTER TABLE `order`
-  ADD PRIMARY KEY (`id_order`);
-
 --
 -- Indexes for table `prefered_location`
 --
@@ -132,6 +149,12 @@ ALTER TABLE `user`
   ADD PRIMARY KEY (`id`),
   ADD UNIQUE KEY `username` (`username`,`email`);
 
+--
+-- Indexes for table `user_order`
+--
+ALTER TABLE `user_order`
+  ADD PRIMARY KEY (`id_order`);
+
 --
 -- AUTO_INCREMENT for dumped tables
 --
@@ -140,7 +163,12 @@ ALTER TABLE `user`
 -- AUTO_INCREMENT for table `user`
 --
 ALTER TABLE `user`
-  MODIFY `id` int(15) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=2;
+  MODIFY `id` int(15) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=5;
+--
+-- AUTO_INCREMENT for table `user_order`
+--
+ALTER TABLE `user_order`
+  MODIFY `id_order` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=6;
 --
 -- Constraints for dumped tables
 --
diff --git a/public/font/typicons.eot b/public/font/typicons.eot
old mode 100644
new mode 100755
diff --git a/public/font/typicons.svg b/public/font/typicons.svg
old mode 100644
new mode 100755
diff --git a/public/font/typicons.ttf b/public/font/typicons.ttf
old mode 100644
new mode 100755
diff --git a/public/font/typicons.woff b/public/font/typicons.woff
old mode 100644
new mode 100755
diff --git a/public/img/ic_close.png b/public/img/ic_close.png
old mode 100644
new mode 100755
diff --git a/public/img/logo.jpg b/public/img/logo.jpg
old mode 100644
new mode 100755
index c89792cdf96f350845bdeebe05dedb3b57f83900..1a3225044d5553eae920ec4d58bd872d217b1691
Binary files a/public/img/logo.jpg and b/public/img/logo.jpg differ
diff --git a/public/img/profile/R2dXM01NcDVRV0lrVXdGTE5nbDZDdz09 b/public/img/profile/R2dXM01NcDVRV0lrVXdGTE5nbDZDdz09
new file mode 100644
index 0000000000000000000000000000000000000000..e754de321e5bad788747a6acf8b0fc89629fd6ed
Binary files /dev/null and b/public/img/profile/R2dXM01NcDVRV0lrVXdGTE5nbDZDdz09 differ
diff --git a/public/img/profile/UFBqemxTWmtkZytjSmNSVWE4S2lTQT09 b/public/img/profile/UFBqemxTWmtkZytjSmNSVWE4S2lTQT09
new file mode 100644
index 0000000000000000000000000000000000000000..b39a68fb07fed004f193ca762bfbb5152f6d7a6c
Binary files /dev/null and b/public/img/profile/UFBqemxTWmtkZytjSmNSVWE4S2lTQT09 differ
diff --git a/public/img/profile/VGdWZUZ2dlJlUkM5eWpjVDcyQXJoZz09 b/public/img/profile/VGdWZUZ2dlJlUkM5eWpjVDcyQXJoZz09
old mode 100644
new mode 100755
diff --git a/public/img/profile/cXNNb1RtOXg0ckxtUVpoZGpiK3NTZz09 b/public/img/profile/cXNNb1RtOXg0ckxtUVpoZGpiK3NTZz09
new file mode 100644
index 0000000000000000000000000000000000000000..8c90cb6ae6dc081e33ceeacf603389a7c12e4e90
Binary files /dev/null and b/public/img/profile/cXNNb1RtOXg0ckxtUVpoZGpiK3NTZz09 differ
diff --git a/public/index.php b/public/index.php
old mode 100644
new mode 100755
diff --git a/public/order.js b/public/order.js
new file mode 100755
index 0000000000000000000000000000000000000000..4f0b517aa3d9b3fb9296c5850e26bdc52265d36e
--- /dev/null
+++ b/public/order.js
@@ -0,0 +1,191 @@
+
+// Hide other page section
+(function() {
+    showLocationPage();
+})();
+
+var resultData;
+
+function makeOrder() {
+    var customerID = document.getElementById('customer-id').innerHTML;
+    var orderPickup = document.getElementById('orderPickup').value;
+    var orderDestination = document.getElementById('orderDestination').value;
+    var orderPreferredDriver = document.getElementById('orderPreferredDriver').value;
+    var data = "id="+customerID+"&pickup="+orderPickup+"&destination="+orderDestination+"&driver="+orderPreferredDriver;
+
+    if (orderPickup.trim() == "" || orderDestination.trim() == "") {
+        alert("Sorce and destination is required!");
+        return;
+    }
+
+    var xhttp = new XMLHttpRequest();
+    xhttp.onreadystatechange = function() {
+        if (this.readyState == 4 && this.status == 200) {
+            resultData = JSON.parse(this.responseText);
+            bindSearchResult(JSON.parse(this.responseText));
+            showDriverPage();
+
+            document.getElementById('orderPickup').disabled = true;
+            document.getElementById('orderDestination').disabled = true;
+            document.getElementById('orderPreferredDriver').disabled = true;
+
+        }
+    };
+    xhttp.open("POST", "/main/order/new", true);
+    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+    xhttp.send(data);
+}
+
+function bindSearchResult(data) {
+    var preferred = data.preferred;
+    if (preferred != null) {
+        var vote = (preferred.sum_order > 1) ? 'votes' : 'vote';
+        document.getElementById('driver-preferred-result').innerHTML = '' +
+            '<div class="row">\n' +
+            '   <img src="'+preferred.photo+'" style="float: left; border: 1px solid black; margin: 10px" width="120" height="125">\n' +
+            '   <p style="font-size: 1.4em; margin:20px 10px 3px 10px">'+preferred.name+'</p>\n' +
+            '   <p style="margin-top: 0"><span class="text-orange"><b><i class="icon icon-star"></i> '+preferred.rating+'</b></span> ('+preferred.sum_order+' '+vote+')</p>\n' +
+            '   <span class="btn green" style="float: right; margin: 10px" onclick="finishOrder(\''+preferred.id+'\')">I CHOOSE YOU!</span>\n' +
+            '</div>';
+    }
+
+    var html = '';
+    var results = data.result;
+    if (results != null && results.length != 0) {
+        results.forEach(function (driverItem) {
+            var vote = (driverItem.sum_order > 1) ? 'votes' : 'vote';
+            html += '' +
+                '<div class="row">\n' +
+                '   <img src="'+driverItem.photo+'" style="float: left; border: 1px solid black; margin: 10px" width="120" height="125">\n' +
+                '   <p style="font-size: 1.4em; margin:20px 10px 3px 10px">'+driverItem.name+'</p>\n' +
+                '   <p style="margin-top: 0"><span class="text-orange"><b><i class="icon icon-star"></i> '+driverItem.rating+'</b></span> ('+driverItem.sum_order+' '+vote+')</p>\n' +
+                '   <a href="#" class="btn green" style="float: right; margin: 10px" onclick="finishOrder(\''+driverItem.id+'\')">I CHOOSE YOU!</a>\n' +
+                '</div>';
+        });
+        document.getElementById('driver-search-result').innerHTML = html;
+    }
+}
+
+function finishOrder(id) {
+    var photo;
+    var name;
+    var username;
+    var preferred = resultData.preferred;
+    if (preferred != null && preferred.id == id) {
+        photo = preferred.photo;
+        name = preferred.name;
+        username = preferred.username;
+    } else {
+        var results = resultData.result;
+        var i = 0;
+        while (results[i].id != id) {
+            i++;
+        }
+        photo = results[i].photo;
+        name = results[i].name;
+        username = results[i].username;
+    }
+
+    bindFinishPage(id, name, photo, username);
+    showFinishPage();
+}
+
+function bindFinishPage(id, name, photo, username) {
+    document.getElementById('driver-finish-order').innerHTML = '' +
+        '<img class="img-circle" src="'+photo+'"/><br>\n' +
+        '<h2 style="margin-bottom: 0px">@'+username+'</h2>\n' +
+        '<p style="margin-top: 10px">'+name+'</p>\n' +
+        '<i id="star-1" class="icon icon-star-full big" onclick="setRating(1)"></i>\n' +
+        '<i id="star-2" class="icon icon-star-full big" onclick="setRating(2)"></i>\n' +
+        '<i id="star-3" class="icon icon-star-full big" onclick="setRating(3)"></i>\n' +
+        '<i id="star-4" class="icon icon-star-full big" onclick="setRating(4)"></i>\n' +
+        '<i id="star-5" class="icon icon-star-full big" onclick="setRating(5)"></i>\n' +
+        '<input type="hidden" id="order-rating" value="0"> \n' +
+        '<br>\n' +
+        '<br>\n' +
+        '<br>\n' +
+        '<textarea id="order-comment" style="width: 100%; height: 100px; padding: 10px; resize: none" placeholder="Your comment..." ></textarea>\n' +
+        '<a class="btn green" style="float: right; margin: 10px" onclick="completeOrder(\''+id+'\')">COMPLETE<br>ORDER</a>'
+}
+
+function setRating(val) {
+    for (var i = 1; i <= 5; i++) {
+        if (i <= val) {
+            document.getElementById('star-'+i).style.color = "orange";
+        } else {
+            document.getElementById('star-'+i).style.color = "#c2c2c2";
+        }
+    }
+    document.getElementById('order-rating').value = val;
+}
+
+function completeOrder(id) {
+    var customerID = document.getElementById('customer-id').innerHTML;
+    var orderPickup = document.getElementById('orderPickup').value;
+    var orderDestination = document.getElementById('orderDestination').value;
+    var rating = document.getElementById('order-rating').value;
+    var comment = document.getElementById('order-comment').value;
+    var data = 'id='+id+'&id_customer='+customerID+'&source='+orderPickup+'&destination='+orderDestination+'&rating='+rating+'&comment='+comment;
+
+    if (rating == 0) {
+        alert("You must give rating to your driver");
+        return;
+    }
+
+    if (comment.trim() == "") {
+        alert("You must give feedback to your driver");
+        return;
+    }
+
+    var xhttp = new XMLHttpRequest();
+    xhttp.onreadystatechange = function() {
+        if (this.readyState == 4 && this.status == 200) {
+            if (this.responseText == "Error") {
+                alert("Fail completing your order");
+            } else {
+                alert("Thanks for your order :D");
+                window.location.href = "/main/order?u="+customerID;
+            }
+        }
+    };
+    xhttp.open("POST", "/main/order/finish?u", true);
+    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
+    xhttp.send(data);
+
+}
+
+function showLocationPage() {
+    var finishPage = document.getElementById('order-page-finish');
+    finishPage.style.display = 'none';
+    var driverPage = document.getElementById('order-page-driver');
+    driverPage.style.display = 'none';
+    var locationPage = document.getElementById('order-page-location');
+    locationPage.style.display = 'block';
+    document.getElementById('page-tab-driver').classList.remove("selected");
+    document.getElementById('page-tab-finish').classList.remove("selected");
+    document.getElementById('page-tab-location').classList.add("selected");
+}
+
+function showDriverPage() {
+    var locationPage = document.getElementById('order-page-location');
+    locationPage.style.display = 'none';
+    var finishPage = document.getElementById('order-page-finish');
+    finishPage.style.display = 'none';
+    var driverPage = document.getElementById('order-page-driver');
+    driverPage.style.display = 'block';
+    document.getElementById('page-tab-driver').classList.add("selected");
+    document.getElementById('page-tab-finish').classList.remove("selected");
+    document.getElementById('page-tab-location').classList.remove("selected");
+}
+
+function showFinishPage() {
+    var locationPage = document.getElementById('order-page-location');
+    locationPage.style.display = 'none';
+    var driverPage = document.getElementById('order-page-driver');
+    driverPage.style.display = 'none';
+    var finishPage = document.getElementById('order-page-finish');
+    finishPage.style.display = 'block';
+    document.getElementById('page-tab-driver').classList.remove("selected");
+    document.getElementById('page-tab-finish').classList.add("selected");
+    document.getElementById('page-tab-location').classList.remove("selected");
+}
\ No newline at end of file
diff --git a/public/scripts.js b/public/scripts.js
old mode 100644
new mode 100755
diff --git a/public/style.css b/public/style.css
old mode 100644
new mode 100755
index 276cf0a38ade66e6854c52c0d28f51333ff9e956..683b3811a4c9156b1e5a951feb762128d991472f
--- a/public/style.css
+++ b/public/style.css
@@ -7,7 +7,7 @@ body {
 
 .container {
     width: 80%;
-    max-width: 1200px;
+    max-width: 700px;
     margin: 50px auto;
     background-color: white;
     padding: 20px;
@@ -70,18 +70,18 @@ body {
 .btn {
     border-radius: 5px;
     border: 1px solid black;
-    padding:5px 15px;
+    padding: 5px 15px;
     color: black;
     text-decoration: none;
     font-size: medium;
 }
 
 .red {
-    background-color: red;
+    background-color: #DA0000;
 }
 
 .green {
-    background-color: chartreuse;
+    background-color: #58F100;
 }
 
 .line-height-medium {
@@ -92,29 +92,34 @@ body {
 
 .logo:after {
     background-image: url('/img/logo.jpg');
-    background-size: 210px 100px;
+    background-size: 210px 40px;
     display: inline-block;
     width: 210px;
-    height: 100px;
+    height: 40px;
     content: "";
+    margin-bottom: 5px;
+}
+
+.user-action {
+    margin-top: 0px;
 }
 
 .tab {
     outline: 1px solid #004D40;
-    padding-top: 10px;
-    padding-bottom: 10px;
+    padding-top: 15px;
+    padding-bottom: 15px;
     font-weight: 900;
     color: black;
     text-decoration: none;
 }
 
 .tab.active {
-    background-color: #00695C;
+    background-color: #426344;
     color: #FAFAFA;
 }
 
 .tab:hover {
-    background-color: #00695C;
+    background-color: #426344;
     color: #FAFAFA;
 }
 
@@ -147,6 +152,11 @@ body {
     text-rendering: optimizeLegibility
 }
 
+.icon.big {
+    font-size: 3em;
+    color: #c2c2c2;
+}
+
 .icon.icon-mail:before {
     content: '\e0a5'
 }
@@ -159,11 +169,15 @@ body {
     content: '\e108'
 }
 
+.icon.icon-star-full:before{
+    content:'\e105'
+}
+
 /* ------------------------- PROFIL -------------------------*/
 
 .img-circle {
-    max-width: 170px;
-    max-height: 170px;
+    width: 170px;
+    height: 170px;
     border-radius: 50%;
     border: 3px solid black;
 }
@@ -216,4 +230,64 @@ table, th, td {
     width: 17px;
     height: 17px;
     content: "";
-}
\ No newline at end of file
+}
+
+/* ------------------------- ORDER -------------------------*/
+
+.small-circle {
+    width: 30px;
+    height: 30px;
+    border-radius: 50%;
+    background-color: #c2c2c2;
+    font-size: large;
+    vertical-align: middle;
+    margin: 0;
+}
+
+.page-tab {
+    width: 180px;
+    height: 50px;
+    border: 1px solid black;
+    margin: 0 auto;
+    display: table;
+    box-sizing: border-box;
+    vertical-align: middle;
+}
+
+.page-tab.selected {
+    background-color: #f4fe96;
+}
+
+.page-tab > .page-tab-image {
+    float: left;
+    width: 30%;
+    height:100%;
+    text-align: center;
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.page-tab >.page-tab-image >.circle {
+    border-radius: 50%;
+    width: 40px;
+    height: 40px;
+    margin: auto;
+    background-color: #d7d7d7;
+    padding: auto;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.page-tab > .page-tab-content {
+    float: right;
+    width: 70%;
+    height:100%;
+    display: inline-block;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
diff --git a/src/controller/OrderController.php b/src/controller/OrderController.php
new file mode 100644
index 0000000000000000000000000000000000000000..846c6b30dfbafe7a97ff7872b9096976ff78b7c1
--- /dev/null
+++ b/src/controller/OrderController.php
@@ -0,0 +1,128 @@
+<?php
+
+class OrderController {
+    public static function OrderHandler() {
+        // Getting user id from url
+        if (!isset($_GET['u']) || $_GET['u'] == "") {
+            echo "Invalid parameter!";
+            return;
+        }
+
+        $id = $_GET['u'];
+
+        // Decrypt user id
+        $uid = simpleCrypt($id, 'd');
+
+        // Getting driver profile
+        $dbconn = DB::getInstance();
+        $user = Driver::Create($uid, $dbconn);
+
+        if (!$user) {
+            echo "User not found!";
+            return;
+        }
+
+        require __DIR__.'/../view/order.php';
+    }
+
+
+    public static function MakeOrderHandler() {
+        $id = simpleCrypt($_POST['id'], 'd');
+        $pickup = $_POST['pickup'];
+        $destination = $_POST['destination'];
+        $driver = $_POST['driver'];
+
+        // Get driver
+        $results = array();
+        $dbconn = DB::getInstance();
+        $stmt = $dbconn->prepare(
+            'SELECT 
+                user.id AS id, name, username, photo, rating, sum_order 
+            FROM user NATURAL JOIN driver 
+            WHERE user.id IN (
+                SELECT DISTINCT id_driver 
+                FROM prefered_location 
+                WHERE (location = ? OR location = ?) AND user.id <> ?
+            )'
+        );
+        $stmt->execute(array($pickup, $destination, $id));
+        if ($stmt === false) {
+            echo "Error";
+            return;
+        }
+        $results += $stmt->fetchAll();
+        foreach ($results as $key => $field) {
+            $results[$key]['id'] = simpleCrypt($results[$key]['id'], 'e');
+        }
+
+        // get preferred driver
+        $preferred_driver = null;
+        if ($driver != "") {
+            $dbconn = DB::getInstance();
+            $stmt = $dbconn->prepare(
+                'SELECT 
+                user.id AS id, name, username, photo, rating, sum_order 
+            FROM user NATURAL JOIN driver 
+            WHERE username = ? AND user.id <> ?'
+            );
+            $stmt->execute(array($driver, $id));
+            if ($stmt === false) {
+                echo "Error";
+                return;
+            }
+            $preferred_driver = $stmt->fetchObject();
+            if ($preferred_driver == false) {
+                $preferred_driver = null;
+            } else {
+                $preferred_driver->id = simpleCrypt($preferred_driver->id, 'e');
+            }
+        }
+
+        echo json_encode(array('preferred'=>$preferred_driver , 'result' => $results));
+
+    }
+
+    public static function FinishOrderHandler() {
+        var_dump($_POST);
+
+        $id = simpleCrypt($_POST['id'], 'd');
+        $id_customer = simpleCrypt($_POST['id_customer'], 'd');
+        $source = $_POST['source'];
+        $destination = $_POST['destination'];
+        $rating = $_POST['rating'];
+        $comment = $_POST['comment'];
+
+        $dbconn = DB::getInstance();
+        $stmt = $dbconn->prepare(
+            'INSERT INTO user_order
+              (id_driver, id_customer, source, destination, rating, comment)
+            VALUES 
+              (?, ?, ?, ?, ?, ?)'
+        );
+
+        // Write finished order to db
+        $stmt->execute(array($id, $id_customer, $source, $destination, $rating, $comment));
+        if ($stmt === false) {
+            echo "Error";
+            return;
+        }
+
+        // Setup driver rating
+        $dbconn = DB::getInstance();
+        $stmt = $dbconn->prepare(
+            'UPDATE driver
+              SET rating=IF(rating=0, ? , ((rating + ?)/2)), sum_order=(sum_order+1)
+            WHERE
+              id = ?'
+        );
+        $stmt->execute(array($rating, $rating, $id));
+        if ($stmt === false) {
+            echo "Error";
+            return;
+        }
+
+        echo "Success";
+
+    }
+
+}
\ No newline at end of file
diff --git a/src/controller/ProfilController.php b/src/controller/ProfilController.php
index b8dc45d633e3bf576cf41ad7e0d620bd6785115d..4a931895c240f08311091250b689c142334622c0 100644
--- a/src/controller/ProfilController.php
+++ b/src/controller/ProfilController.php
@@ -23,7 +23,7 @@ class ProfilController {
         $user = Driver::Create($uid, $dbconn);
 
         if (!$user) {
-            echo "User not found!";
+            echo "User not found! (".$uid.")";
             return;
         }
 
@@ -249,4 +249,4 @@ class ProfilController {
     }
 
 
-}
\ No newline at end of file
+}
diff --git a/src/route.php b/src/route.php
index 74e56b75b9b9397448a5f9caee50d2fbab33d4a3..a2e6864c48853be106194e11d15761b6390fdc09 100644
--- a/src/route.php
+++ b/src/route.php
@@ -16,8 +16,10 @@ $AppInstance->addRoute("/main/profil/location/edit/save",   'ProfilController::S
 $AppInstance->addRoute("/main/profil/location/delete",      'ProfilController::DeleteLocationHandler');
 $AppInstance->addRoute("/main/profil/location/add",         'ProfilController::AddLocationHandler');
 
+$AppInstance->addRoute("/main/order",          'OrderController::OrderHandler');
+$AppInstance->addRoute("/main/order/new",          'OrderController::MakeOrderHandler');
+$AppInstance->addRoute("/main/order/finish",          'OrderController::FinishOrderHandler');
+
 $AppInstance->addRoute("/main/history",         'MainController::DefaultHandler');
-$AppInstance->addRoute("/main/order/",          'MainController::DefaultHandler');
 $AppInstance->addRoute("/main/order/select",    'MainController::DefaultHandler');
-$AppInstance->addRoute("/main/order/finish",    'MainController::DefaultHandler');
 
diff --git a/src/view/order.php b/src/view/order.php
new file mode 100644
index 0000000000000000000000000000000000000000..2a0760e021a5a3077c7f5185664fc092319b8b86
--- /dev/null
+++ b/src/view/order.php
@@ -0,0 +1,123 @@
+<html>
+<head>
+    <title>DAGO-JEK | Order</title>
+    <link rel="stylesheet" type="text/css" href="/style.css">
+</head>
+<body>
+    <div class="container">
+        <div class="row">
+            <div class="col-3"><span class="logo"></span></div>
+            <div class="col-3 text-right">
+                <p class="user-action">
+                    Hi, <b><?=$user->username?></b> !<br>
+                    <a href="/">Logout</a>
+                </p>
+            </div>
+        </div>
+        <div class="row">
+            <a class="col-2 tab text-center active" href="/main/order?u=<?=$id?>">ORDER</a>
+            <a class="col-2 tab text-center" href="/main/hostory?u=<?=$id?>">HISTORY</a>
+            <a class="col-2 tab text-center" href="/main/profil?u=<?=$id?>">MY PROFILE</a>
+        </div>
+        <div class="row">
+            <div class="col-6"><h1>MAKE AN ORDER</h1></div>
+            <span id="customer-id" style="display: none"><?=$id?></span>
+        </div>
+        <div class="row">
+            <div class="col-2">
+                <div id="page-tab-location" class="page-tab selected">
+                    <div class="page-tab-image">
+                        <div class="circle">1</div>
+                    </div>
+                    <div class="page-tab-content">
+                        Select Destination
+                    </div>
+                </div>
+            </div>
+            <div class="col-2">
+                <div id="page-tab-driver" class="page-tab">
+                    <div class="page-tab-image">
+                        <div class="circle">2</div>
+                    </div>
+                    <div class="page-tab-content">
+                        Select a Driver
+                    </div>
+                </div>
+            </div>
+            <div class="col-2">
+                <div id="page-tab-finish" class="page-tab">
+                    <div class="page-tab-image">
+                        <div class="circle">3</div>
+                    </div>
+                    <div class="page-tab-content">
+                        Complete your order
+                    </div>
+                </div>
+            </div>
+        </div>
+        <br>
+        <br>
+        <div id="order-page-location">
+            <form id="orderForm">
+                <div class="row">
+                    <div class="col-2" style="line-height: 40px">
+                        <span style="padding-left: 30%;">Picking Point</span> <br>
+                    </div>
+                    <div class="col-4" style="line-height: 30px">
+                        <input id="orderPickup" style="width: 80%;height: 30px;padding-left: 5px;font-size: medium" type="text" name="picking_point" placeholder="Pick up point">
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-2" style="line-height: 40px">
+                        <span style="padding-left: 30%">Destination</span> <br>
+                    </div>
+                    <div class="col-4" style="line-height: 30px">
+                        <input id="orderDestination" style="width: 80%; height: 30px;padding-left: 5px;font-size: medium" type="text" name="destination" placeholder="Destination">
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-2" style="line-height: 40px">
+                        <span style="padding-left: 30%">Preferred Driver</span>
+                    </div>
+                    <div class="col-4">
+                        <input id="orderPreferredDriver" style="width: 80%;height: 30px;padding-left: 5px;font-size: medium" type="text" name="driver" placeholder="(optional)"><br>
+                    </div>
+                </div>
+                <br>
+                <br>
+                <br>
+                <div class="row text-center">
+                    <a href="#" class="btn green" style="font-size: 2em" onclick="makeOrder()">Next</a>
+                </div>
+            </form>
+        </div>
+
+        <div id="order-page-driver">
+            <div style="width: 100%; border: 1px solid black; border-radius: 10px;">
+                <h2 style="margin-left: 10px; margin-top: 0px">PREFERRED DRIVERS: </h2>
+                <div id="driver-preferred-result" style="margin: 0 30px 30px 30px">
+                    <p id="driver-preferred-empty" class="text-center" style="font-size: large; color: #989898; margin: 30px">Nothing to display :(</p>
+                </div>
+            </div>
+            <br>
+            <div style="width: 100%; border: 1px solid black; border-radius: 10px;">
+                <h2 style="margin-left: 10px; margin-top: 0px">OTHER DRIVERS: </h2>
+                <div id="driver-search-result" style="margin: 0 30px 30px 30px">
+                    <p id="driver-preferred-empty" class="text-center" style="font-size: large; color: #989898; margin: 30px">Nothing to display :(</p>
+                </div>
+            </div>
+        </div>
+
+        <div id="order-page-finish" style="width: 100%;">
+            <h2 style="margin-left: 10px; margin-top: 0px">HOW WAS IT? </h2>
+            <div id="driver-finish-order" class="text-center profil" style="padding-bottom: 60px">
+                <p id="driver-preferred-empty" class="text-center" style="font-size: large; color: #989898; margin: 30px">Nothing to display :(</p>
+            </div>
+        </div>
+
+
+    </div>
+
+    <script type="text/javascript" src="/order.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/src/view/profil.php b/src/view/profil.php
index 85e517f47683ebc2363239b378460552ae7c7ee0..08bd7a96351a094b0ccf0fcdd181bc6e4f5e6f72 100644
--- a/src/view/profil.php
+++ b/src/view/profil.php
@@ -8,7 +8,7 @@
         <div class="row">
             <div class="col-3"><span class="logo"></span></div>
             <div class="col-3 text-right">
-                <p>
+                <p class="user-action">
                     Hi, <b><?=$user->username?></b> !<br>
                     <a href="/">Logout</a>
                 </p>
@@ -41,7 +41,7 @@
         </div>
         <div class="row">
             <?php if ($location_count == 0): ?>
-                <h4>Tidak ada data lokasi :(</h4>
+                <h4 class="text-center">Tidak ada data lokasi :(</h4>
             <?php else:?>
                 <ul>
                     <?php foreach ($location as $data) : ?>