diff --git a/PanoPainter.vcxproj b/PanoPainter.vcxproj
index d1290a1..89913b0 100644
--- a/PanoPainter.vcxproj
+++ b/PanoPainter.vcxproj
@@ -192,6 +192,7 @@
     <ClCompile Include="src\node_button.cpp" />
     <ClCompile Include="src\node_button_custom.cpp" />
     <ClCompile Include="src\node_canvas.cpp" />
+    <ClCompile Include="src\node_changelog.cpp" />
     <ClCompile Include="src\node_checkbox.cpp" />
     <ClCompile Include="src\node_colorwheel.cpp" />
     <ClCompile Include="src\node_color_quad.cpp" />
@@ -218,6 +219,7 @@
     <ClCompile Include="src\node_stroke_preview.cpp" />
     <ClCompile Include="src\node_text.cpp" />
     <ClCompile Include="src\node_text_input.cpp" />
+    <ClCompile Include="src\node_usermanual.cpp" />
     <ClCompile Include="src\node_viewport.cpp" />
     <ClCompile Include="src\pch.cpp">
       <PrecompiledHeader Condition="'$(Configuration)|$(Platform)'=='Debug|Win32'">Create</PrecompiledHeader>
@@ -308,6 +310,7 @@
     <ClInclude Include="src\node_button.h" />
     <ClInclude Include="src\node_button_custom.h" />
     <ClInclude Include="src\node_canvas.h" />
+    <ClInclude Include="src\node_changelog.h" />
     <ClInclude Include="src\node_checkbox.h" />
     <ClInclude Include="src\node_colorwheel.h" />
     <ClInclude Include="src\node_color_quad.h" />
@@ -334,6 +337,7 @@
     <ClInclude Include="src\node_stroke_preview.h" />
     <ClInclude Include="src\node_text.h" />
     <ClInclude Include="src\node_text_input.h" />
+    <ClInclude Include="src\node_usermanual.h" />
     <ClInclude Include="src\node_viewport.h" />
     <ClInclude Include="src\pch.h" />
     <ClInclude Include="src\rtt.h" />
diff --git a/PanoPainter.vcxproj.filters b/PanoPainter.vcxproj.filters
index f3ef843..bb3dd31 100644
--- a/PanoPainter.vcxproj.filters
+++ b/PanoPainter.vcxproj.filters
@@ -255,6 +255,12 @@
     <ClCompile Include="src\node_about.cpp">
       <Filter>Source Files\ui</Filter>
     </ClCompile>
+    <ClCompile Include="src\node_changelog.cpp">
+      <Filter>Source Files\ui</Filter>
+    </ClCompile>
+    <ClCompile Include="src\node_usermanual.cpp">
+      <Filter>Source Files\ui</Filter>
+    </ClCompile>
   </ItemGroup>
   <ItemGroup>
     <ClInclude Include="src\app.h">
@@ -455,6 +461,12 @@
     <ClInclude Include="src\node_about.h">
       <Filter>Header Files\ui</Filter>
     </ClInclude>
+    <ClInclude Include="src\node_changelog.h">
+      <Filter>Header Files\ui</Filter>
+    </ClInclude>
+    <ClInclude Include="src\node_usermanual.h">
+      <Filter>Header Files\ui</Filter>
+    </ClInclude>
   </ItemGroup>
   <ItemGroup>
     <ResourceCompile Include="PanoPainter.rc">
diff --git a/data/doc/images/panopainter-doc-brush-settings.jpg b/data/doc/images/panopainter-doc-brush-settings.jpg
new file mode 100644
index 0000000..ddb7a02
Binary files /dev/null and b/data/doc/images/panopainter-doc-brush-settings.jpg differ
diff --git a/data/doc/images/panopainter-doc-layers.jpg b/data/doc/images/panopainter-doc-layers.jpg
new file mode 100644
index 0000000..13a6557
Binary files /dev/null and b/data/doc/images/panopainter-doc-layers.jpg differ
diff --git a/data/doc/images/panopainter-doc-menu-file.jpg b/data/doc/images/panopainter-doc-menu-file.jpg
new file mode 100644
index 0000000..8b623dc
Binary files /dev/null and b/data/doc/images/panopainter-doc-menu-file.jpg differ
diff --git a/data/doc/images/panopainter-doc-menu-layers.jpg b/data/doc/images/panopainter-doc-menu-layers.jpg
new file mode 100644
index 0000000..5117ace
Binary files /dev/null and b/data/doc/images/panopainter-doc-menu-layers.jpg differ
diff --git a/data/doc/images/panopainter-doc-menu-timelapse.jpg b/data/doc/images/panopainter-doc-menu-timelapse.jpg
new file mode 100644
index 0000000..d06fd16
Binary files /dev/null and b/data/doc/images/panopainter-doc-menu-timelapse.jpg differ
diff --git a/data/doc/images/panopainter-doc-overview.jpg b/data/doc/images/panopainter-doc-overview.jpg
new file mode 100644
index 0000000..6539441
Binary files /dev/null and b/data/doc/images/panopainter-doc-overview.jpg differ
diff --git a/data/layout.xml b/data/layout.xml
index f438c17..edf9738 100644
--- a/data/layout.xml
+++ b/data/layout.xml
@@ -684,6 +684,42 @@ Here's a list of what's available in this release.
     </border>
   </layout>
   
