Change toc and add eye-catching figure.

docs/Basics/Basics/Basics.mdx

@@ -1,5 +1,6 @@
 ---
 sidebar_position: 0
+title: Problem Statement
 ---
 
 ## Brush strokes
@@ -13,17 +14,23 @@ Learning how to render these stylized strokes with GPU is valuable.
 However, there are over thousands of brushes available in Photoshop, which can be overwhelming to explore.
 Luckily, more than 90% of the brushes are designed under the "stamp model", and we call them "stamp brushes".
 
-In the upcoming Stamp section, I will introduce the stamp model and how to implement it in a shader program.
-But for your better understanding, I will introduce the basic solid stroke called "vanilla" first.
+In the upcoming Stamp section, I will introduce the basic solid stroke called "vanilla" first,
+then the stamp model and how to implement it in a shader program.
 The vanilla and stamp strokes share the exact same vertex placement method.
-It's much easier to start with the vanilla stroke, later the stamp stroke.
+For your better understanding, avoid jumping right into the stamp part.
+
 Maybe the stamp strokes with various styles don't interest you, feel free to ignore it and learn the vanilla stroke only.
-It's very useful when drawing UIs or debugging your 3D scenes.
+Knowing how to render a line is very handy when drawing UIs or debugging your 3D scenes.
 
-While you may recognize a brush stroke by its stylization, another crucial property could be ignored: the "variable radius" along the stroke.
-(I also ignored it in my paper.)
-The radii are typically generated from the pressure values as a stylus presses and moves on a tablet.
+While you may recognize a brush stroke by its stylization, another crucial property could be ignored:
+the "variable width" along the stroke.
 The property is critical for experienced artists drawing professional illustrations or animations.
+For instance, you can tell the difference from the figure below.
+The one with variable width on the right has much better appearance.
+
+![bunny](./bunny-compare.png)
+
+The width values are typically generated from the pressure values as a stylus presses and moves on a tablet.
 After the artists install a new painting program,
 one of the highest priorities is to configure the mapping function from pen pressure to brush radius.
 
@@ -37,13 +44,9 @@ If you're unfamiliar with tablets and styluses, you can watch the video below fo
 
 </details>
 
-![variable radius](./variable-radius.png)
-
-_Variable radius along a stroke._
-
 ## Geometric data
 
-To store the variable radius in brush stroke, we will render a unique type of vector curve:
+To store the variable radius in brush stroke, we will render an uncommon type of vector curve:
 An ordered list of points (polyline) with radius values assigned to each point.
 As a user presses a stylus on a tablet and moves, a paint program generates a sequence of points to record the trace of movement.
 Meanwhile, the pen pressure is transformed into the radius value assigned to each point.
@@ -61,5 +64,5 @@ import { ArticulatedLine2D } from "@site/src/components/ArticulatedLine2D";
 
 <ArticulatedLine2D showEditor={[true, false, false]} />
 
-Blender Grease Pencil team has developed a lot of novel tools to edit this polyline with radius representation.
+Blender Grease Pencil team has developed a lot of novel tools to edit polylines.
 Remember to check out if you were a researcher and want to develop novel techniques for digital painting.

docs/Introduction/Introduction.mdx

@@ -45,10 +45,11 @@ I will continuously update this tutorial series to teach you related techniques
 Decent experience in one of the GPU graphics APIs like OpenGL and D3D is required.
 If you were relatively new to computer graphics, you should at least have rendered your first 3D scene and practiced instanced rendering.
 
+GPU apis have built-in line rendering functionalities.
 It's totally fine if you never heard about `LINES`, `LINE_STRIP`, and `LINE_LOOP` GPU primitives.
-We won't use them directly in this tutorial series.
-If you're interested in learning about their drawbacks, you can check out mattdesl's article titled "Drawing Lines is Hard" [here](https://mattdesl.svbtle.com/drawing-lines-is-hard).
-While reading it isn't a prerequisite, I still recommend it.
+We won't use the functionalities in this tutorial series.
+If you're interested in learning about their drawbacks, you can check out mattdesl's article titled [Drawing Lines is Hard](https://mattdesl.svbtle.com/drawing-lines-is-hard).
+Reading it isn't a prerequisite, I still recommend it.
 
 Though I create all the demos in the web environment, you don't have to know about WebGL or WebGPU.
 We will concentrate on high-level techniques rather than the implementation details.
@@ -61,7 +62,7 @@ No matter which GPU API you are familiar with, utilizing them to render a stroke
 The [Basic](../category/basics/) section covers the basics of the rendering and stylization methods.
 Articles in the Basic part are organized in a progressive fashion.
 You may miss something important if skip one of them.
-After learning all stuffs in the Basic section, you can freely select your favorite topics to learn.
+After learning the Basic section, you can freely select your favorite topics.
 I will list extra prerequisites at the very beginning of each article.
 
 ### Live coding

docs/Tessellation/Tessellation.mdx

@@ -2,6 +2,7 @@
 sidebar_position: 5
 sidebar_label: Tessellation
 title: Tessellation-based Rendering
+hidden: true
 ---
 
 There were works trying to tessellate a stroke and render it with GPU.

docs/toc.mdx

@@ -12,30 +12,24 @@ import {
   dotHalfBrushUniforms,
 } from "../src/components/ArticulatedLine2D";
 
-This tutorial series will teach you how to render brush strokes with the modern GPU graphics pipeline.
+![eye-catcher](./brushes.jpg)
 
+This tutorial series will teach you how to render brush strokes with the modern GPU graphics pipeline.
 If you like this series, please star the [code repository] instead of bookmark this website since the domain might be changed.
 
 ## Table of Contents
 
 - [Introduction](./introduction)
 - Basics
-  - [Basics](./Basics/Basics)
+  - [Problem Statement](./Basics/Basics)
   - [Vanilla](./Basics/Vanilla)
   - [Stamp](./Basics/Stamp)
+- [Airbrush](./Airbrush)
 
 <details>
 <summary>Future Contents</summary>
 
-### Airbrush
-
-<ArticulatedLine2D uniforms={airBrushUniforms} />
-
-Airbrush is a special type of stamp brush.
-Here I'm demonstrating a "continuous airbrush", which is mathematically continuous and needs a little bit of calculus to develop.
-You will learn how to generalize a stamp brush into its continuous form.
-
-### Stamp density and "ratio-distance"
+**Stamp density and "ratio-distance"**
 
 <div className="row row--no-gutters margin-left--xs">
   <div className="col col--6">
@@ -58,7 +52,7 @@ The pattern is achieved by setting the intervals between dots proportional to th
 You will learn how to freely control stamp density along a stamp
 stroke. Very important for a serious project.
 
-### 3D stroke
+**3D stroke**
 
 Learn how to extend the algorithms to 3D space.