diff --git a/package.json b/package.json
index 2149488e5..cf6f649c9 100644
--- a/package.json
+++ b/package.json
@@ -109,8 +109,8 @@
     "pre-commit": "1.x",
     "querystring": "^0.2.0",
     "ramda": "^0.20.1",
-    "rc-scroll-anim": "^0.1.7",
-    "rc-tween-one": "^0.1.8",
+    "rc-scroll-anim": "0.2.x",
+    "rc-tween-one": "0.2.x",
     "react": "^15.0.0",
     "react-addons-test-utils": "^15.0.0",
     "react-copy-to-clipboard": "^4.0.1",
diff --git a/site/component/Home/Banner.jsx b/site/component/Home/Banner.jsx
index 62220b0ad..40dd8fee5 100644
--- a/site/component/Home/Banner.jsx
+++ b/site/component/Home/Banner.jsx
@@ -33,7 +33,7 @@ export default class Banner extends React.Component {
             <GitHubButton key="github-button" type="stargazers"
               namespace="ant-design" repo="ant-design" />
           </QueueAnim>
-          <TweenOne className="down" vars={[{ opacity: 1 }, { y: 10, duration: 800, yoyo: true, repeat: -1 }]}>
+          <TweenOne className="down" animation={[{ opacity: 1 }, { y: 10, duration: 800, yoyo: true, repeat: -1 }]}>
             <Icon type="down" />
           </TweenOne>
         </ScrollElement>
diff --git a/site/component/Home/Page1.jsx b/site/component/Home/Page1.jsx
index c618820d7..cd8dc97eb 100644
--- a/site/component/Home/Page1.jsx
+++ b/site/component/Home/Page1.jsx
@@ -21,8 +21,8 @@ export default class Page1 extends React.Component {
   render() {
     return (
       <ScrollOverPack scrollName="page1" className="content-wrapper page" playScale={1} replay scrollEvent={onScrollEvent}>
-        <TweenOne key="image" className="image1 image-wrapper" vars={{ x: 0, opacity: 1, duration: 550 }}
-          style={{ transform: 'translateX(-100px)', opacity: 0 }} hideProps={{ type: 'reverse' }} />
+        <TweenOne key="image" className="image1 image-wrapper" animation={{ x: 0, opacity: 1, duration: 550 }}
+          style={{ transform: 'translateX(-100px)', opacity: 0 }} hideProps={{ reverse: true }} />
           <QueueAnim className="text-wrapper" delay={300} key="text" duration={550} leaveReverse
             hideProps={{ child: null }}>
             <h2 key="h2">最佳实践</h2>
diff --git a/site/component/Home/Page2.jsx b/site/component/Home/Page2.jsx
index 987da6d72..89bc65985 100644
--- a/site/component/Home/Page2.jsx
+++ b/site/component/Home/Page2.jsx
@@ -23,8 +23,8 @@ export default class Page2 extends React.Component {
             </Link>
           </div>
         </QueueAnim>
-        <TweenOne key="image" className="image2 image-wrapper" vars={{ x: 0, opacity: 1, delay: 300, duration: 550 }}
-          style={{ transform: 'translateX(100px)', opacity: 0 }} hideProps={{ type: 'reverse' }} />
+        <TweenOne key="image" className="image2 image-wrapper" animation={{ x: 0, opacity: 1, delay: 300, duration: 550 }}
+          style={{ transform: 'translateX(100px)', opacity: 0 }} hideProps={{ reverse: true }} />
       </ScrollOverPack>
     );
   }
diff --git a/site/component/Home/Page3.jsx b/site/component/Home/Page3.jsx
index 7ebddc9ba..e7252465f 100644
--- a/site/component/Home/Page3.jsx
+++ b/site/component/Home/Page3.jsx
@@ -9,8 +9,8 @@ export default class Page3 extends React.Component {
   render() {
     return (
       <ScrollOverPack scrollName="page3" className="content-wrapper page" playScale={1} replay>
-        <TweenOne key="image" className="image3 image-wrapper" vars={{ x: 0, opacity: 1, duration: 550 }}
-          style={{ transform: 'translateX(-100px)', opacity: 0 }} hideProps={{ type: 'reverse' }} />
+        <TweenOne key="image" className="image3 image-wrapper" animation={{ x: 0, opacity: 1, duration: 550 }}
+          style={{ transform: 'translateX(-100px)', opacity: 0 }} hideProps={{ reverse: true }} />
         <QueueAnim className="text-wrapper" delay={300} key="text" duration={550} leaveReverse style={{ top: '40%' }}
           hideProps={{ child: null }}>
           <h2 key="h2">丰富的基础组件</h2>
diff --git a/site/component/Home/Page4.jsx b/site/component/Home/Page4.jsx
index beb41a853..17b43e693 100644
--- a/site/component/Home/Page4.jsx
+++ b/site/component/Home/Page4.jsx
@@ -12,8 +12,8 @@ export default class Page4 extends React.Component {
           <h2 key="h2">微小·确定·幸福</h2>
           <p key="p">这是一套致力于提升『用户』和『设计者』使用体验的中后台设计语言。</p>
         </QueueAnim>
-        <TweenOne key="image" className="image4 bottom-wrapper" vars={{ y: 0, opacity: 1, duration: 550, delay: 550 }}
-          style={{ transform: 'translateY(50px)', opacity: 0 }} hideProps={{ type: 'reverse' }} />
+        <TweenOne key="image" className="image4 bottom-wrapper" animation={{ y: 0, opacity: 1, duration: 550, delay: 550 }}
+          style={{ transform: 'translateY(50px)', opacity: 0 }} hideProps={{ reverse: true }} />
       </ScrollOverPack>
     );
   }