diff --git a/app/index.html b/app/index.html
index dae9190..9bcabba 100644
--- a/app/index.html
+++ b/app/index.html
@@ -47,7 +47,7 @@
     <script src="bower_components/json3/lib/json3.min.js"></script>
     <![endif]-->
     <script type="text/javascript">
-        var VERSION = '26-11_01';
+        var VERSION = '27-11_01';
         var require = {
           urlArgs: "ver="+VERSION,
         };
diff --git a/app/scripts/controllers/tshirtdesign.js b/app/scripts/controllers/tshirtdesign.js
index 4750bd8..56a66f5 100644
--- a/app/scripts/controllers/tshirtdesign.js
+++ b/app/scripts/controllers/tshirtdesign.js
@@ -1,5 +1,6 @@
 define(['app'], function (app) {
-	app.controller('TshirtdesignCtrl', function ($scope, $rootScope, $window, $timeout, $illustration) {
+	app.controller('TshirtdesignCtrl', function ($scope, $rootScope, $window, $timeout, $illustration, $favorite) {
+		$scope.savedFrameView = 'views/design_part/tshirt-saved.html?ver='+VERSION;
 		var canvas = new fabric.Canvas('main-design-container');
 		//Set width and height canvas
 		function setSizeCanvas() {
@@ -221,7 +222,7 @@ define(['app'], function (app) {
 			console.log(object.oCoords,object.originalState);
 			object.setCoords();
 			var Coords = object.oCoords;
-			var diffX = 55, diffY=50;
+			var diffX = 40, diffY=40;
 			var xAngle = Math.cos(object.getAngle() * (Math.PI / 180))/2;
 			var yAngle = Math.sin(object.getAngle() * (Math.PI / 180))/2;
 			$('#object-border-left').css({'height':Math.ceil(object.originalState.height*object.scaleY), top: Coords.tl.y+diffY, left: Coords.tl.x+diffX});
@@ -613,5 +614,44 @@ define(['app'], function (app) {
 			// console.log();
 			$('#tshirt-design').modal('hide');
 		}
+		
+		$scope.showRecommend = function(){
+			$('#tshirt-design-saved').modal({
+				backdrop: 'static',
+				keyboard: false
+			});
+		}
+		
+		$scope.closeSavedModal = function(){
+			$('#tshirt-design-saved').modal('hide');
+		}
+		
+		$scope.openSavedTab = function(tab){
+			$scope.recommendList = $favorite.getAll();
+			$scope.favoriteList = $favorite.getAll();
+			$('#tshirt-design-saved .subframe-design .nav-tabs li').removeClass('active');
+			$('#tab-saved-'+tab).addClass('active');
+			$('#tshirt-design-saved .subframe-design .tab-content .tab-pane').removeClass('active');
+			$('#content-saved-'+tab).addClass('active');
+			
+			$timeout(function(){
+				$('.saved-item').tooltip({
+					animated: 'fade',
+					placement: 'bottom',
+					html: true
+				});
+			},1000);
+		}
+		
+		$scope.saveFavorite = function(){
+			var dataDump = {
+				thumb: canvas.toDataURL('png'),
+				data: canvas.toDatalessJSON()
+			}
+			$favorite.addToFavorite({
+				data: dataDump
+			})
+			console.log(dataDump);
+		}
 	});
 });
diff --git a/app/scripts/routes.js b/app/scripts/routes.js
index dcc8487..16ab3e4 100644
--- a/app/scripts/routes.js
+++ b/app/scripts/routes.js
@@ -9,6 +9,7 @@ define([], function(){
                     'scripts/controllers/main.js',
                     'scripts/controllers/tshirtdesign.js',
                     'scripts/services/illustration.js',
+                    'scripts/services/favorite.js',
                     'scripts/services/tshirt.js'
                 ]
             },
diff --git a/app/scripts/services/favorite.js b/app/scripts/services/favorite.js
new file mode 100644
index 0000000..bda68da
--- /dev/null
+++ b/app/scripts/services/favorite.js
@@ -0,0 +1,67 @@
+define(['app'], function (app) {
+    'use strict';
+
+    app.factory('$favorite', function ($http, $rootScope) {
+        var DATA = [];
+
+        return {
+            loadFromRemote: function (params,successHandle,errorHandle) {
+                /*** load from localstorage for test */
+                if ($window.localStorage.listFavorite){
+                    DATA = JSON.parse($window.localStorage.listFavorite);
+                }else{
+                    DATA = [];
+                }
+                return;
+                /*** end test */
+                
+                // return format: { status:0|1 , data:{} }
+                var httpObj = $http({
+                    url: $rootScope.API_URL+'/apiv1/favorite',
+                    method: 'GET',
+                    params: params || []
+                });
+                if (typeof successHandle == 'undefined'){
+                    successHandle = function(response){
+                        if (response.status==1){
+                            DATA = response.data;
+                        }
+                    }
+                }
+                httpObj.success(successHandle);
+                
+                if (typeof errorHandle != 'undefined'){
+                    httpObj.error(errorHandle);
+                }
+            },
+            addToFavorite: function(params,successHandle,errorHandle) {
+                /*** load from localstorage for test */
+                DATA.push(params.data);
+                $window.localStorage.listFavorite = JSON.stringify(DATA);
+                return;
+                /*** end test */
+                
+                var httpObj = $http({
+                    url: $rootScope.API_URL+'/apiv1/favorite',
+                    method: 'POST',
+                    params: params || []
+                });
+                if (typeof successHandle == 'undefined'){
+                    successHandle = function(response){
+                        if (response.status==1){
+                            DATA = response.data;
+                        }
+                    }
+                }
+                httpObj.success(successHandle);
+                
+                if (typeof errorHandle != 'undefined'){
+                    httpObj.error(errorHandle);
+                }
+            },
+            getAll: function(){
+                return DATA;
+            }
+        };
+    });
+});
diff --git a/app/styles/main.css b/app/styles/main.css
index cd82323..8edff6b 100644
--- a/app/styles/main.css
+++ b/app/styles/main.css
@@ -814,4 +814,49 @@ footer ul.nav-footer li a{
   .tshirt-design-container .design-content{
     padding: 0 0;
   }
+}
+
+
+
+#tshirt-design-saved .subframe-design {
+  width: 80%;
+  margin: auto;
+  margin-top: 150px;
+  border: 10px solid rgb(0, 0, 0);
+  border: 20px solid rgba(0, 0, 0, .5);
+  -webkit-background-clip: padding-box; /* for Safari */
+  background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
+}
+
+#tshirt-design-saved .modal-content button.close {
+  margin-right: 100px;
+  font-size: 41px;
+  margin-top: -10px;
+}
+
+#tshirt-design-saved .subframe-design .nav-tabs {
+  background: rgba(0, 0, 0, .5);
+  border-bottom: 1px solid #F5F5F5;
+}
+
+#tshirt-design-saved .subframe-design .nav-tabs li a {
+  text-decoration: none;
+  background-color: #CCC;
+  cursor: pointer;
+  margin-right: 10px;
+  padding: 2px 30px;
+  color: #000;
+  font-weight: 600;
+  border-bottom: 1px solid #F5F5F5
+}
+
+#tshirt-design-saved .subframe-design .nav-tabs li.active a {
+  background: #F5F5F5;
+  color: #fe070f;
+}
+
+#tshirt-design-saved .subframe-design .tab-content {
+  background: #F5F5F5;
+    width: 100%;
+    min-height: 400px;
 }
