/Fork_azureaistudio

🌎Azure AI Studio

Primary LanguageBicepMIT LicenseMIT

Azure AI Studio Demo and Workshop

To see if you have existing Azure AI Resources or to return to previously deployed Azure AI Resourses:

If you have no existing Azure AI Resourses please use this Azure AI Workshop GitHub Repo to deploy them.

This is a GitHub Repo for an Azure AI Studio Demo and Workshop deployed using Azure ARM Templates Accelerators and Bicep language to deploy the development environments. It includes three development use cases:

Steps in creating a Chat Web App using RAG in Azure AI Studio

Step 1. Deploy Azure AI Studio using the ARM Deploy to Azure button

aistudiowestus

Step 2. Deploy Azure AI Studio services using Bicep script in VsCode

aistudiowestusprojresources

Step 3. Delete the exiting AI Hub in the Azure Portal Resource Group

Step 4. Create a new Azure AI Studio Hub in AI Studio

Step 5. Create a new AI Studio Project in AI Studio

Step 6. Create a new connection and Data source in the Project Components of AI Studio

Step 7. Create a new Index in the Project Components of AI Studio

Step 8. Create a new system message and Add your data in Chat in the Project playground of AI Studio

Step 9. Test your chat in Chat of the Project playground of AI Studio

Step 10. Deploy to a web app in Chat of the Project playground of AI Studio

Step 11. Launch the web app in Chat of the Project playground of AI Studio

Step 12. Login to the web app and test the chat

  1. Build a RAG App in the Azure AI Studio Playground

    Prereqs

    Clone this GitHub repo

    git clone https://github.com/DataSnowman/azureaistudio.git
    

    Note: At the time of this demo (Feb 23, 2024) the East US2 was the most complete region for available LLMs

    A) Deploy Azure AI Studio

    B) Deploy Azure Machine Learning

    C) Deploy Demo Project Resources

  2. Build a RAG App in Azure AI Studio using Code-First

    Note: If you did the "Build a RAG App in the Azure AI Studio Playground" use case already you can re-use the Azure AI Studio you have already deployed

    A) If not you can Deploy Azure AI Studio

  3. Build a ChatGPT4 Turbo with Vision App in the Azure AI Studio Playground

    Note: At the time of this demo (Feb 23, 2024) ChatGPT Turbo4 with Vision was only available in West US region so it required an additional deployment of Azure AI Studio in West US

    A) Deploy Azure AI Studio

Deploy Azure AI Studio

Azure AI Studio basic setup

Based on an updated Quickstart template for the Azure AI Studio basic setup

Deploy To Azure Visualize

This template deploys the following:

  • Azure AI Studio
  • Azure AI services
  • Application Insights
  • Container registry
  • Key vault
  • Storage account

Fill out the form and click Review + create

aasportalqs

Click Create

createaas

The deployed services should look something like this:

aasresources

Deploy Azure Machine Learning

Azure Machine Learning service workspace

Based on the Quickstart template for the Create an Azure Machine Learning service workspace

Deploy To Azure Visualize

This template deploys the following:

  • Azure Machine Learning workspace
  • Application Insights
  • Container registry
  • Key vault
  • Storage account

Fill out the form and click Review + create

amlportalqs

Click Create

createaml

The deployed services should look something like this:

amlresources

Deploy Demo Project Resources

If you have Visual Studio Code installed If not go here, you can use the Bicep extension to run Bicep scripts by doing the following:

  • Open the infra\DeployAzureResources.bicep script.

  • Use Ctrl+Shift+P (or Cmd+Shift+P on Mac) to open the Visual Studio Code Command Palette prompt. Then, type Bicep into the search menu and click on Bicep: Deploy Bicep File to chose it.

cmdpalette

  • Provide a name for the deployment or accept the automatically provided name by clicking Enter.

deployment

  • Select the appropriate subscription. This subscription must be listed for Azure OpenAI access!

  • Select Create new Resource Group

createrg

Enter a name for that Resource Group

rgname

  • Select a location (region)

region

  • There will not be a parameter file for this script, so it is safe to choose None.

parameter

At this point, the deployment script will kick off. You can select the link in the Output window to view the deployment in the Azure portal.

Once your deployment completes, you should see all of your resources in the resource group you have created. These include and Azure OpenAI service, an Azure AI Search service, a Speech service, and a storage account.

bicepservices

Development Usecases

Build a RAG App in the Azure AI Studio Playground

Open up the Resource Group that you deployed AI Studio into and click on the Azure AI resource

azureai

Click on Launch Azure AI Studio

launchaistudio

This will take you to the Manage tab of Azure AI Studio

manageaistudio

Navigate to the All Azure AI Dropdown. We won't look at these now, but this is where you would navigate to the other Azure AI Cognitive Services Studios like Azure Machine Learning Studio and Speech Studio.

allazureai

Navigate to the Home tab and have a look around the page

homeaistudio

Navigate to the Explore tab and look around (explore) the page

exploreaistudio

Navigate to the Build tab and look around the page

buildaistudio

In the Build tab click New project. Call the project something like faq and click the Create a project button

createaprojectfaq

Click on the Playground tab in the Tools on the left nav

playgroundfaq

Notice the banner near the top of the page No deployment exists: You need a deployment to work in the playground. Navigate to the Deployment page to create a deployment.

deploymentbanner

Click on Deployments in the Components on the left nav and click +Create

deployments

Select Real-time endpoint

rte

Select gpt4 and click Confirm

gpt4

Click Deploy

deploygpt4model

You should have you first model deployment

onemodel

