diff --git a/bower.json b/bower.json
index 83ea4719..b2ccfa88 100644
--- a/bower.json
+++ b/bower.json
@@ -22,7 +22,9 @@
     "stf-graphics": "git@ghe.amb.ca.local:stf/stf-graphics.git",
     "angular-bootstrap": "~0.10.0",
     "angular-dialog-service": "~3.1.0",
-    "ng-file-upload": "~1.2.9"
+    "ng-file-upload": "~1.2.9",
+    "angular-animate": "~1.2.15",
+    "angular-growl-v2": "JanStevens/angular-growl-2#~0.5.3"
   },
   "private": true,
   "resolutions": {
diff --git a/res/app/app.js b/res/app/app.js
index caed8e75..97825f04 100644
--- a/res/app/app.js
+++ b/res/app/app.js
@@ -1,6 +1,7 @@
 require('angular')
 require('angular-route')
 
+
 require('angular-gettext')
 require('ng-file-upload')
 
diff --git a/res/app/components/stf/common-ui/index.js b/res/app/components/stf/common-ui/index.js
index d8f5c4bc..6221f074 100644
--- a/res/app/components/stf/common-ui/index.js
+++ b/res/app/components/stf/common-ui/index.js
@@ -2,5 +2,6 @@ module.exports = angular.module('stf/common-ui', [
   require('./clear-button').name,
   require('./filter-button').name,
   require('./nothing-to-show').name,
-  require('./table').name
+  require('./table').name,
+  require('./notifications').name
 ])
\ No newline at end of file
diff --git a/res/app/components/stf/common-ui/notifications/growl.css b/res/app/components/stf/common-ui/notifications/growl.css
new file mode 100644
index 00000000..8b2e5495
--- /dev/null
+++ b/res/app/components/stf/common-ui/notifications/growl.css
@@ -0,0 +1,26 @@
+.growl {
+  position: fixed;
+  top: 60px;
+  right: 15px;
+  float: right;
+  width: 250px;
+  z-index: 9999;
+}
+
+.growl-item.ng-enter,
+.growl-item.ng-leave {
+  -webkit-transition: 0.3s linear all;
+  -moz-transition: 0.3s linear all;
+  -o-transition: 0.3s linear all;
+  transition: 0.3s linear all;
+}
+
+.growl-item.ng-enter,
+.growl-item.ng-leave.ng-leave-active {
+  opacity: 0;
+}
+
+.growl-item.ng-leave,
+.growl-item.ng-enter.ng-enter-active {
+  opacity: 1;
+}
diff --git a/res/app/components/stf/common-ui/notifications/index.js b/res/app/components/stf/common-ui/notifications/index.js
new file mode 100644
index 00000000..4e6f1c9f
--- /dev/null
+++ b/res/app/components/stf/common-ui/notifications/index.js
@@ -0,0 +1,9 @@
+require('angular-animate')
+//require('angular-growl-v2/build/angular-growl.min.css')
+require('./growl.css')
+require('angular-growl-v2/build/angular-growl.js')
+
+module.exports = angular.module('stf/common-ui/notifications', [
+  'ngAnimate',
+  'angular-growl'
+])
diff --git a/res/app/layout/index.js b/res/app/layout/index.js
index 5c307ab3..9dda3565 100644
--- a/res/app/layout/index.js
+++ b/res/app/layout/index.js
@@ -15,6 +15,7 @@ require('./stf-styles.css')
 require('./small.css')
 
 module.exports = angular.module('layout', [
-  'fa.directive.borderLayout'
+  'fa.directive.borderLayout',
+  require('stf/common-ui').name
 ])
   .controller('LayoutCtrl', require('./layout-controller'))
diff --git a/res/app/views/index.jade b/res/app/views/index.jade
index b99dc348..d4bc9e99 100644
--- a/res/app/views/index.jade
+++ b/res/app/views/index.jade
@@ -10,6 +10,7 @@ html
           div(ng-include='"menu.jade"')
         div(pane, pane-anchor='center').fill-height
           socket-state
+          div(growl)
           div(ng-view).fill-height
 
     script(src='/static/build/bundle.js')
diff --git a/webpack.config.js b/webpack.config.js
index 9347dd4d..364369b7 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -18,6 +18,8 @@ module.exports = {
     ]
   , alias: {
       'angular-bootstrap': 'angular-bootstrap/ui-bootstrap-tpls'
+    , 'angular-growl': 'angular-growl-v2/build/angular-growl.js'
+    , 'angular-growl-css': 'angular-growl-v2/build/angular-growl.min.css'
     , 'localforage': 'localforage/dist/localforage.js'
     , 'socket.io': 'socket.io-client/dist/socket.io'
     , 'oboe': 'oboe/dist/oboe-browser'
@@ -45,6 +47,8 @@ module.exports = {
     , { test: /\.html/, loader: 'html-loader' }
     , { test: /angular\.js/, loader: 'exports?angular'}
     , { test: /angular-route\.js/, loader: 'imports?angular=angular'}
+    , { test: /angular-animate\.js/, loader: 'imports?angular=angular'}
+    , { test: /angular-growl\.js/, loader: 'imports?angular=angular'}
     , { test: /oboe-browser\.js/, loader: 'imports?define=>false!exports?oboe'}
     , { test: /localforage\.js/, loader: 'script'}
     , { test: /ui-bootstrap-tpls\.js/, loader: 'script'}