You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zeppelin.apache.org by mi...@apache.org on 2016/06/15 06:48:06 UTC

zeppelin git commit: [ZEPPELIN-996] Improve first page and dropdown menu in documentation site

Repository: zeppelin
Updated Branches:
  refs/heads/master fc72e12eb -> 5ddc1ef87


[ZEPPELIN-996] Improve first page and dropdown menu in documentation site

### What is this PR for?
Current Zeppelin documentation site is little bit hard to find a way for Zeppelin beginners. It will not easy  to improve this at a time, but I did the below as a start of this work.

1. Restructured dropdown menu and added each category names
2. Added a overview list(with short description) to first page of website (index.md) so that people can look through the overall contents in Zeppelin website at a glance. (as [Apache Spark](http://spark.apache.org/docs/latest/#where-to-go-from-here) and [Apache Mesos](http://mesos.apache.org/documentation/latest/) does)

Please see the attached screenshot images :)

### What type of PR is it?
Improvement & Documentation

### Todos
* [x] - Change outdated screenshot images
* [x] - Combine `text.md`, `table.md` and `html.md` to `basicdisplaysystem.md`
* [x] - Fix dead link in `virtual_machine.md`
* [x] - Improve dropdown menu and reorder
* [x] - Improve first page(`index.md`)
* [x] - Combine with #995 after it is merged into master

### What is the Jira issue?
[ZEPPELIN-996](https://issues.apache.org/jira/browse/ZEPPELIN-996)

### How should this be tested?
1. Apply this patch and [build the docs website with jekyll](https://github.com/apache/zeppelin/tree/master/docs#build-documentation)
2. Check the first page(index.html) and dropdown menu

### Screenshots (if appropriate)
 - Dropdown menu
![dropdown](https://cloud.githubusercontent.com/assets/10060731/16061421/b44f8034-3241-11e6-88fd-43aa5031b453.gif)

 - First page
<img width="717" alt="screen shot 2016-06-14 at 1 28 58 pm" src="https://cloud.githubusercontent.com/assets/10060731/16058631/3ab2cb6c-3234-11e6-95f4-180290df3d02.png">
<img width="694" alt="screen shot 2016-06-14 at 1 29 11 pm" src="https://cloud.githubusercontent.com/assets/10060731/16058639/43d68918-3234-11e6-921c-28436bfca33d.png">
<img width="649" alt="screen shot 2016-06-14 at 1 29 39 pm" src="https://cloud.githubusercontent.com/assets/10060731/16058650/501ec6d6-3234-11e6-9292-53ae84acc18a.png">
<img width="684" alt="screen shot 2016-06-14 at 1 29 57 pm" src="https://cloud.githubusercontent.com/assets/10060731/16058643/4637c8f2-3234-11e6-9b12-a233906f4c8b.png">
<img width="650" alt="screen shot 2016-06-14 at 1 30 12 pm" src="https://cloud.githubusercontent.com/assets/10060731/16058655/56c5af22-3234-11e6-8d29-9b7937728948.png">
<img width="636" alt="screen shot 2016-06-14 at 1 30 22 pm" src="https://cloud.githubusercontent.com/assets/10060731/16058656/58d1187e-3234-11e6-9171-ab7390b4a526.png">

### Questions:
* Does the licenses files need update? No
* Is there breaking changes for older versions? No
* Does this needs documentation? No

Author: AhyoungRyu <fb...@hanmail.net>

Closes #1004 from AhyoungRyu/ZEPPELIN-996 and squashes the following commits:

1dbf805 [AhyoungRyu] Add 'Apache' before 'Zeppelin'
6153a50 [AhyoungRyu] Remove useless dash
61a5ad6 [AhyoungRyu] Revert to Text -> HTML -> Table in navbar
1886f8c [AhyoungRyu] Fix indentation
af70939 [AhyoungRyu] Apply scrollable menu to 'more' tab & fix UI issue
2654d92 [AhyoungRyu] Combine overflow-x & overflow-y to overflow
904acd6 [AhyoungRyu] Resize dropdown menu maxheight
6e62e31 [AhyoungRyu] Change dynamicform image
230c670 [AhyoungRyu] Revert to Text -> HTML -> Table
ad53799 [AhyoungRyu] Adjust image size
c75c3a0 [AhyoungRyu] Add HDFS logo to available interpreter image
6a2f40b [AhyoungRyu] Address @bzz feedback
649a14d [AhyoungRyu] Address @coureadoug feedback
67cff3a [AhyoungRyu] Add all documentation list with short description to first page
ce4b122 [AhyoungRyu] Limit image width
6ff4db6 [AhyoungRyu] Improve dropdown menu and reorder menus
61da430 [AhyoungRyu] Fix dead link in virtual_machine.md
6251558 [AhyoungRyu] Change 'Zeppelin Configuration' section placement so that it can be separated
4eecab8 [AhyoungRyu] Combine text.md, html.md, table.md
4d021af [AhyoungRyu] Delete outdated images and add new images


Project: http://git-wip-us.apache.org/repos/asf/zeppelin/repo
Commit: http://git-wip-us.apache.org/repos/asf/zeppelin/commit/5ddc1ef8
Tree: http://git-wip-us.apache.org/repos/asf/zeppelin/tree/5ddc1ef8
Diff: http://git-wip-us.apache.org/repos/asf/zeppelin/diff/5ddc1ef8

Branch: refs/heads/master
Commit: 5ddc1ef87e9c2e6e8ff4485c8b8031f4b05628cd
Parents: fc72e12
Author: AhyoungRyu <fb...@hanmail.net>
Authored: Tue Jun 14 14:52:46 2016 -0700
Committer: Mina Lee <mi...@apache.org>
Committed: Tue Jun 14 23:47:46 2016 -0700

----------------------------------------------------------------------
 docs/_includes/themes/zeppelin/_navigation.html |  65 +++----
 docs/assets/themes/zeppelin/css/style.css       |  34 ++++
 docs/assets/themes/zeppelin/img/asf_logo.png    | Bin 0 -> 21243 bytes
 .../zeppelin/img/available_interpreters.png     | Bin 0 -> 251135 bytes
 docs/assets/themes/zeppelin/img/notebook.png    | Bin 120352 -> 350224 bytes
 .../zeppelin/img/screenshots/dynamicform.png    | Bin 0 -> 119566 bytes
 .../zeppelin/img/screenshots/form_input.png     | Bin 16832 -> 28393 bytes
 .../screenshots/multiple_language_backend.png   | Bin 16491 -> 0 bytes
 .../themes/zeppelin/img/screenshots/publish.png | Bin 54956 -> 561914 bytes
 docs/displaysystem/basicdisplaysystem.md        |  52 ++++++
 docs/displaysystem/html.md                      |  25 ---
 docs/displaysystem/table.md                     |  36 ----
 docs/displaysystem/text.md                      |  31 ----
 docs/index.md                                   | 170 +++++++++++++------
 docs/install/install.md                         | 121 +++++++------
 docs/install/virtual_machine.md                 |   2 +-
 docs/manual/dynamicform.md                      |   2 +-
 17 files changed, 296 insertions(+), 242 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/_includes/themes/zeppelin/_navigation.html
----------------------------------------------------------------------
diff --git a/docs/_includes/themes/zeppelin/_navigation.html b/docs/_includes/themes/zeppelin/_navigation.html
index 00c0fc1..40b9fb6 100644
--- a/docs/_includes/themes/zeppelin/_navigation.html
+++ b/docs/_includes/themes/zeppelin/_navigation.html
@@ -18,28 +18,34 @@
             <li>
               <a href="#" data-toggle="dropdown" class="dropdown-toggle">Quick Start <b class="caret"></b></a>
               <ul class="dropdown-menu">
-                <!-- li><span><b>Overview</b><span></li -->
-                <li><a href="{{BASE_PATH}}/index.html">Overview</a></li>
+                <li><a href="{{BASE_PATH}}/index.html">What is Apache Zeppelin ?</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span><b>Getting Started</b><span></li>
+                <li><a href="{{BASE_PATH}}/install/install.html">Quick Start</a></li>
+                <li><a href="{{BASE_PATH}}/install/install.html#zeppelin-configuration">Configuration</a></li>
                 <li><a href="{{BASE_PATH}}/quickstart/explorezeppelinui.html">Explore Zeppelin UI</a></li>
                 <li><a href="{{BASE_PATH}}/quickstart/tutorial.html">Tutorial</a></li>
                 <li role="separator" class="divider"></li>
-                <!-- li><span><b>Install</b><span></li -->
-                <li><a href="{{BASE_PATH}}/install/install.html">Install</a></li>
-                <li><a href="{{BASE_PATH}}/install/yarn_install.html">YARN Install</a></li>
-                <li><a href="{{BASE_PATH}}/install/virtual_machine.html">Virtual Machine Install</a></li>
-                <li role="separator" class="divider"></li>
-                <li><a href="{{BASE_PATH}}/install/upgrade.html">Upgrade Version</a></li>
-                <li role="separator" class="divider"></li>
-                <!-- li><span><b>Guide</b><span></li -->
+                <li class="title"><span><b>Basic Feature Guide</b><span></li>
                 <li><a href="{{BASE_PATH}}/manual/dynamicform.html">Dynamic Form</a></li>
                 <li><a href="{{BASE_PATH}}/manual/publish.html">Publish your Paragraph</a></li>
+                <li><a href="{{BASE_PATH}}/manual/notebookashomepage.html">Customize Zeppelin Homepage</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span><b>More</b><span></li>
+                <li><a href="{{BASE_PATH}}/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>
+                <li><a href="{{BASE_PATH}}/install/upgrade.html">Upgrade Zeppelin Version</a></li>
               </ul>
             </li>
             <li>
               <a href="#" data-toggle="dropdown" class="dropdown-toggle">Interpreter <b class="caret"></b></a>
-              <ul class="dropdown-menu">
+              <ul class="dropdown-menu scrollable-menu">
                 <li><a href="{{BASE_PATH}}/manual/interpreters.html">Overview</a></li>
                 <li role="separator" class="divider"></li>
+                <li class="title"><span><b>Usage</b><span></li>
+                <li><a href="{{BASE_PATH}}/manual/dynamicinterpreterload.html">Dynamic Interpreter Loading</a></li>
+                <li><a href="{{BASE_PATH}}/manual/dependencymanagement.html">Interpreter Dependency Management</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span><b>Available Interpreters</b><span></li>
                 <li><a href="{{BASE_PATH}}/interpreter/alluxio.html">Alluxio</a></li>
                 <li><a href="{{BASE_PATH}}/interpreter/cassandra.html">Cassandra</a></li>
                 <li><a href="{{BASE_PATH}}/interpreter/elasticsearch.html">Elasticsearch</a></li>
@@ -59,45 +65,42 @@
                 <li><a href="{{BASE_PATH}}/interpreter/scalding.html">Scalding</a></li>
                 <li><a href="{{BASE_PATH}}/pleasecontribute.html">Shell</a></li>
                 <li><a href="{{BASE_PATH}}/interpreter/spark.html">Spark</a></li>
-                <li role="separator" class="divider"></li>
-                <li><a href="{{BASE_PATH}}/manual/dynamicinterpreterload.html">Dynamic Interpreter Loading</a></li>
-                <li><a href="{{BASE_PATH}}/manual/dependencymanagement.html">Interpreter Dependency Management</a></li>
               </ul>
             </li>
             <li>
               <a href="#" data-toggle="dropdown" class="dropdown-toggle">Display System <b class="caret"></b></a>
               <ul class="dropdown-menu">
-                <li><a href="{{BASE_PATH}}/displaysystem/text.html">Text</a></li>
-                <li><a href="{{BASE_PATH}}/displaysystem/html.html">Html</a></li>
-                <li><a href="{{BASE_PATH}}/displaysystem/table.html">Table</a></li>
+                <li class="title"><span><b>Basic Display System</b><span></li>
+                <li><a href="{{BASE_PATH}}/displaysystem/basicdisplaysystem.html#text">Text</a></li>
+                <li><a href="{{BASE_PATH}}/displaysystem/basicdisplaysystem.html#html">Html</a></li>
+                <li><a href="{{BASE_PATH}}/displaysystem/basicdisplaysystem.html#table">Table</a></li>
+                <li role="separator" class="divider"></li>
+                <li class="title"><span><b>Angular API</b><span></li>
                 <li><a href="{{BASE_PATH}}/displaysystem/back-end-angular.html">Angular (backend API)</a></li>
                 <li><a href="{{BASE_PATH}}/displaysystem/front-end-angular.html">Angular (frontend API)</a></li>
               </ul>
             </li>
             <li>
-              <a href="#" data-toggle="dropdown" class="dropdown-toggle">More <b class="caret"></b></a>
-              <ul class="dropdown-menu">
-                <!-- li><span><b>Manual</b><span></li -->
-                <li><a href="{{BASE_PATH}}/manual/notebookashomepage.html">Notebook as Homepage</a></li>
-                <li role="separator" class="divider"></li>
-                <!-- li><span><b>Notebook Storage</b><span></li -->
-                <li><a href="{{BASE_PATH}}/storage/storage.html#Git">Git Storage</a></li>
-                <li><a href="{{BASE_PATH}}/storage/storage.html#S3">S3 Storage</a></li>
-                <li><a href="{{BASE_PATH}}/storage/storage.html#Azure">Azure Storage</a></li>
-                <li><a href="{{BASE_PATH}}/storage/storage.html#ZeppelinHub">ZeppelinHub Storage</a></li>
+              <a href="#" data-toggle="dropdown" class="dropdown-toggle">More<b class="caret"></b></a>
+              <ul class="dropdown-menu scrollable-menu" style="right: 0; left: auto;">
+                <li class="title"><span><b>Notebook Storage</b><span></li>
+                <li><a href="{{BASE_PATH}}/storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+                <li><a href="{{BASE_PATH}}/storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+                <li><a href="{{BASE_PATH}}/storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+                <li><a href="{{BASE_PATH}}/storage/storage.html#storage-in-zeppelinhub">ZeppelinHub Storage</a></li>
                 <li role="separator" class="divider"></li>
-                <!-- li><span><b>REST API</b><span></li -->
+                <li class="title"><span><b>REST API</b><span></li>
                 <li><a href="{{BASE_PATH}}/rest-api/rest-interpreter.html">Interpreter API</a></li>
                 <li><a href="{{BASE_PATH}}/rest-api/rest-notebook.html">Notebook API</a></li>
                 <li><a href="{{BASE_PATH}}/rest-api/rest-configuration.html">Configuration API</a></li>
                 <li role="separator" class="divider"></li>
-                <!-- li><span><b>Security</b><span></li -->
+                <li class="title"><span><b>Security</b><span></li>
                 <li><a href="{{BASE_PATH}}/security/authentication.html">Authentication for NGINX</a></li>
                 <li><a href="{{BASE_PATH}}/security/shiroauthentication.html">Shiro Authentication</a></li>
                 <li><a href="{{BASE_PATH}}/security/notebook_authorization.html">Notebook Authorization</a></li>
-                <li><a href="{{BASE_PATH}}/security/interpreter_authorization.html">Interpreter Authorization</a></li>
+                <li><a href="{{BASE_PATH}}/security/interpreter_authorization.html">Interpreter & Data Resource Authorization</a></li>
                 <li role="separator" class="divider"></li>
-                <!-- li><span><b>Development</b><span></li -->
+                <li class="title"><span><b>Contibute</b><span></li>
                 <li><a href="{{BASE_PATH}}/development/writingzeppelininterpreter.html">Writing Zeppelin Interpreter</a></li>
                 <li><a href="{{BASE_PATH}}/development/howtocontribute.html">How to contribute (code)</a></li>
                 <li><a href="{{BASE_PATH}}/development/howtocontributewebsite.html">How to contribute (website)</a></li>

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/assets/themes/zeppelin/css/style.css
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/css/style.css b/docs/assets/themes/zeppelin/css/style.css
index 2585ceb..7e34496 100644
--- a/docs/assets/themes/zeppelin/css/style.css
+++ b/docs/assets/themes/zeppelin/css/style.css
@@ -136,6 +136,23 @@ body {
   background: #3071a9;
 }
 
+.scrollable-menu {
+  max-height: 500px;
+  overflow: auto;
+}
+
+.index-header {
+  font-size: 16px;
+  font-style: italic;
+  margin-bottom: 15px;
+  margin-top: 15px;
+}
+
+.index-description {
+  line-height: 1.6;
+  padding: 10px;
+}
+
 @media (max-width: 768px) {
   .navbar-collapse.in {
     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.4);
@@ -561,6 +578,11 @@ and (max-width: 1024px) {
   font-size: 13px;
 }
 
+#menu .title {
+  padding-bottom: 8px;
+  color: #3071a9;
+}
+
 #menu .caret {
   border-top-color: white;
   border-bottom-color: white;
@@ -585,3 +607,15 @@ and (max-width: 1024px) {
   padding: 3px 10px 10px 10px;
   font-size: 13px;
 }
+
+@media only screen and (max-width: 480px) {
+  #menu .title {
+    color: #bbb;
+  }
+}
+
+@media only screen and (max-width: 768px) {
+  #menu .title {
+    color: #bbb;
+  }
+}

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/assets/themes/zeppelin/img/asf_logo.png
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/img/asf_logo.png b/docs/assets/themes/zeppelin/img/asf_logo.png
new file mode 100644
index 0000000..b20bb7f
Binary files /dev/null and b/docs/assets/themes/zeppelin/img/asf_logo.png differ

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/assets/themes/zeppelin/img/available_interpreters.png
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/img/available_interpreters.png b/docs/assets/themes/zeppelin/img/available_interpreters.png
new file mode 100644
index 0000000..dc5545e
Binary files /dev/null and b/docs/assets/themes/zeppelin/img/available_interpreters.png differ

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/assets/themes/zeppelin/img/notebook.png
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/img/notebook.png b/docs/assets/themes/zeppelin/img/notebook.png
index ac32f30..de79bf1 100644
Binary files a/docs/assets/themes/zeppelin/img/notebook.png and b/docs/assets/themes/zeppelin/img/notebook.png differ

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/assets/themes/zeppelin/img/screenshots/dynamicform.png
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/img/screenshots/dynamicform.png b/docs/assets/themes/zeppelin/img/screenshots/dynamicform.png
new file mode 100644
index 0000000..13a9afe
Binary files /dev/null and b/docs/assets/themes/zeppelin/img/screenshots/dynamicform.png differ

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/assets/themes/zeppelin/img/screenshots/form_input.png
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/img/screenshots/form_input.png b/docs/assets/themes/zeppelin/img/screenshots/form_input.png
index 2bb4878..8beb360 100644
Binary files a/docs/assets/themes/zeppelin/img/screenshots/form_input.png and b/docs/assets/themes/zeppelin/img/screenshots/form_input.png differ

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/assets/themes/zeppelin/img/screenshots/multiple_language_backend.png
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/img/screenshots/multiple_language_backend.png b/docs/assets/themes/zeppelin/img/screenshots/multiple_language_backend.png
deleted file mode 100644
index 4d91168..0000000
Binary files a/docs/assets/themes/zeppelin/img/screenshots/multiple_language_backend.png and /dev/null differ

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/assets/themes/zeppelin/img/screenshots/publish.png
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/img/screenshots/publish.png b/docs/assets/themes/zeppelin/img/screenshots/publish.png
index 8407a4d..089e78d 100644
Binary files a/docs/assets/themes/zeppelin/img/screenshots/publish.png and b/docs/assets/themes/zeppelin/img/screenshots/publish.png differ

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/displaysystem/basicdisplaysystem.md
----------------------------------------------------------------------
diff --git a/docs/displaysystem/basicdisplaysystem.md b/docs/displaysystem/basicdisplaysystem.md
new file mode 100644
index 0000000..3821f1d
--- /dev/null
+++ b/docs/displaysystem/basicdisplaysystem.md
@@ -0,0 +1,52 @@
+---
+layout: page
+title: "Basic Display System"
+description: ""
+group: display
+---
+<!--
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+{% include JB/setup %}
+
+## Text
+
+By default, Apache Zeppelin prints interpreter responce as a plain text using `text` display system.
+
+<img src="/assets/themes/zeppelin/img/screenshots/display_text.png" />
+
+You can explicitly say you're using `text` display system.
+
+<img src="/assets/themes/zeppelin/img/screenshots/display_text1.png" />
+
+## Html
+
+With `%html` directive, Zeppelin treats your output as HTML
+
+<img src="/assets/themes/zeppelin/img/screenshots/display_html.png" />
+
+## Table
+
+If you have data that row seprated by '\n' (newline) and column separated by '\t' (tab) with first row as header row, for example
+
+<img src="/assets/themes/zeppelin/img/screenshots/display_table.png" />
+
+You can simply use `%table` display system to leverage Zeppelin's built in visualization.
+
+<img src="/assets/themes/zeppelin/img/screenshots/display_table1.png" />
+
+If table contents start with `%html`, it is interpreted as an HTML.
+
+<img src="/assets/themes/zeppelin/img/screenshots/display_table_html.png" />
+
+> **Note :** Display system is backend independent.

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/displaysystem/html.md
----------------------------------------------------------------------
diff --git a/docs/displaysystem/html.md b/docs/displaysystem/html.md
deleted file mode 100644
index c929241..0000000
--- a/docs/displaysystem/html.md
+++ /dev/null
@@ -1,25 +0,0 @@
----
-layout: page
-title: "Html Display System"
-description: ""
-group: display
----
-<!--
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-{% include JB/setup %}
-## Html
-
-With '%html' directive, Zeppelin treats your output as html
-
-<img src="/assets/themes/zeppelin/img/screenshots/display_html.png" />

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/displaysystem/table.md
----------------------------------------------------------------------
diff --git a/docs/displaysystem/table.md b/docs/displaysystem/table.md
deleted file mode 100644
index c2aefde..0000000
--- a/docs/displaysystem/table.md
+++ /dev/null
@@ -1,36 +0,0 @@
----
-layout: page
-title: "Table Display System"
-description: ""
-group: display
----
-<!--
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-{% include JB/setup %}
-
-## Table
-
-If you have data that row seprated by '\n' (newline) and column separated by '\t' (tab) with first row as header row, for example
-
-<img src="/assets/themes/zeppelin/img/screenshots/display_table.png" />
-
-You can simply use %table display system to leverage Zeppelin's built in visualization.
-
-<img src="/assets/themes/zeppelin/img/screenshots/display_table1.png" />
-
-Note that display system is backend independent.
-
-If table contents start with %html, it is interpreted as an HTML.
-
-<img src="/assets/themes/zeppelin/img/screenshots/display_table_html.png" />

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/displaysystem/text.md
----------------------------------------------------------------------
diff --git a/docs/displaysystem/text.md b/docs/displaysystem/text.md
deleted file mode 100644
index e843f19..0000000
--- a/docs/displaysystem/text.md
+++ /dev/null
@@ -1,31 +0,0 @@
----
-layout: page
-title: "Text Display System"
-description: ""
-group: display
----
-<!--
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-{% include JB/setup %}
-## Text
-
-Zeppelin prints output of language backend in text, by default.
-
-<img src="/assets/themes/zeppelin/img/screenshots/display_text.png" />
-
-You can explicitly say you're using text display system.
-
-<img src="/assets/themes/zeppelin/img/screenshots/display_text1.png" />
-
-Note that display system is backend independent.

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/index.md
----------------------------------------------------------------------
diff --git a/docs/index.md b/docs/index.md
index 48b3e4a..6288217 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -20,50 +20,49 @@ limitations under the License.
 {% include JB/setup %}
 <br />
 <div class="row">
- <div class="col-md-6">
-<h2>Multi-purpose Notebook</h2>
-
-<p style="font-size:16px; color:#555555;font-style:italic;margin-bottom: 15px;">
-  The Notebook is the place for all your needs
-</p>
-<ul style="list-style-type: none;padding-left:10px;" >
-  <li style="font-size:20px; margin: 5px;"><span class="glyphicon glyphicon-import"></span> Data Ingestion</li>
-  <li style="font-size:20px; margin: 5px;"><span class="glyphicon glyphicon-eye-open"></span> Data Discovery</li>
-  <li style="font-size:20px; margin: 5px;"><span class="glyphicon glyphicon-wrench"></span> Data Analytics</li>
-  <li style="font-size:20px; margin: 5px;"><span class="glyphicon glyphicon-dashboard"></span> Data Visualization & Collaboration</li>
-</ul>
-
- </div>
- <div class="col-md-6"><img class="img-responsive" style="border: 1px solid #ecf0f1;" height="auto" src="/assets/themes/zeppelin/img/notebook.png" /></div>
+  <div class="col-md-6" style="padding-right:0">
+    <h1 style="color:#4c555a">Multi-purpose Notebook</h1>
+    <p class="index-header">
+      The Notebook is the place for all your needs
+    </p>
+    <ul style="list-style-type: none;padding-left:10px;" >
+      <li style="font-size:18px; margin: 5px;"><span class="glyphicon glyphicon-import" style="margin-right:10px"></span> Data Ingestion</li>
+      <li style="font-size:18px; margin: 5px;"><span class="glyphicon glyphicon-eye-open" style="margin-right:10px"></span> Data Discovery</li>
+      <li style="font-size:18px; margin: 5px;"><span class="glyphicon glyphicon-wrench" style="margin-right:10px"></span> Data Analytics</li>
+      <li style="font-size:18px; margin: 5px;"><span class="glyphicon glyphicon-dashboard" style="margin-right:10px"></span> Data Visualization & Collaboration</li>
+    </ul>
+  </div>
+  <div class="col-md-6" style="padding:0">
+    <img class="img-responsive" style="border: 1px solid #ecf0f1;" src="/assets/themes/zeppelin/img/notebook.png" />
+  </div>
 </div>
 
 <br />
-### Multiple language backend
-
-Zeppelin interpreter concept allows any language/data-processing-backend to be plugged into Zeppelin.
-Currently Zeppelin supports many interpreters such as Scala(with Apache Spark), Python(with Apache Spark), SparkSQL, JDBC, Markdown and Shell.
+## Multiple Language Backend
+[Apache Zeppelin interpreter](./manual/interpreters.html) concept allows any language/data-processing-backend to be plugged into Zeppelin.
+Currently Apache Zeppelin supports many interpreters such as Apache Spark, Python, JDBC, Markdown and Shell.
 
-<img class="img-responsive" src="/assets/themes/zeppelin/img/screenshots/multiple_language_backend.png" />
+<img class="img-responsive" width="500px" style="margin:0 auto; padding: 26px;" src="/assets/themes/zeppelin/img/available_interpreters.png" />
 
-Adding new language-backend is really simple. Learn [how to write a zeppelin interpreter](./development/writingzeppelininterpreter.html).
-
-<br />
-### Apache Spark integration
+Adding new language-backend is really simple. Learn [how to create your own interpreter](./development/writingzeppelininterpreter.html#make-your-own-interpreter).
 
-Zeppelin provides built-in Apache Spark integration. You don't need to build a separate module, plugin or library for it.
+#### Apache Spark integration
+Especially, Apache Zeppelin provides built-in [Apache Spark](http://spark.apache.org/) integration. You don't need to build a separate module, plugin or library for it.
 
-<img src="/assets/themes/zeppelin/img/spark_logo.jpg" width="80px" />
+<img class="img-responsive" src="/assets/themes/zeppelin/img/spark_logo.jpg" width="140px" />
 
-Zeppelin's Spark integration provides
+Apache Zeppelin with Spark integration provides
 
 - Automatic SparkContext and SQLContext injection
 - Runtime jar dependency loading from local filesystem or maven repository. Learn more about [dependency loader](./interpreter/spark.html#dependencyloading).
 - Canceling job and displaying its progress
 
+For the further information about Apache Spark in Apache Zeppelin, please see [Spark interpreter for Apache Zeppelin](./interpreter/spark.html).
+
 <br />
-### Data visualization
+## Data visualization
 
-Some basic charts are already included in Zeppelin. Visualizations are not limited to SparkSQL's query, any output from any language backend can be recognized and visualized.
+Some basic charts are already included in Apache Zeppelin. Visualizations are not limited to SparkSQL query, any output from any language backend can be recognized and visualized.
 
 <div class="row">
   <div class="col-md-6">
@@ -74,49 +73,108 @@ Some basic charts are already included in Zeppelin. Visualizations are not limit
   </div>
 </div>
 
-#### Pivot chart
+### Pivot chart
 
-With simple drag and drop Zeppelin aggregates the values and display them in pivot chart. You can easily create chart with multiple aggregated values including sum, count, average, min, max.
+Apache Zeppelin aggregates values and displays them in pivot chart with simple drag and drop. You can easily create chart with multiple aggregated values including sum, count, average, min, max.
 
 <div class="row">
-  <div class="col-md-8">
-    <img class="img-responsive" src="/assets/themes/zeppelin/img/screenshots/pivot.png" />
+  <div class="col-md-12">
+    <img class="img-responsive" style="margin: 16px auto;" src="/assets/themes/zeppelin/img/screenshots/pivot.png" width="480px" />
   </div>
 </div>
-Learn more about Zeppelin's Display system. ( [text](./displaysystem/display.html), [html](./displaysystem/display.html#html), [table](./displaysystem/table.html), [angular](./displaysystem/angular.html) )
-
-<br />
-### Dynamic forms
 
-Zeppelin can dynamically create some input forms into your notebook.
-
-<img class="img-responsive" src="/assets/themes/zeppelin/img/screenshots/form_input.png" />
-
-Learn more about [Dynamic Forms](./manual/dynamicform.html).
+Learn more about [display systems](#display-system) in Apache Zeppelin.
 
 <br />
-### Collaboration
-
-Notebook URL can be shared among collaborators. Zeppelin can then broadcast any changes in realtime, just like the collaboration in Google docs.
+## Dynamic forms
 
-<img src="/assets/themes/zeppelin/img/screenshots/collaboration.png" />
+Apache Zeppelin can dynamically create some input forms in your notebook.
+<div class="row">
+  <div class="col-md-12">
+    <img class="img-responsive" style="margin: 16px auto;" src="/assets/themes/zeppelin/img/screenshots/dynamicform.png" />
+  </div>
+</div>
+Learn more about [Dynamic Forms](./manual/dynamicform.html).
 
 <br />
-### Publish
-
-<p>Zeppelin provides an URL to display the result only, that page does not include Zeppelin's menu and buttons.
-This way, you can easily embed it as an iframe inside of your website.</p>
+## Collaborate by sharing your Notebook & Paragraph
+Your notebook URL can be shared among collaborators. Then Apache Zeppelin will broadcast any changes in realtime, just like the collaboration in Google docs.
 
 <div class="row">
-  <img class="img-responsive center-block" src="/assets/themes/zeppelin/img/screenshots/publish.png" />
+  <div class="col-md-12">
+    <img class="img-responsive" style="margin: 20px auto" src="/assets/themes/zeppelin/img/screenshots/publish.png" width="650px"/>
+  </div>
 </div>
 
+Apache Zeppelin provides an URL to display the result only, that page does not include any menus and buttons inside of notebooks.
+You can easily embed it as an iframe inside of your website in this way.
 If you want to learn more about this feature, please visit [this page](./manual/publish.html).
 
 <br />
-### 100% Opensource
-
-Apache Zeppelin is Apache2 Licensed software. Please check out the [source repository](http://git.apache.org/zeppelin.git) and [How to contribute](./development/howtocontribute.html)
+## 100% Opensource
+
+<img class="img-responsive" style="margin:0 auto; padding: 15px;" src="/assets/themes/zeppelin/img/asf_logo.png" width="250px"/>
+
+Apache Zeppelin is Apache2 Licensed software. Please check out the [source repository](http://git.apache.org/zeppelin.git) and [how to contribute](./development/howtocontribute.html).
+Apache Zeppelin has a very active development community.
+Join to our [Mailing list](https://zeppelin.apache.org/community.html) and report issues on [Jira Issue tracker](https://issues.apache.org/jira/browse/ZEPPELIN).
+
+## What is the next ?
+
+####Quick Start
+
+* Getting Started
+  * [Quick Start](./install/install.html) for basic instructions on installing Zeppelin
+  * [Configuration](./install/install.html#zeppelin-configuration) lists for Zeppelin
+  * [Explore Apache Zeppelin UI](./quickstart/explorezeppelinui.html): basic components of Zeppelin home
+  * [Tutorial](./quickstart/tutorial.html): a short walk-through tutorial that uses Apache Spark backend
+* Basic Feature Guide
+  * [Dynamic Form](./manual/dynamicform.html): a step by step guide for creating dynamic forms
+  * [Publish your Paragraph](./manual/publish.html) results into your external website
+  * [Customize Zeppelin Homepage](./manual/notebookashomepage.html) with one of your notebooks
+* More
+  * [Apache Zeppelin on Vagrant VM](./install/virtual_machine.html): a guide for installing Apache Zeppelin on Vagrant virtual machine
+  * [Upgrade Apache Zeppelin Version](./install/upgrade.html): a manual procedure of upgrading Apache Zeppelin version
+
+####Interpreter
+
+* [Interpreters in Apache Zeppelin](./manual/interpreters.html): what is interpreter group? how can you set interpreters in Apache Zeppelin?
+* Available Interpreters: currently, about 20 interpreters are available in Apache Zeppelin.
+* Usage
+  * [Dynamic Interpreter Loading](./manual/dynamicinterpreterload.html) using REST API
+  * [Interpreter Dependency Management](./manual/dependencymanagement.html) when you include external libraries to interpreter
+
+
+####Display System
+
+* Basic Display System: [Text](./displaysystem/basicdisplaysystem.html#text), [HTML](./displaysystem/basicdisplaysystem.html#html), [Table](./displaysystem/basicdisplaysystem.html#table) is available
+* Angular API: a description about avilable backend and frontend AngularJS API with examples
+  * [Angular (backend API)](./displaysystem/back-end-angular.html)
+  * [Angular (frontend API)](./displaysystem/front-end-angular.html)
+
+####More
+
+* Notebook Storage: a guide about saving notebooks to external storage
+  * [Git Storage](./storage/storage.html#notebook-storage-in-local-git-repository)
+  * [S3 Storage](./storage/storage.html#notebook-storage-in-s3)
+  * [Azure Storage](./storage/storage.html#notebook-storage-in-azure)
+  * [ZeppelinHub Storage](./storage/storage.html#storage-in-zeppelinhub)
+* REST API: available REST API list in Apache Zeppelin
+  * [Interpreter API](./rest-api/rest-interpreter.html)
+  * [Notebook API](./rest-api/rest-notebook.html)
+  * [Configuration API](./rest-api/rest-configuration.html)
+* Security: available security support in Apache Zeppelin
+  * [Authentication for NGINX](./security/authentication.html)
+  * [Shiro Authentication](./security/shiroauthentication.html)
+  * [Notebook Authorization](./security/notebook_authorization.html)
+  * [Interpreter & Data Resource Authorization](./security/interpreter_authorization.html)
+* Contribute
+  * [Writing a new Interpreter](./development/writingzeppelininterpreter.html)
+  * [How to contribute (code)](./development/howtocontribute.html)
+  * [How to contribute (documentation website)](./development/howtocontributewebsite.html)
+
+#### External Resources 
+  * [Mailing List](https://zeppelin.apache.org/community.html)
+  * [Apache Zeppelin Wiki](https://cwiki.apache.org/confluence/display/ZEPPELIN/Zeppelin+Home)
+  * [StackOverflow tag `apache-zeppelin`](http://stackoverflow.com/questions/tagged/apache-zeppelin)
 
-Zeppelin has a very active development community.
-Join the [Mailing list](https://zeppelin.apache.org/community.html) and report issues on our [Issue tracker](https://issues.apache.org/jira/browse/ZEPPELIN).

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/install/install.md
----------------------------------------------------------------------
diff --git a/docs/install/install.md b/docs/install/install.md
index 251ba04..e3dcd2c 100644
--- a/docs/install/install.md
+++ b/docs/install/install.md
@@ -1,6 +1,6 @@
 ---
 layout: page
-title: "Zeppelin Installation"
+title: "Getting Started"
 description: ""
 group: install
 ---
@@ -19,8 +19,6 @@ limitations under the License.
 -->
 {% include JB/setup %}
 
-
-
 ## Zeppelin Installation
 Welcome to your first trial to explore Zeppelin!
 
@@ -42,7 +40,65 @@ You can also build Zeppelin from the source.
 
 If you don't have requirements prepared, please check instructions in [README.md](https://github.com/apache/zeppelin/blob/master/README.md) for the details.
 
-<a name="zeppelin-configuration"> </a>
+
+
+Maybe you need to configure individual interpreter. If so, please check **Interpreter** section in Zeppelin documentation.
+[Spark Interpreter for Apache Zeppelin](../interpreter/spark.html) will be a good example.
+
+## Zeppelin Start / Stop
+#### Start Zeppelin
+
+```
+bin/zeppelin-daemon.sh start
+```
+After successful start, visit [http://localhost:8080](http://localhost:8080) with your web browser.
+
+#### Stop Zeppelin
+
+```
+bin/zeppelin-daemon.sh stop
+```
+
+#### Start Zeppelin with a service manager such as upstart
+
+Zeppelin can auto start as a service with an init script, such as services managed by upstart.
+
+The following is an example upstart script to be saved as `/etc/init/zeppelin.conf`
+This example has been tested with Ubuntu Linux.
+This also allows the service to be managed with commands such as
+
+`sudo service zeppelin start`  
+`sudo service zeppelin stop`  
+`sudo service zeppelin restart`
+
+Other service managers could use a similar approach with the `upstart` argument passed to the zeppelin-daemon.sh script:  `bin/zeppelin-daemon.sh upstart`
+
+##### zeppelin.conf
+
+```
+description "zeppelin"
+
+start on (local-filesystems and net-device-up IFACE!=lo)
+stop on shutdown
+
+# Respawn the process on unexpected termination
+respawn
+
+# respawn the job up to 7 times within a 5 second period.
+# If the job exceeds these values, it will be stopped and marked as failed.
+respawn limit 7 5
+
+# zeppelin was installed in /usr/share/zeppelin in this example
+chdir /usr/share/zeppelin
+exec bin/zeppelin-daemon.sh upstart
+```
+
+#### Running on Windows
+
+```
+bin\zeppelin.cmd
+```
+
 ## Zeppelin Configuration
 
 You can configure Zeppelin with both **environment variables** in `conf/zeppelin-env.sh` (`conf\zeppelin-env.cmd` for Windows) and **Java properties** in `conf/zeppelin-site.xml`. If both are defined, then the **environment variables** will take priority.
@@ -250,60 +306,3 @@ You can configure Zeppelin with both **environment variables** in `conf/zeppelin
     <td>Size in characters of the maximum text message to be received by websocket.</td>
   </tr>
 </table>
-
-Maybe you need to configure individual interpreter. If so, please check **Interpreter** section in Zeppelin documentation.
-[Spark Interpreter for Apache Zeppelin](../interpreter/spark.html) will be a good example.
-
-## Zeppelin Start / Stop
-#### Start Zeppelin
-
-```
-bin/zeppelin-daemon.sh start
-```
-After successful start, visit [http://localhost:8080](http://localhost:8080) with your web browser.
-
-#### Stop Zeppelin
-
-```
-bin/zeppelin-daemon.sh stop
-```
-
-#### Start Zeppelin with a service manager such as upstart
-
-Zeppelin can auto start as a service with an init script, such as services managed by upstart.
-
-The following is an example upstart script to be saved as `/etc/init/zeppelin.conf`
-This example has been tested with Ubuntu Linux.
-This also allows the service to be managed with commands such as
-
-`sudo service zeppelin start`  
-`sudo service zeppelin stop`  
-`sudo service zeppelin restart`
-
-Other service managers could use a similar approach with the `upstart` argument passed to the zeppelin-daemon.sh script:  `bin/zeppelin-daemon.sh upstart`
-
-##### zeppelin.conf
-
-```
-description "zeppelin"
-
-start on (local-filesystems and net-device-up IFACE!=lo)
-stop on shutdown
-
-# Respawn the process on unexpected termination
-respawn
-
-# respawn the job up to 7 times within a 5 second period.
-# If the job exceeds these values, it will be stopped and marked as failed.
-respawn limit 7 5
-
-# zeppelin was installed in /usr/share/zeppelin in this example
-chdir /usr/share/zeppelin
-exec bin/zeppelin-daemon.sh upstart
-```
-
-#### Running on Windows
-
-```
-bin\zeppelin.cmd
-```

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/install/virtual_machine.md
----------------------------------------------------------------------
diff --git a/docs/install/virtual_machine.md b/docs/install/virtual_machine.md
index 12f1ce4..7849ff1 100644
--- a/docs/install/virtual_machine.md
+++ b/docs/install/virtual_machine.md
@@ -38,7 +38,7 @@ This script requires three applications, [Ansible](http://docs.ansible.com/ansib
 
 If you are running Windows and don't yet have python installed, [install Python 2.7.x](https://www.python.org/downloads/release/python-2710/) first.
 
-1. Download and Install Vagrant:  [Vagrant Downloads](http://www.vagrantup.com/downloads)
+1. Download and Install Vagrant:  [Vagrant Downloads](http://www.vagrantup.com/downloads.html)
 2. Install Ansible:  [Ansible Python pip install](http://docs.ansible.com/ansible/intro_installation.html#latest-releases-via-pip)
 
     ```

http://git-wip-us.apache.org/repos/asf/zeppelin/blob/5ddc1ef8/docs/manual/dynamicform.md
----------------------------------------------------------------------
diff --git a/docs/manual/dynamicform.md b/docs/manual/dynamicform.md
index 5bca4d2..6594767 100644
--- a/docs/manual/dynamicform.md
+++ b/docs/manual/dynamicform.md
@@ -34,7 +34,7 @@ To create text input form, use `${formName}` templates.
 
 for example
 
-<img src="../assets/themes/zeppelin/img/screenshots/form_input.png" />
+<img class="img-responsive" src="/assets/themes/zeppelin/img/screenshots/form_input.png" width="450px" />
 
 
 Also you can provide default value, using `${formName=defaultValue}`.