diff --git a/ui/src/components/avatar/story.js b/ui/src/components/avatar/story.js
new file mode 100644
index 00000000..d17e80d5
--- /dev/null
+++ b/ui/src/components/avatar/story.js
@@ -0,0 +1,40 @@
+const React = require('react');
+const fakeData = require('../../shared/fake-data');
+const Base = require('../base');
+
+const {
+  profile
+} = fakeData;
+
+const {
+  storiesOf
+} = require('@kadira/storybook');
+
+const Avatar = require('./');
+
+storiesOf('Avatar', module)
+  .add('Avatar Picture', () => (
+    <Base>
+      <Avatar
+        color='#ef6176'
+        name='Tom'
+        src={profile}
+      />
+    </Base>
+  ))
+  .add('Avatar Text', () => (
+    <Base>
+      <Avatar
+        color='#35a8c0'
+        name='Alex'
+      />
+      <Avatar
+        color='#35a8c0'
+        name='Thomas'
+      />
+      <Avatar
+        color='#35a8c0'
+        name='귀여운 오리'
+      />
+    </Base>
+  ));
\ No newline at end of file
diff --git a/ui/stories/seed.js b/ui/src/shared/fake-data/index.js
similarity index 69%
rename from ui/stories/seed.js
rename to ui/src/shared/fake-data/index.js
index 8a8effca..366dce5e 100644
--- a/ui/stories/seed.js
+++ b/ui/src/shared/fake-data/index.js
@@ -25,6 +25,10 @@ const selectData = [
   }
 ];
 
+// eslint-disable-next-line max-len
+const profile = 'https://pbs.twimg.com/profile_images/641289584580493312/VBfsPlff_400x400.jpg';
+
 module.exports = {
+  profile,
   selectData
 };
\ No newline at end of file
diff --git a/ui/stories/index.js b/ui/stories/index.js
index 31893971..cea79c18 100644
--- a/ui/stories/index.js
+++ b/ui/stories/index.js
@@ -7,7 +7,6 @@ const {
 
 const {
   Base,
-  // Button,
   Container,
   Checkbox,
   Row,
@@ -20,7 +19,6 @@ const {
     AddMetricTile,
     AddMetricTitle
   },
-  Avatar,
   Input,
   List: {
     ListItemDescription,
@@ -56,10 +54,11 @@ const {
   RadioGroup
 } = require('../src/');
 
-const seed = require('./seed');
+const fakeData = require('../src/shared/fake-data');
+
 const {
 	selectData
-} = seed;
+} = fakeData;
 
 const styles = {
   base: {
@@ -115,10 +114,6 @@ storiesOf('Grid', module)
     </Base>
   ));
 
-const profile =
-  'https://pbs.twimg.com/profile_images/' +
-  '641289584580493312/VBfsPlff_400x400.jpg';
-
 storiesOf('Add Metric', module)
   .add('Add Metric', () => (
     <Base>
@@ -153,52 +148,6 @@ storiesOf('Add Metric', module)
     </Base>
   ));
 
-storiesOf('Avatar', module)
-  .add('Avatar Picture', () => (
-    <Avatar
-      color='#ef6176'
-      name='Tom'
-      src={profile}
-    />
-  ))
-  .add('Avatar Text', () => (
-    <Base>
-      <Avatar
-        color='#35a8c0'
-        name='Alex'
-      />
-      <Avatar
-        color='#35a8c0'
-        name='Thomas'
-      />
-      <Avatar
-        color='#35a8c0'
-        name='귀여운 오리'
-      />
-    </Base>
-  ));
-
-// storiesOf('Button', module)
-//   .add('With text', () => (
-//     <Button>
-//       Inspire the lazy
-//     </Button>
-//   )).add('Secondary', () => (
-//     <Button secondary>
-//       Inspire the brave
-//     </Button>
-//   )).add('Disabled', () => (
-//     <Button disabled>
-//       Inspire the liars
-//     </Button>
-//   )).add('Anchor', () => (
-//     <div>
-//       <Button href='#'>
-//         Inspire the anchor
-//       </Button>
-//     </div>
-//   ));
-
 storiesOf('Checkbox', module)
   .add('Default', () => (
     <Checkbox />