> For the complete documentation index, see [llms.txt](https://learn.squirrel365.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://learn.squirrel365.io/the-designer/tufty-ai/using-tufty.md).

# Using Tufty

How to use Tufty in Squirrel365: open the panel, start and revisit chats, attach images and documents, and give feedback or report a bug.

Tufty works in a chat panel inside the Squirrel365 Designer. This guide covers what you need to work with it day to day: opening the panel, starting and revisiting chats, attaching images and documents, and sending feedback or reporting a problem.

{% hint style="info" %}
Tufty is currently in invite-only Early Access. If you have been selected, you will have received an email with a dedicated link for getting started. If you have not had an email, Tufty will not be available on your account yet.
{% endhint %}

### Opening the Tufty panel

Open a project in the Designer. Along the top bar on the right you will see the buttons for the Component Tree, the spreadsheet and the property panel. Just to the right of those is the Tufty button, marked with two small stars. Click it to open the Tufty panel.

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2Fie70C1fKekL92VwB7yGN%2FTufty%20AI%20panel%20toggle.png?alt=media&amp;token=40d6c014-3354-4722-84bb-749604671d07" alt="" width="375"><figcaption></figcaption></figure>

The panel opens on the right, on top of the property panel if you have it open, with the greeting "Hey, what are we building today?" and a text box where you type your requests.

The first time you open Squirrel365 after Tufty has been added, the panel opens on its own with a short introduction, so you may find it already waiting for you.

#### Hiding and showing Tufty

Click the Tufty button (the two stars) again to hide the panel and go back to the property panel. Click it once more to bring Tufty back. Your current conversation is still there when you reopen it.

#### Resizing the panel

To give Tufty more or less room, move your cursor to the inside edge of the panel until it changes to the resize icon. Click and drag to the left to make the panel wider, or to the right to make it narrower.

> 📸 **Screenshot or short clip:** the panel edge showing the resize cursor, being dragged to widen the panel.

### Starting a new chat

When you want to begin something new, start a new chat. This clears the panel and gives you a clean conversation to work in, which is handy when you move on to a different task.

At the top right of the Tufty panel you will see two buttons: a history button shaped like a clock with an arrow, and a blue plus button. Click the blue plus button to start a new chat. The panel clears and shows the "Hey, what are we building today?" greeting again, ready for your first request.

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FYmWVfeakzxD4jq7dsvWF%2FTufty%20AI%20new%20chat.png?alt=media&amp;token=6ecf41b8-53ee-44d3-9267-503b3524f1a5" alt="" width="358"><figcaption></figcaption></figure>

Starting a new chat does not delete your previous one. You can return to earlier conversations at any time from your chat history.

### Viewing your chat history

Tufty keeps the conversations you have had so you can look back at them and pick up where you left off.

Click the history button (the clock with an arrow, next to the blue plus button) to open a list of your conversations. Click any conversation in the list to reopen it, and the panel switches back to that chat. To close the list without changing anything, click the x.

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FI158DP5geaYiMUeeRtga%2FTufty%20AI%20chat%20history%20penel.png?alt=media&amp;token=bdb09dd8-39fc-45a4-a3bf-8f4d7180745b" alt="" width="356"><figcaption></figcaption></figure>

Your chat history belongs to the project you are working in. If you open a new project, you start with a fresh, empty chat list, and conversations from a different project are not carried across.

### Attaching images and documents

You can attach images and documents to your message so Tufty can see them and work from them. You might share a screenshot of a layout you like, a spreadsheet whose data you want to bring into your app, or a document that lists instructions for Tufty to follow.

You can attach up to five files at once, and each file must be 10MB or smaller.

#### Supported file types

* Images: PNG, JPG, GIF, SVG and WEBP.
* Documents and spreadsheets: Word (DOCX), plain text (TXT), Markdown (MD), Excel (XLSX) and CSV.

{% hint style="warning" %}
PDFs cannot be attached at the moment. If you try to upload an unsupported file type (or one larger than 10MB). Tufty will display an error message.
{% endhint %}

#### Adding a file

Open the Tufty panel if it is not already showing, then add your file in one of two ways.

Using the paperclip:

1. In the text box at the bottom of the panel, click the paperclip icon.
2. Find your file and click Open.

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FHRHEzUMCjYgmh55MHuoh%2FTufty%20AI%20image%20upload.png?alt=media&amp;token=0188de92-33d1-44f0-bf72-625aa0d9853e" alt="" width="351"><figcaption></figcaption></figure>

By dragging and dropping:

Drag the file into the panel from a folder on your computer or from a web browser. The panel turns blue and shows a "drop file here" message. Release the file to add it.

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FNsfklfa1Yuf7AmiIkN2R%2FTuftyPanel%20-%20Drag%20and%20drop.webp?alt=media&amp;token=aa2d8522-e9db-4b02-b2ca-e126cf96a7e1" alt="" width="375"><figcaption></figcaption></figure>

Attached files sit just above the text box, ready to send with your next message. To remove one before sending, click the small x on it. If you have added several, you can scroll through them.

#### What Tufty can do with your files

What happens next depends on what you ask Tufty to do:

* See and use an image. Tufty can describe what is in an image or use it as a styling reference for your app.
* Follow instructions in a document. Put your instructions in a Word, text or Markdown file, then ask Tufty to follow them. This is useful for longer requests, or ones you want to reuse.
* Import spreadsheet data. Attach an Excel or CSV file and ask Tufty to import the data into your spreadsheet.
* Use several files together. Attach more than one file, for example a text file of instructions and an image for styling, and ask Tufty to work from both.

#### Viewing and downloading files in the chat

After you send your message, the files you attached appear in the chat above your request. Click a file to open it. Images open in a preview with a download button in the top corner, and downloaded images are saved in WEBP format. Some files, such as text files, show a preview, while others, such as Word documents, cannot be previewed but can still be downloaded.

### Giving feedback and reporting a bug

You can tell the team how Tufty is doing right from the chat, and report anything that is not working. Because Tufty is in Early Access, this feedback directly shapes what gets improved.

Underneath each of Tufty's responses you will see a thumbs up button, a thumbs down button and a copy button.

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2FQis20hJh91HPM4Pt5I0m%2FTufty%20AI%20feedback.png?alt=media&amp;token=624fa891-4f9d-4542-a337-ccc3c8c986b9" alt="" width="354"><figcaption></figcaption></figure>

* Click thumbs up if the response was helpful. A short message confirms that your feedback has been logged.
* Click thumbs down if it was not. The Feedback on Tufty AI window opens, where you can tell the team more.

#### Sending feedback

In the Feedback on Tufty AI window, type what did not meet your expectations in the feedback box, then click Submit feedback. When you submit feedback, a copy of your conversation is kept so the team can look into what happened, so bear this in mind if your chat included anything sensitive.

<figure><img src="https://911720298-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkLBGzn2hXrIMe50klQCv%2Fuploads%2Fi39CFav3qOWn6Oj4jzRn%2Fimage.png?alt=media&amp;token=fc5ab477-2d32-4df3-9038-de9a699c115b" alt="" width="563"><figcaption></figcaption></figure>

#### Reporting a bug

The same window has a Found a bug? section for when something is broken. To raise a support ticket:

1. Click Generate Support Package. This creates a support package you can download, and copies the details of the error and your workflow to your clipboard.
2. Email <support@squirrel365.io> describing the problem, attach the support package, and paste in the copied details.

#### Copying a message

You can also copy any single message out of the chat. Hover over one of your own questions, or look underneath a response, to find the copy button. Click it, and a short message confirms the text has been copied. You can then paste it wherever you need it, for example into the spreadsheet or another document.