+    <!--UserManual window-->
+  <layout id="usermanual">
+    <border positioning="absolute" position="0 0" color=".4 .4 .4 .8" width="100%" height="100%" align="center" justify="center">
+      <border thickness="1" border-color=".2" pad="3" max-width="650">
+        <border width="100%" height="30" color=".2 .2 .2 .9" dir="row" align="center" justify="center">
+          <text text="PanoPainter User Manual" font-face="arial" font-size="11"></text>
+        </border>
+        <border width="100%" color="0 0 0 .9" pad="10" dir="col">
+          <!--window content-->
+          <border color=".2" width="100%" height="500">
+            <scroll pad="10" margin="5" color="1" dir="col" shrink="1">
+              <node align="center" margin="10 0 10 0"><text color="0" font-face="arial" font-size="30" text="Gettings started with PanoPainter"/></node>
+              <image path="data/doc/images/panopainter-doc-overview.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
+              <node align="center" margin="40 0 20 0"><text color="0" font-face="arial" font-size="30" text="Brush Settings"/></node>
+              <image path="data/doc/images/panopainter-doc-brush-settings.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
+              <node align="center" margin="40 0 20 0"><text color="0" font-face="arial" font-size="30" text="Layers Settings"/></node>
+              <image path="data/doc/images/panopainter-doc-layers.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
+              <node align="center" margin="40 0 20 0"><text color="0" font-face="arial" font-size="30" text="File Menu"/></node>
+              <image path="data/doc/images/panopainter-doc-menu-file.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
+              <node align="center" margin="40 0 20 0"><text color="0" font-face="arial" font-size="30" text="Layers Menu"/></node>
+              <image path="data/doc/images/panopainter-doc-menu-layers.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
+              <node align="center" margin="40 0 20 0"><text color="0" font-face="arial" font-size="30" text="Timelapse Menu"/></node>
+              <image path="data/doc/images/panopainter-doc-menu-timelapse.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
+              <node height="40" margin="0 0 40 0"></node>
+            </scroll>
+          </border>
+          <!--footer buttons-->
+          <node height="40" grow="1" dir="row" align="flex-end" justify="flex-end">
+            <button id="btn-ok" text="Ok" width="100" height="30" margin="0 10 0 0"/>
+          </node>
+        </border>
+      </border>
+    </border>
+  </layout>
+
+  
   <!--popup menu-->
   <layout id="popup-menu">
     <popup-menu positioning="absolute" position="100 100" width="150" thickness="1" border-color=".1" color=".4 .4 .4 .8" dir="col">
@@ -844,7 +880,6 @@ Here's a list of what's available in this release.
     </popup-menu>
   </layout>
 
-  
   <!-- about menu -->
   <layout id="about-menu">
     <popup-menu positioning="absolute" position="100 100" width="200" thickness="1" border-color=".1" color=".4 .4 .4 .8" dir="col">
diff --git a/src/app.h b/src/app.h
index 6c71560..77ebd9a 100644
--- a/src/app.h
+++ b/src/app.h
@@ -140,6 +140,7 @@ public:
     void init_menu_layer();
     void init_menu_timelapse();
     void init_menu_about();
+    void dialog_usermanual();
     void dialog_changelog();
     void dialog_about();
     void dialog_newdoc();
diff --git a/src/app_dialogs.cpp b/src/app_dialogs.cpp
index 082cc2a..00eba77 100644
--- a/src/app_dialogs.cpp
+++ b/src/app_dialogs.cpp
@@ -5,6 +5,7 @@
 #include "node_dialog_cloud.h"
 #include "node_about.h"
 #include "node_changelog.h"
+#include "node_usermanual.h"
 
 std::shared_ptr<NodeProgressBar> App::show_progress(const std::string& title)
 {
@@ -19,6 +20,18 @@ std::shared_ptr<NodeProgressBar> App::show_progress(const std::string& title)
     return pb;
 }
 
+void App::dialog_usermanual()
+{
+    auto dialog = std::make_shared<NodeUserManual>();
+    dialog->m_manager = &layout;
+    dialog->init();
+    dialog->create();
+    dialog->loaded();
+
+    layout[main_id]->add_child(dialog);
+    layout[main_id]->update();
+}
+
 void App::dialog_changelog()
 {
     auto dialog = std::make_shared<NodeChangelog>();
diff --git a/src/app_layout.cpp b/src/app_layout.cpp
index 0ad8422..a908ec3 100644
--- a/src/app_layout.cpp
+++ b/src/app_layout.cpp
@@ -546,8 +546,9 @@ void App::init_menu_about()
             };
 
             popup->find<NodeButtonCustom>("about-doc")->on_click = [this](Node*) {
-                auto path = Asset::absolute("data/doc/test.pdf");
-                display_file(path);
+//                 auto path = Asset::absolute("data/doc/test.pdf");
+//                 display_file(path);
+                dialog_usermanual();
                 popup->mouse_release();
                 popup->destroy();
             };