\ No newline at end of file
diff --git a/app/views/design_part/tshirt-saved.html b/app/views/design_part/tshirt-saved.html
new file mode 100644
index 0000000..d9b69ee
--- /dev/null
+++ b/app/views/design_part/tshirt-saved.html
@@ -0,0 +1,30 @@
+<!-- Modal -->
+<div class="modal" id="tshirt-design-saved" tabindex="2" role="dialog">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <button type="button" class="close" ng-click="closeSavedModal()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+            <div class="subframe-design">
+                <ul class="nav nav-tabs" role="tablist">
+                    <li role="presentation" id="tab-saved-favorite" class="active"><a ng-click="openSavedTab('favorite')" role="tab" data-toggle="tab">マイアルバム</a></li>
+                    <li role="presentation" id="tab-saved-recommend"><a ng-click="openSavedTab('recommend')" role="tab" data-toggle="tab">おすすめ</a></li>
+                </ul>
+                <div class="tab-content">
+                    <div role="tabpanel" class="tab-pane active" id="content-saved-favorite">
+                        <div class="saved-list" ng-init="currentFavoritePage=1;perFavoritePage=16">
+                            <div class="saved-item" ng-repeat="item in favoriteList | limitTo:perFavoritePage:((currentFavoritePage-1)*perFavoritePage)" ng-click="restoreSaved(item)" title="<img src='{{item.thumb}}' style='width:200px;background:#e2e2e2;margin:0;padding:0;margin-left:-8px;border:0'/>" data-toggle="tooltip">
+                                <img ng-src="{{item.path}}"/>
+                            </div>
+                            <div class="clearfix"></div>
+                            <div class="footer-bar">
+                                <div class="pull-left footer-pagination" ng-click="currentIllustrationPage=currentIllustrationPage-1" ng-show="currentIllustrationPage > 1">< Back</div>
+                                {{currentIllustrationPage}}/{{currentIllustrationCate.list.length/perIllustrationPage | number:0}}
+                                <div class="pull-right footer-pagination" ng-click="currentIllustrationPage=currentIllustrationPage+1" ng-show="currentIllustrationPage < (currentIllustrationCate.list.length/perIllustrationPage|number:0)">Next ></div>
+                            </div>
+                        </div>
+                    </div>
+                    <div role="tabpanel" class="tab-pane" id="content-saved-recommend">...</div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/app/views/tshirt-design.html b/app/views/tshirt-design.html
index 51d50d6..6c42e61 100644
--- a/app/views/tshirt-design.html
+++ b/app/views/tshirt-design.html
@@ -26,10 +26,10 @@
                     </div>
 
                     <div class="action pull-right">
-                        <button class="white">
+                        <button class="white" ng-click="showRecommend()">
                             アルバムを開く
                         </button>
-                        <button class="white">
+                        <button class="white" ng-click="saveFavorite()">
                             アルバムに入れる
                         </button>
                     </div>
@@ -74,4 +74,6 @@
             </div>
         </div>
     </div>
+    
+    <div ng-include="savedFrameView"></div>
 </div>
\ No newline at end of file