update screenshots for Pybytes Documentation

content/pybytes/connect/_index.md

@@ -14,21 +14,18 @@ Go to the *Devices* page in Pybytes:
 
 ![](/gitbook/assets/pybytes/add-device/add-device-btn.png)
 
-1. Select your device (WiPy, LoPy, SiPy, etc.).
+2. Select your device (WiPy, LoPy, SiPy, etc.).
 
 ![](/gitbook/assets/pybytes/add-device/select-device-type.png)
 
-1. Select your network options. This will be how your device connects to both Pybytes and the internet. For now, choose WiFi.
+3. Select your network options. This will be how your device connects to both Pybytes and the internet. For now, choose WiFi.
 
 ![](/gitbook/assets/pybytes/add-device/network-step.png)
 
-1. Enter a unique name for your device and enter the WiFi credentials (SSID and password). You can save this WiFi, so that it will be remembered for later use when adding further devices.
+4. Enter a unique name for your device and enter the WiFi credentials (SSID and password). You can save this WiFi, so that it will be remembered for later use when adding further devices.
 
 ![](/gitbook/assets/pybytes/add-device/customize-step.png)
 
-1. At the end of the *Add Device* wizard, Pybytes will show that your device profile was successfully created.
-
-![](/gitbook/assets/pybytes/add-device/final-step.png)
 
 ## Next step
 [Provision your device via USB](quick)

content/pybytes/dashboard.md

