diff --git a/apps/ui-tests-app/animations/background.ts b/apps/ui-tests-app/animations/background.ts
new file mode 100644
index 000000000..c0dbf9202
--- /dev/null
+++ b/apps/ui-tests-app/animations/background.ts
@@ -0,0 +1,23 @@
+import observable = require("data/observable");
+import pages = require("ui/page");
+import viewModule = require("ui/core/view");
+import color = require("color");
+
+var view: viewModule.View;
+
+export function pageLoaded(args: observable.EventData) {
+    var page = <pages.Page>args.object;
+    view = page.getViewById<viewModule.View>("view");
+}
+
+export function onAnimate(args: observable.EventData) {
+    view.backgroundColor = new color.Color("Green");
+    view.animate({
+        backgroundColor: new color.Color("Blue"),
+        duration: 2500
+    });
+}
+
+export function onReset(args: observable.EventData) {
+    view.backgroundColor = new color.Color("White");
+}
\ No newline at end of file
diff --git a/apps/ui-tests-app/animations/background.xml b/apps/ui-tests-app/animations/background.xml
new file mode 100644
index 000000000..8d1c70e91
--- /dev/null
+++ b/apps/ui-tests-app/animations/background.xml
@@ -0,0 +1,9 @@
+<Page loaded="pageLoaded">
+  <StackLayout>
+    <Button text="Animate" tap="onAnimate"/>
+    <Button text="Reset" tap="onReset"/>
+    <AbsoluteLayout width="300" height="300" clipToBounds="true" backgroundColor="LightGray">
+      <Button id="view" text="{N}" width="100" height="100" left="100" top="100" style.textAlignment="center" backgroundColor="White" style.fontSize="30"/>
+    </AbsoluteLayout>
+  </StackLayout>
+</Page>
\ No newline at end of file