diff --git a/src/haxe/ru/m/puzzlez/PuzzlezTheme.hx b/src/haxe/ru/m/puzzlez/PuzzlezTheme.hx
index 550f78f..9ed0ab8 100644
--- a/src/haxe/ru/m/puzzlez/PuzzlezTheme.hx
+++ b/src/haxe/ru/m/puzzlez/PuzzlezTheme.hx
@@ -7,6 +7,7 @@ class PuzzlezTheme extends Theme {
 
     public function new() {
         super({name: "Georgia"}, {light: "gray"}, {base: 22});
+        data.get("frame").data.set("geometry.padding", Box.fromFloat(8));
         register(new Style("view", [
             "skin.background.color" => colors.light,
             "skin.border.color" => colors.border,
diff --git a/src/haxe/ru/m/puzzlez/core/GameUtil.hx b/src/haxe/ru/m/puzzlez/core/GameUtil.hx
index c1c2002..56710ec 100644
--- a/src/haxe/ru/m/puzzlez/core/GameUtil.hx
+++ b/src/haxe/ru/m/puzzlez/core/GameUtil.hx
@@ -63,7 +63,13 @@ class BoundsMap {
 
 class GameUtil {
 
+    private static function normilizeSize(size:Int, maxValue:Int = 8):Int {
+        return Math.isNaN(size) ? maxValue : size < 1 ? 1 : size > maxValue ? maxValue : size;
+    }
+
     public static function buildPreset(image:ImageId, width:Int = 8, height:Int = 8):GamePreset {
+        width = normilizeSize(width);
+        height = normilizeSize(height);
         var offsetX = 500;
         var offsetY = 200;
         var s = width / height;
diff --git a/src/haxe/ru/m/puzzlez/view/PresetFrame.hx b/src/haxe/ru/m/puzzlez/view/PresetFrame.hx
index 5be8b69..519d338 100644
--- a/src/haxe/ru/m/puzzlez/view/PresetFrame.hx
+++ b/src/haxe/ru/m/puzzlez/view/PresetFrame.hx
@@ -1,7 +1,5 @@
 package ru.m.puzzlez.view;
 import haxework.view.form.InputView;
-import openfl.Assets;
-import haxework.view.ImageView;
 import haxework.view.frame.FrameSwitcher;
 import haxework.view.frame.FrameView;
 import ru.m.puzzlez.core.GameUtil;
@@ -11,7 +9,7 @@ import ru.m.puzzlez.storage.ImageStorage;
 @:template class PresetFrame extends FrameView<ImageId> {
     public static var ID = "preset";
 
-    @:view("image") var imageView:ImageView;
+    @:view("image") var imageView:PresetView;
     @:view("width") var widthView:InputView;
     @:view("height") var heightView:InputView;
 
@@ -24,18 +22,22 @@ import ru.m.puzzlez.storage.ImageStorage;
         super(ID);
         widthView.text = "8";
         heightView.text = "8";
+        widthView.update();
+        heightView.update();
     }
 
     override public function onShow(data:ImageId):Void {
         super.onShow(data);
         imageId = data;
-        imageView.image = Assets.getBitmapData("resources/icon.png");
-        imageStorage.resolve(imageId).then(function(image) imageView.image = image);
+        updatePreset();
+    }
+
+    private function updatePreset():Void {
+        imageView.preset = GameUtil.buildPreset(imageId, Std.parseInt(widthView.text), Std.parseInt(heightView.text));
     }
 
     private function start():Void {
-        var preset = GameUtil.buildPreset(imageId, Std.parseInt(widthView.text), Std.parseInt(heightView.text));
-        switcher.change(GameFrame.ID, preset);
+        switcher.change(GameFrame.ID, imageView.preset);
     }
 
     private function back():Void {
diff --git a/src/haxe/ru/m/puzzlez/view/PresetFrame.yaml b/src/haxe/ru/m/puzzlez/view/PresetFrame.yaml
index a763d78..0001e69 100644
--- a/src/haxe/ru/m/puzzlez/view/PresetFrame.yaml
+++ b/src/haxe/ru/m/puzzlez/view/PresetFrame.yaml
@@ -1,20 +1,28 @@
 ---
 style: frame
 views:
+  - $type: haxework.view.group.HGroupView
+    geometry.width: 100%
+    layout.hAlign: center
+    layout.vAlign: middle
+    views:
+      - id: width
+        $type: haxework.view.form.InputView
+        geometry.width: 100
+        +onChange: ~updatePreset()
+      - $type: haxework.view.form.LabelView
+        text: x
+      - id: height
+        $type: haxework.view.form.InputView
+        geometry.width: 100
+        +onChange: ~updatePreset()
+      - $type: haxework.view.form.ButtonView
+        geometry.margin.left: 15
+        text: Start
+        +onPress: ~start()
   - id: image
-    $type: haxework.view.ImageView
-    stretch: false
-    fillType: cover
+    $type: ru.m.puzzlez.view.PresetView
     geometry.stretch: true
-  - id: width
-    $type: haxework.view.form.InputView
-    geometry.width: 100
-  - id: height
-    $type: haxework.view.form.InputView
-    geometry.width: 100
-  - $type: haxework.view.form.ButtonView
-    text: Start
-    +onPress: ~start()
   - $type: haxework.view.form.ButtonView
     text: Back
     geometry.position: absolute
diff --git a/src/haxe/ru/m/puzzlez/view/PresetView.hx b/src/haxe/ru/m/puzzlez/view/PresetView.hx
new file mode 100644
index 0000000..6211069
--- /dev/null
+++ b/src/haxe/ru/m/puzzlez/view/PresetView.hx
@@ -0,0 +1,91 @@
+package ru.m.puzzlez.view;
+
+import flash.display.BitmapData;
+import flash.display.Graphics;
+import flash.display.Shape;
+import flash.geom.Matrix;
+import haxework.view.SpriteView;
+import ru.m.puzzlez.core.GamePreset;
+import ru.m.puzzlez.render.RenderUtil;
+import ru.m.puzzlez.storage.ImageStorage;
+
+class PresetView extends SpriteView {
+    @:provide var imageStorage:ImageStorage;
+
+    public var scale(get, set):Float;
+
+    private function get_scale():Float {
+        return table.scaleX;
+    }
+
+    private function set_scale(value:Float):Float {
+        var result = table.scaleX = table.scaleY = value;
+        table.x = (width - preset.tableRect.width * value) / 2;
+        table.y = (height - preset.tableRect.height * value) / 2;
+        return result;
+    }
+
+    public var preset(default, set):GamePreset;
+
+    private function set_preset(value:GamePreset) {
+        preset = value;
+        table.graphics.clear();
+        imageStorage.resolve(preset.image).then(function(image) {
+            this.image = RenderUtil.cropImage(image, preset.imageRect);
+            toRedraw();
+            toUpdate();
+        });
+        return preset;
+    }
+
+    public function new() {
+        super();
+        table = new Shape();
+        content.addChild(table);
+    }
+
+    private var table:Shape;
+    private var image:BitmapData;
+
+    override public function redraw():Void {
+        if (preset == null || image == null) {
+            return;
+        }
+        var partWidth = preset.imageRect.width / preset.grid.width;
+        var partHeight = preset.imageRect.height / preset.grid.height;
+        var graphics:Graphics = table.graphics;
+        graphics.clear();
+        var matrix = new Matrix();
+        matrix.translate(preset.imageRect.x, preset.imageRect.y);
+        graphics.beginBitmapFill(image, matrix, false, true);
+        graphics.drawRect(preset.imageRect.x, preset.imageRect.y, preset.imageRect.width, preset.imageRect.height);
+        graphics.endFill();
+        graphics.lineStyle(1, 0x555555);
+        for (x in 0...preset.grid.width + 1) {
+            graphics.moveTo(preset.imageRect.x + x * partWidth, preset.imageRect.y);
+            graphics.lineTo(preset.imageRect.x + x * partWidth, preset.imageRect.y + preset.imageRect.height);
+        }
+        for (y in 0...preset.grid.height + 1) {
+            graphics.moveTo(preset.imageRect.x, preset.imageRect.y + y * partHeight);
+            graphics.lineTo(preset.imageRect.x + preset.imageRect.width, preset.imageRect.y + y * partHeight);
+        }
+        graphics.lineStyle(1, 0xcccccc);
+        var offset = 1;
+        for (x in 0...preset.grid.width + 1) {
+            graphics.moveTo(offset + preset.imageRect.x + x * partWidth, preset.imageRect.y);
+            graphics.lineTo(offset + preset.imageRect.x + x * partWidth, preset.imageRect.y + preset.imageRect.height);
+        }
+        for (y in 0...preset.grid.height + 1) {
+            graphics.moveTo(preset.imageRect.x, offset + preset.imageRect.y + y * partHeight);
+            graphics.lineTo(preset.imageRect.x + preset.imageRect.width, offset + preset.imageRect.y + y * partHeight);
+        }
+        graphics.lineStyle();
+    }
+
+    override public function update():Void {
+        super.update();
+        if (preset != null) {
+            scale = Math.min(width / preset.tableRect.width, height / preset.tableRect.height);
+        }
+    }
+}