diff --git a/src/node.cpp b/src/node.cpp
index 61b93b5..f2396cf 100644
--- a/src/node.cpp
+++ b/src/node.cpp
@@ -33,6 +33,7 @@
 #include "node_panel_grid.h"
 #include "node_about.h"
 #include "node_changelog.h"
+#include "node_usermanual.h"
 
 void Node::async_start()
 {
@@ -903,6 +904,7 @@ void Node::load_internal(const tinyxml2::XMLElement* x_node)
             CASE(kWidget::ColorPicker, NodeColorPicker);
             CASE(kWidget::About, NodeAbout);
             CASE(kWidget::Changelog, NodeChangelog);
+            CASE(kWidget::UserManual, NodeUserManual);
 #undef  CASE
         case kWidget::Ref:
         {
diff --git a/src/node.h b/src/node.h
index 0f73950..9f02d4b 100644
--- a/src/node.h
+++ b/src/node.h
@@ -43,6 +43,7 @@ enum class kAttribute : uint16_t
     Mips = const_hash("mips"),
     Default = const_hash("default"),
     RTL = const_hash("rtl"),
+    AutoSize = const_hash("autosize"),
 };
 
 enum class kWidget : uint16_t
@@ -83,6 +84,7 @@ enum class kWidget : uint16_t
     ColorPicker = const_hash("color-picker"),
     About = const_hash("about"),
     Changelog = const_hash("changelog"),
+    UserManual = const_hash("usermanual"),
 };
 
 class Node
diff --git a/src/node_image.cpp b/src/node_image.cpp
index 570e829..f103a96 100644
--- a/src/node_image.cpp
+++ b/src/node_image.cpp
@@ -40,6 +40,8 @@ void NodeImage::create()
         auto tex_sz = TextureManager::get(m_tex_id).size();
         m_off = xy(m_region) / tex_sz;
         m_sz = (zw(m_region) - xy(m_region)) / tex_sz;
+        if (m_autosize)
+            SetAspectRatio(tex_sz.x / tex_sz.y);
     }
 }
 
@@ -72,6 +74,9 @@ void NodeImage::parse_attributes(kAttribute ka, const tinyxml2::XMLAttribute* at
         }
         break;
     }
+    case kAttribute::AutoSize:
+        m_autosize = attr->BoolValue();
+        break;
     default:
         break;
     }
diff --git a/src/node_image.h b/src/node_image.h
index cc8efc2..91ef9fc 100644
--- a/src/node_image.h
+++ b/src/node_image.h
@@ -11,6 +11,7 @@ public:
     static Sampler m_sampler_mips;
     bool m_use_atlas = false;
     bool m_use_mipmaps = false;
+    bool m_autosize = false;
     glm::vec4 m_region;
     glm::vec2 m_off;
     glm::vec2 m_sz;
diff --git a/src/node_usermanual.cpp b/src/node_usermanual.cpp
new file mode 100644
index 0000000..18121d8
--- /dev/null
+++ b/src/node_usermanual.cpp
@@ -0,0 +1,26 @@
+#include "pch.h"
+#include "log.h"
+#include "node_usermanual.h"
+#include "layout.h"
+
+Node* NodeUserManual::clone_instantiate() const
+{
+    return new NodeUserManual();
+}
+
+void NodeUserManual::init()
+{
+    SetPosition(0, 0);
+    SetWidthP(100);
+    SetHeightP(100);
+    SetPositioning(YGPositionTypeAbsolute);
+    m_template = (*m_manager)[const_hash("usermanual")]->m_children[0]->clone();
+    add_child(m_template);
+    btn_ok = m_template->find<NodeButton>("btn-ok");
+    btn_ok->on_click = [&](Node*) { destroy(); };
+}
+
+kEventResult NodeUserManual::handle_event(Event* e)
+{
+    return kEventResult::Consumed;
+}
diff --git a/src/node_usermanual.h b/src/node_usermanual.h
new file mode 100644
index 0000000..a65828d
--- /dev/null
+++ b/src/node_usermanual.h
@@ -0,0 +1,13 @@
+#pragma once
+#include "node.h"
+#include "node_button.h"
+
+class NodeUserManual : public Node
+{
+    Node* m_template;
+    NodeButton* btn_ok;
+public:
+    virtual Node* clone_instantiate() const override;
+    virtual void init() override;
+    virtual kEventResult handle_event(Event* e) override;
+};