# 1.8 Interaction Storyboard

{% tabs %}
{% tab title="✓ TASK" %}
Create an [interaction storyboard](https://docs.idew.org/principles-and-practices/practices/design-practices/interaction-storyboards) with a sequence of 3-6 sketched screen mockups to show how a user would interact with your smart device’s web app to perform a task. Be sure to select a primary task that is central to the purpose of your product.

{% hint style="info" %}
**REMINDER:** As you decide what tasks your web app could perform, keep in mind the ways your web app can interact with your Photon device through [Particle Cloud](https://docs.idew.org/code-internet-of-things/references/particle-cloud):

1. A web app can **get the value of a Photon device variable**
2. A web app can **call a custom function on a Photon device**
3. A web app can **get event notifications from a Photon device**
   {% endhint %}

[Sketch Templates for Phone, Tablet, and Desktop](https://drive.google.com/open?id=1Xq2I690nLybxSX_k1b0SKzcH40PCmbY3)

### **❏ Deliverable**

Submit an image (photo, scan, etc.) of your team's interaction storyboard.
{% endtab %}

{% tab title="➤ EXAMPLE" %}
![Interaction Storyboard for Task using Smart Light Web App](/files/-LHoP7Fps3ZqXS2WoD_4)

![Interaction Storyboard for Task using Smart Thermostat Web App](/files/-LHt1ZdHLhVgQn4AJZN3)

<br>
{% endtab %}

{% tab title="★ RUBRIC" %}

| **✓- Below Standard**                                                                        | **✓ Meets Standard**                                                                                                  | **✓+ Exceeds Standard**                                                                                                                                                                                                                                                                         |
| -------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Interaction storyboard sketches are unclear, incomplete, or do not represent a primary task. | Interaction storyboard sketches clearly show screen layout and task flow for completing a primary task using web app. | Interaction storyboard sketches demonstrate clear focus on utility, usability, and user experience: task represents useful function; user interface layout and task flow are easy to understand and efficient to use; interaction has other aspects contributing to satisfying user experience. |
| {% endtab %}                                                                                 |                                                                                                                       |                                                                                                                                                                                                                                                                                                 |
| {% endtabs %}                                                                                |                                                                                                                       |                                                                                                                                                                                                                                                                                                 |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.idew.org/project-internet-of-things/project-instructions/1-discover-and-define-problem/1.8-interaction-storyboard.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