Click back on the Deployments on the left nav and click +Create again

deployada

Select Real-time endpoint

rte

Search for ada and select text-embedding-ada-002 and click Confirm

ada

Click Deploy

deployadamodel

You should have you second model deployment

twomodel

Click back on Playground on the left nav

playground

In the System message change it slightly to read as follows:

You are an AI assistant that helps people find information on Frequently Asked Questions.

Click on Apply changes and Continue

applychanges

Prepare to Add your data

Make sure you use the storage account and Azure AI Search you created with Bicep earlier in Deploy Demo Project Resources , as the storage account must be in the same region as Azure AI Search.

Back in the Azure AI Studio Playground click on the Add your data tab and click Add a datasource button

addadatasource

Click on the Turn on CORS button

cors

Enter a Index name like contoso-suites, Click the check box for Add vector search for this resource, Select the Ada embedding model, and click the check box for I acknowledge that connecting to an Azure AI Search account will incur usage to my account Click Next

next

Navigate to the files hotels.txt and resorts.txt in the Repo that you cloned /datasnowman/azureaistudio/data

Upload the file by clicking Upload files

upload

Click Next

uploadfiles

Select Hbrid (vector + keyword) and check the Acknowledge checkbox and click Next

hybridvector

Click Save and close

saveandclose

The Ingestion in progress should be visable

ingest

The data should be uploaded and indexed

uploadedindexed

Test the with Start Chatting. Enter this into the Chat and click the run arrow

What hotels are available?

startchatting

Here is what should be returned

availablehotels

Add speech to text by clicking on the microphone in the chatbox

chatbox

Enable Speech to text and Text to Speech Pick a Voice configuration and select Play Click Save

enablespeech

Click on the microphone in the chatbox and say How many rooms in the Oceanview Inn? and click the run arrow

rooms

The voice "Amber" should tell you it has 60 rooms

sixty

Deploy a new web app

deploynewwebapp

Fill out the form and click Deploy

deploywebapp

Wait on the page for it to deploy

wait

Click on the Launch button

launch

When the app deploys try it out

app

Build a RAG App in Azure AI Studio using Code-First

PLEASE REFER TO THE FOLLOWING GITHUB REPO FOR THE CODE-FIRST EXPERIENCE AND AI RESOURCE DEPLOYMENT

Choices:

  1. Use Codespaces or local development environment

  2. Use "Open project in VS Code (Web)" in an already "Deployed Azure AI Studio"

Create a New ai project in Azure AI Studio

newaiproject

Give the project an name and click Create an AI project

createaiproject

Click the Open project in VS Code (Web) button

openprojectinvscodeweb

Provide a Compute name and Virtual machine size and click create

createcomputefordev

When the compute is ready click Launch

launchcompute

Follow the README.md

The Azure AI SDK To get started with the AI SDK, we recommend the aistudio-copilot-sample repo as a comprehensive starter repository that includes a few different copilot implementations. For the full list of samples, check out the Azure AI Samples repository.

  1. Open a terminal
  2. Clone a sample repo into your project's code folder. You may be prompted to authenticate to Github
cd code
git clone https://github.com/azure/aistudio-copilot-sample

Follow along in Step 2 of the aistudio-copilot-sample step-2-create-and-connect-to-azure-resources

When you are done remember to Stop the compute

stopcompute

Build a ChatGPT4 Turbo with Vision App in the Azure AI Studio Playground

Note: At the time of this demo (Feb 23, 2024) ChatGPT Turbo4 with Vision was only available in West US region so it required an additional deployment of Azure AI Studio in West US

Deploy Azure AI Studio

Create a Azure AI Studio deployment

demoturboviz

Click on the AI service

aiserviceturbo

Click on Launch Azure AI Studio

launchturboaistudio

You will land here. Click on the Build tab

manageturbo

Click New AI project

buildturbo

Click Create an AI project

createanaiprojectturbo

Click on Deployements and click +Create

pluscreateturbo

Select Real-time endpoint

rte

Select gpt4 and click Confirm

gpt4

Choose Model version Vision-preview. Click Deploy

deployvisionmodel

Click Open in playground

openinpgvision

In the Start chatting section enter the following:

Describe this image and where I could visit the location

And click on the paperclip attach to add the following picture beaverlodge.jpg from the path of the cloned repo azureaistudio\data\beaverlodge.jpg

beaverlodge

visionchat

Click on the run arrow and it should return something like this:

responseimage1

Lets try another image of a vehicle registration

In the Start chatting section enter the following:

Extract the Vehicle Registration fields as json: Registration no, Plate no, Year, Make, Model, Body style, VIC, Colour, VIN, Fuel type, Net weight, Seating capacity, Vechicle type, Anti-theft device

And click on the paperclip attach to add the following picture bcicbcregistration.png from the path of the cloned repo azureaistudio\data\bcicbcregistration.png

bcicbcregistration

visionchat2

Click on the run arrow and it should return something like this:

{  
  "Registration_no": "5557227",  
  "Plate_no": "1998FK",  
  "Year": "1998",  
  "Make": "SATURN",  
  "Model": "SL2",  
  "Body_style": "4DSDN",  
  "VIC": "PR4645D",  
  "Colour": "GRAY",  
  "VIN": "1G8ZK5277WZ273105",  
  "Fuel_type": "GASOLINE",  
  "Net_weight": "0125KG",  
  "Seating_capacity": "5",  
  "Vehicle_type": "PASSENGER",  
  "Anti-theft_device": "PASSIVE IMMOBILIZER"  
}  

responseimage2