@@ -27,40 +27,33 @@ In this section, we will explain how to create widgets for data visualisation an
             time.sleep(10)
     ```
 
-2. Press *Upload* button to upload the code into your device.
+2. Press the *Upload* button to upload the code into your device.
+Once the code has run, you should be able to see the signal in the `Signals` tab of your device
 
->Note that if you have a Pytrack or Pysense expansion board, you could also sent sensor data instead!
+![](/gitbook/assets/pybytes/dashboard/signal-test.png)
 
+>Note that if you have a Pytrack or Pysense expansion board, you could also send sensor data instead!
 
-## Step 2: Add a signal from your device
 
-1. Go to the [Pybytes device](https://pybytes.pycom.io/devices) page select your device.
+## Step 2: Add a widget for the signal
 
-2. Then go to `Signals` tab and click on *define new signal*
+1. Go to the device dashboard and click `Add Widget`
 
-![](/gitbook/assets/pybytes/add-device/define-signal.png)
+![](/gitbook/assets/pybytes/dashboard/add-widget.png)
 
-## Step 3: Add a widget for the signal
+2. Choose a data representation widget, for example `Line chart`
 
-1. Click on the *signal card* of the selected device.
+![](/gitbook/assets/pybytes/dashboard/choose-linechart.png)
 
-![](/gitbook/assets/pybytes/add-device/send-signal.png)
+3. Select the `Pin` and `Chart type` and click `Add Widget`
 
-2. Click on the *Create a new display* button.
+![](/gitbook/assets/pybytes/dashboard/widget-settings.png)
 
-![](/gitbook/assets/pybytes/dashboard/create-new-display.png)
+4. A new widget has been added to your Dashboard
 
-3. Select the type of visualisation (e.g. bar chart or line graph).   
+![](/gitbook/assets/pybytes/dashboard/widget-result.png)
 
-4. You can adjust the parameters of your widget at `Settings`. After, click on the button `Create`.
-
-![](/gitbook/assets/pybytes/dashboard/confirm-graph-creation.png)
-
-Your widget was created. Now, add your widget to your device's dashboard. Click on the button `Edit` on your widget, and mark the checkbox `Display on Dashboard` at `Settings`. Finally, click on the button `Save`.
-
-Click on the `Dashboard` tab. Your widget was successfully added there!
-
-![](/gitbook/assets/pybytes/dashboard/sinwave-dashboard-widget.png)
+>Click on the `Edit` button on your widget to change the settings
 
 ## Done!
 

content/pybytes/gettingstarted.md

@@ -20,19 +20,19 @@ Else, go to [Pybytes](https://pybytes.pycom.io) and create an account
 ![](/gitbook/assets/pybytes/add-device/add-device-btn.png)
 
 2. Select your device (WiPy, LoPy, SiPy, etc.).
+
 ![](/gitbook/assets/pybytes/add-device/select-device-type.png)
 
 3. Select your network options. This will be how your device connects to both Pybytes and the internet. For now, we will choose WiFi. This will show a subwindow where you enter your WiFi credentials. This will only be used to connect your device with a WiFi network to access pybytes.
+
 ![](/gitbook/assets/pybytes/add-device/network-step.png)
 
-4. Enter a unique name for your device and hit save!
+4. Choose a unique name for your device and hit `Next` !
 
 ![](/gitbook/assets/pybytes/add-device/customize-step.png)
 
 5. At the end, Pybytes will show that your device profile was successfully created.
 
-![](/gitbook/assets/pybytes/add-device/final-step.png)
-
 ## Step 3: Provision your device
 
 After creation, you will land on the provisioning page. This is where we 'inform' the device about the Pybytes connection and how to set it up. The first time you set up the device for use with Pybytes, you will need to provision it using the Firmware Updater Tool. This is a good moment to become familiar with the tool [here](/updatefirmware/device/).
@@ -74,19 +74,18 @@ After creation, you will land on the provisioning page. This is where we 'inform
 
 2. Click on `Online Firmware updater` at Provisioning tab on the device page.
 
-   ![](/gitbook/assets/fwupdater-1.png)
-
-3. Click `Next`.
+![](/gitbook/assets/fwupdater-1.png)
 
-   ![](/gitbook/assets/fwupdater-2.png)
+3. Click on `Start provisionning`
 
-4. Select correct port to which your device is connected. Choose region and 
-   country. Select Firmware type and version.
+4. Select the port to which your device is connected. Select your region and 
+   country. Select the Firmware type and version.
 
-   ![](/gitbook/assets/fwupdater-3.png)
+![](/gitbook/assets/fwupdater-3.png)
 
-5. Continue with the firmware update to the device.
+5. Click next to start provisionning the device.
 
+![](/gitbook/assets/pybytes/add-device/fw-updater/fwupdater-finish.png)
 
 ## Step 4: Your first signal
 

content/pybytes/integrations/_index.md

@@ -12,4 +12,4 @@ Pybytes offers a way to interact with external IoT platform or custom services,
 * [Google Cloud IoT](google): a complete set of tools to connect, process, store, and analyse data, both at the edge and in the cloud
 * [Web Hooks](webhooks): this allows for user-defined HTTP callbacks to a defined remote destination. All elements of the requests (headers, query string parameters, etc) are customisable
 
-![](/gitbook/assets/pybytes/integrations/select-new-integration.png))
+![](/gitbook/assets/pybytes/integrations/select-new-integration.png)

content/pybytes/pymakr-online/_index.md

@@ -30,13 +30,7 @@ There are two ways in which you can use Pymakr online.
 
 ![](/gitbook/assets/pybytes/pymakr-online/opening-pymakr-device.png)
 
-2. Start a new project on the [Pymakr](https://pybytes.pycom.io/pymakr) tab in Pybytes. There are several different types you can choose from, including a link to your Github repository! Later, we can link the project to a release.
-
-![](/gitbook/assets/pybytes/pymakr-online/opening-pymakr-project.png)
-
-## Using Pymakr Online
-
-1. When you open Pymakr Online, you will see the following
+2. When you open Pymakr Online, you will see the following
 
 ![](/gitbook/assets/pybytes/pymakr-online/initial.png)
 

content/pybytes/releases/deploy.md

@@ -11,9 +11,9 @@ In this section, we will explain how to deploy a release.
 In Pybytes, go to *Applications* -> *My applications* -> *select target application* -> *Releases* Page:
 
 1. *Select* target release by clicking *the three dots point* and Click on *Deploy*.
+
 ![](/gitbook/assets/pybytes/releases/create-release-step-11.png)
 
-2. You will get a list of all the devices within the application.
- ![](/gitbook/assets/pybytes/releases/create-release-step-12.png)
- * Select target devices
- ![](/gitbook/assets/pybytes/releases/create-release-step-13.png)
+2. Select the target devices and click `Deploy`
+
+![](/gitbook/assets/pybytes/releases/create-release-step-12.png)

content/pybytes/releases/new.md

@@ -11,19 +11,24 @@ In this section, we will explain how to create a new release.
 In Pybytes, go to *Applications* -> *My applications* -> *select target application* -> *Releases* Page:
 
 1. Click on *Create Release*.
+
 ![](/gitbook/assets/pybytes/releases/create-release-step-1.png)
 
 2. A list of pre-configured application configurations will be shown.
+
 ![](/gitbook/assets/pybytes/releases/create-release-step-2.png)
 
 3. Select the target firmware, or omit this step.
+
 ![](/gitbook/assets/pybytes/releases/create-release-step-3.png)
 
 4. If you want to include code changes in this release you can:
   * Check _Upload the code_ **checkbox**.
   * Browse your target code (should be a **zip** file)
   * The **zip** file size is limited to **4MB**
+
 ![](/gitbook/assets/pybytes/releases/create-release-step-7.png)
+
   * Download and extend example release zip archive **[my-release.zip](/gitbook/assets/pybytes/releases/my-release.zip)**
   * Or create a zip file with the following structure:
     ```
@@ -38,10 +43,13 @@ In Pybytes, go to *Applications* -> *My applications* -> *select target applicat
     ```
 
 5. *Write* a description for this release.
+
 ![](/gitbook/assets/pybytes/releases/create-release-step-8.png)
 
 6. *Review* release details then *Click* Finish.
+
 ![](/gitbook/assets/pybytes/releases/create-release-step-9.png)
 
 7. You can see a list of created releases under the **Releases** tab.
+
 ![](/gitbook/assets/pybytes/releases/create-release-step-10.png)

themes/doc-theme/static/css/doc-theme.css

@@ -389,7 +389,7 @@ html {
   scroll-padding-top: 70px; /* height of sticky header */
 }
 
-img[src*="/gitbook/assets/pybytes/lora/screenshots"], img[src*="/gitbook/assets/pybytes/pymesh"]{
+img[src*="/gitbook/assets/pybytes/lora/screenshots"] {
     margin-top: 20px;
     margin-left: 15px;
     box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);