# 4. App Control

:::{Note}

* Before proceeding with this section of the tutorial, the factory firmware must be flashed to the board. For detailed step-by-step instructions, refer to the following document: [1. Tutorial\3. Default Program Download\3.1 Default Program Download Instruction](https://wiki.hiwonder.com/projects/miniAuto/en/latest/docs/3.default_program_download.html).

:::

## 4.1 App Installation

**iOS users:** Search for [Wonderbot](https://apps.apple.com/us/app/wonderbot-robot/id1519146341) in the App Store to download the app.  

**Android users:** [Wonderbot](https://play.google.com/store/apps/details?id=com.Wonder.bot)

## 4.2 App Connection

:::{Note}

* Make sure to enable both Bluetooth and GPS in your phone's settings before using the app.

* Use the Bluetooth button within the app to pair and connect to the device. Do not use the phone's system Bluetooth settings to pair.

:::

(1) Turn on the **miniAuto** and launch the **Wonderbot** app. Tap <img src="../_static/media/chapter_4/section_1/media/image2.png" style="width:45px;"/> to select **miniAuto** under the "**Robot**" section.

<img class="common_img" src="../_static/media/chapter_4/section_1/media/image3.png"  />

(2) Next, tap the **flashing Bluetooth icon** <img src="../_static/media/chapter_4/section_1/media/image4.png"  /> on the main screen. In the Bluetooth device list, find **"Hiwonder"** and tap to connect.

<img class="common_img" src="../_static/media/chapter_4/section_1/media/image5.png"  />

:::{Note}

If **"Hiwonder"** does not appear, tap **"Search Again"** to refresh the list.

:::

(3) Once connected, the **Bluetooth icon** <img src="../_static/media/chapter_4/section_1/media/image4.png"  /> in the top right corner will remain solid. The **battery level** will also appear on the left side of the screen.

<img class="common_img" src="../_static/media/chapter_4/section_1/media/image6.png"  />

## 4.3 Function Introduction

### 4.3.1 Robot Control

The **miniAuto** can be controlled using the on-screen buttons within the app. The app interface is divided into two main sections: the **menu bar** and the **control area**.

<img class="common_img" src="../_static/media/chapter_4/section_1/media/image7.png"  />

(1) Menu Bar

|                           **Icon**                           |                   **Function Description**                   |
| :----------------------------------------------------------: | :----------------------------------------------------------: |
|<img  src="../_static/media/chapter_4/section_1/media/image8.png"  /> |      Return to the main screen to select the robot type      |
|<img  src="../_static/media/chapter_4/section_1/media/image9.png"  /> |    Display miniAuto's current battery level in real time     |
|<img  src="../_static/media/chapter_4/section_1/media/image10.png"  /> | Image transmission function: view the live feed from the ESP32 camera |
|<img  src="../_static/media/chapter_4/section_1/media/image11.png"  /> |                     Bluetooth connection                     |
|<img  src="../_static/media/chapter_4/section_1/media/image12.png"  /> |                       More information                       |

(2) Control Area

<table  class="docutils-nobg" style="text-align:center;" border="1">
<colgroup>
<col  />
<col  />
</colgroup>
<tbody>
<tr>
<td ><strong>Icon</strong></td>
<td ><strong>Function Description</strong></td>
</tr>
<tr>
<td ><img  src="../_static/media/chapter_4/section_1/media/image13.png"  /></td>
<td >Turn on/off the gravity control mode</td>
</tr>
<tr>
<td ><img  src="../_static/media/chapter_4/section_1/media/image14.png"  /></td>
<td >Manage miniAuto's movement</td>
</tr>
<tr>
<td ><img  src="../_static/media/chapter_4/section_1/media/image15.png"  /></td>
<td >Adjust miniAuto's motion speed</td>
</tr>
<tr>
<td ><img  src="../_static/media/chapter_4/section_1/media/image16.png"  /></td>
<td ><p>Display ultrasonic distance in obstacle avoidance mode.</p>
<p>Turn on/off the ultrasonic obstacle avoidance function</p></td>
</tr>
<tr>
<td ><img  src="../_static/media/chapter_4/section_1/media/image17.png"  /></td>
<td >Adjust the color of the ultrasonic RGB light</td>
</tr>
<tr>
<td ><img  src="../_static/media/chapter_4/section_1/media/image18.png"  /></td>
<td >Advanced kit: Control the opening and closing of the robotic gripper for</td>
</tr>
<tr>
<td ><img  src="../_static/media/chapter_4/section_1/media/image19.png"  /></td>
<td >Advanced kit: Return the robotic gripper to the neutral position</td>
</tr>
<tr>
<td ><img  src="../_static/media/chapter_4/section_1/media/image20.png"  /></td>
<td >Control miniAuto to turn left and right</td>
</tr>
</tbody>
</table>

### 4.3.2 Live Camera Feed

(1) Tap <img src="../_static/media/chapter_4/section_1/media/image10.png"  /> in the upper right corner to open the live camera view, then select **"Connect Hotspot"**.

<img class="common_img" src="../_static/media/chapter_4/section_1/media/image21.png"  />

(2) Go to your phone's **Wi-Fi settings**, find **"HW_ESP32S3CAM"**, and connect to it.

<img class="common_img" src="../_static/media/chapter_4/section_1/media/image22.png"  />

(3) Return to the app to enter **image transmission mode**, where you can view the **live camera feed**.

<img class="common_img" src="../_static/media/chapter_4/section_1/media/image23.png"  />