diff --git a/app/assets/stylesheets/base.css.scss b/app/assets/stylesheets/base.css.scss
index 546d38ce..1fbe7ce6 100644
--- a/app/assets/stylesheets/base.css.scss
+++ b/app/assets/stylesheets/base.css.scss
@@ -11,6 +11,7 @@ body {
 @import "scss/navbar";
 @import "scss/panel";
 @import "scss/user";
+@import "scss/notifications";
 
 .j2-page {
   padding-top: 30px;
diff --git a/app/assets/stylesheets/scss/notifications.scss b/app/assets/stylesheets/scss/notifications.scss
new file mode 100644
index 00000000..53387790
--- /dev/null
+++ b/app/assets/stylesheets/scss/notifications.scss
@@ -0,0 +1,20 @@
+.notification--img {
+  min-height: 32px;
+  min-width: 32px;
+  height: 32px;
+  width: 32px;
+}
+
+.notification--user, .notification--text {
+  z-index: 99;
+  margin-bottom: 0px;
+}
+
+.notification--icon {
+  position: relative;
+  float: right;
+  font-size: 18px;
+  color: $gray;
+  opacity: 0.8;
+  z-index: 0;
+}
\ No newline at end of file
diff --git a/app/views/notifications/_notification_tabs.html.haml b/app/views/notifications/_notification_tabs.html.haml
new file mode 100644
index 00000000..a0f2489e
--- /dev/null
+++ b/app/views/notifications/_notification_tabs.html.haml
@@ -0,0 +1,9 @@
+.col-md-3.col-xs-12.col-sm-3
+  .panel.panel-default
+    .panel-body
+      %ul.nav.nav-pills.nav-stacked
+        = nav_entry "All notifications", ""
+        = nav_entry "Answers", ""
+        = nav_entry "Likes", ""
+        = nav_entry "Comments", ""
+        = nav_entry "Followers", ""
\ No newline at end of file
diff --git a/app/views/notifications/index.html.erb b/app/views/notifications/index.html.erb
deleted file mode 100644
index 01d10000..00000000
--- a/app/views/notifications/index.html.erb
+++ /dev/null
@@ -1,2 +0,0 @@
-<h1>Notifications#index</h1>
-<p>Find me in app/views/notifications/index.html.erb</p>
diff --git a/app/views/notifications/index.html.haml b/app/views/notifications/index.html.haml
new file mode 100644
index 00000000..2e9e9b1e
--- /dev/null
+++ b/app/views/notifications/index.html.haml
@@ -0,0 +1,54 @@
+.container.j2-page
+  = render 'notification_tabs'
+  .col-md-9.col-xs-12.col-sm-9
+    %ul.list-group
+      %li.list-group-item
+        .media
+          .pull-left
+            %img.notification--img
+          .media-body
+            %h6.media-heading.notification--user
+              username
+            %p.notification--text
+              followed you!
+            .notification--icon
+              %i.fa.fa-users
+      %li.list-group-item
+        .media
+          .pull-left
+            %img.notification--img
+          .media-body
+            %h6.media-heading.notification--user
+              username
+            %p.notification--text
+              answered
+              %a your question
+              some time ago!
+            .notification--icon
+              %i.fa.fa-exclamation
+      %li.list-group-item
+        .media
+          .pull-left
+            %img.notification--img
+          .media-body
+            %h6.media-heading.notification--user
+              username
+            %p.notification--text
+              smiled at
+              %a your answer
+              some time ago!
+            .notification--icon
+              %i.fa.fa-smile-o
+      %li.list-group-item
+        .media
+          .pull-left
+            %img.notification--img
+          .media-body
+            %h6.media-heading.notification--user
+              username
+            %p.notification--text
+              commented
+              %a your answer
+              some time ago!
+            .notification--icon
+              %i.fa.fa-comments
\ No newline at end of file