Construct a customized UI for Amazon Q Enterprise

Amazon Q is a brand new generative synthetic intelligence (AI)-powered assistant designed for work that may be tailor-made to your enterprise. Amazon Q might help you get quick, related solutions to urgent questions, resolve issues, generate content material, and take actions utilizing the information and experience present in your organization’s data repositories and enterprise techniques. If you chat with Amazon Q, it supplies instant, related data and recommendation to assist streamline duties, pace up decision-making, and spark creativity and innovation at work. For extra data, see Amazon Q Enterprise, now usually out there, helps increase workforce productiveness with generative AI.

This submit demonstrates easy methods to construct a customized UI for Amazon Q Enterprise. The custom-made UI means that you can implement particular options like dealing with suggestions, utilizing firm model colours and templates, and utilizing a customized login. It additionally allows conversing with Amazon Q by means of an interface customized to your use case.

Resolution overview

On this answer, we deploy a customized internet expertise for Amazon Q to ship fast, correct, and related solutions to your enterprise questions on high of an enterprise data base. The next diagram illustrates the answer structure.

The workflow contains the next steps:

The consumer accesses the chatbot utility, which is hosted behind an Utility Load Balancer.
After the consumer logs in, they’re redirected to the Amazon Cognito login web page for authentication.
- This answer makes use of an Amazon Cognito consumer pool as an OAuth-compatible id supplier (IdP), which is required to be able to trade a token with AWS IAM Id Middle and afterward work together with the Amazon Q Enterprise APIs. For extra details about trusted token issuers and the way token exchanges are carried out, see Utilizing purposes with a trusted token issuer. If you have already got an OAuth-compatible IdP, you need to use it as an alternative of setting an Amazon Cognito consumer pool.
- Provisioning native customers within the consumer pool and reconciling them with IAM Id Middle will be error-prone. You may streamline the mixing of IAM Id Middle customers into the consumer pool through the use of a federated IdP and making a second customized utility (SAML) in IAM Id Middle. For directions, seek advice from How do I combine IAM Id Middle with an Amazon Cognito consumer pool and the related demo video.
The UI utility, deployed on an Amazon Elastic Compute Cloud (Amazon EC2) occasion, authenticates the consumer with Amazon Cognito and obtains an authentication token. It then exchanges this Amazon Cognito id token for an IAM Id Middle token that grants the appliance permissions to entry Amazon Q.
The UI utility assumes an AWS Id and Entry Administration (IAM) position and retrieves an AWS session token from the AWS Safety Token Service (AWS STS). This session token is augmented with the IAM Id Middle token, enabling the appliance to work together with Amazon Q. For extra details about the token trade movement between IAM Id Middle and the IdP, seek advice from Learn how to develop a user-facing information utility with IAM Id Middle and S3 Entry Grants (Half 1) and Half 2.
Amazon Q makes use of the chat_sync API to hold out the dialog.
1. The request makes use of the next necessary parameters:
  1. applicationId – The identifier of the Amazon Q utility linked to the Amazon Q dialog.
  2. userMessage – An end-user message in a dialog.
2. Amazon Q returns the response as a JSON object (detailed within the Amazon Q documentation). The next are a couple of core attributes from the response payload:
  1. systemMessage – An AI-generated message in a dialog.
  2. sourceAttributions – The supply paperwork used to generate the dialog response. In Retrieval Augmentation Era (RAG), this at all times refers to a number of paperwork from enterprise data bases which can be listed in Amazon Q.

Conditions

For this walkthrough, it is best to have the next conditions:

An AWS account arrange.
A VPC the place you’ll deploy the answer.
An IAM position within the account with enough permissions to create the mandatory sources. In case you have administrator entry to the account, no further motion is required.
An present, working Amazon Q utility, built-in with IAM Id Middle. In the event you haven’t set one up but, see Creating an Amazon Q utility.
Entry to IAM Id Middle to create a buyer managed utility.
An SSL certificates created and imported into AWS Certificates Supervisor (ACM). For extra particulars, seek advice from Importing a certificates. In the event you don’t have a public SSL certificates, comply with the steps within the subsequent part to generate a non-public certificates.

Generate a non-public certificates

If you have already got an SSL certificates, you may skip this part.

You’ll obtain a warning out of your browser when accessing the UI in case you didn’t present a customized SSL certificates when launching the AWS CloudFormation stack. The directions on this part present you easy methods to create a self-signed certificates. This isn’t really helpful for manufacturing use instances. It is best to get hold of an SSL certificates that has been validated by a certificates authority, import it into ACM, and reference this when launching the CloudFormation stack. If you wish to proceed with the self-signed certificates (for growth functions), it is best to have the ability to proceed previous the browser warning web page. With Chrome, you will notice the message Your connection isn’t non-public error message (NET::ERR_CERT_AUTHORITY_INVALID), however by selecting Superior, it is best to then see a hyperlink to proceed.

The next command generates a pattern self-signed certificates (for growth functions) and uploads the certificates to ACM. You can even discover the script on the GitHub repo.

openssl req 
  -x509 -nodes -days 365 -sha256 
  -subj '/C=US/ST=Oregon/L=Portland/CN=sampleexample.com' 
  -newkey rsa:2048 -keyout key.pem -out cert.pem

aws acm import-certificate --certificate fileb://cert.pem --private-key fileb://key.pem

Word down the CertificateARN to make use of later whereas provisioning the CloudFormation template.

Provision sources with the CloudFormation template

The complete supply of the answer on within the GitHub repository and is deployed with AWS CloudFormation.

Select Launch Stack to launch a CloudFormation stack in your account and deploy the template:

This template creates separate IAM roles for the Utility Load Balancer, Amazon Cognito, and the EC2 occasion. Moreover, it creates and configures these companies to run the end-to-end demonstration.

Present the next parameters for the stack:

Stack title – The title of the CloudFormation stack (for instance, AmazonQ-UI-Demo).
AuthName – A globally distinctive title to assign to the Amazon Cognito consumer pool. Ensure your area title doesn’t embrace any reserved phrases, comparable to cognito, aws, or amazon.
CertificateARN – The CertificateARN generated from the earlier step.
IdcApplicationArn – That is the Amazon Useful resource Identify (ARN) for the AWS Id Middle buyer utility. Depart it clean on the primary run, as a result of you want to create the Amazon Cognito consumer pool as a part of this stack. This may create an IAM Id Middle utility with an Amazon Cognito consumer pool because the trusted token issuer.
LatestAMIId – The ID of the AMI to make use of for the EC2 occasion. We advise conserving the default worth.
PublicSubnetIds – The ID of the general public subnet that can be utilized to deploy the EC2 occasion and the Utility Load Balancer.
QApplicationId – The present utility ID of Amazon Q.
VPCId – The ID of the present VPC that can be utilized to deploy the demo.

After the CloudFormation stack deploys efficiently, copy the next values on the stack’s Outputs tab:

Viewers – Viewers to arrange the client utility in IAM Id Middle
RoleArn – ARN of the IAM position required to arrange the token trade in IAM Id Middle
TrustedIssuerUrl – Endpoint of the trusted issuer to arrange IAM Id Middle
URL – The load balancer URL to entry the UI utility

Create an IAM Id Middle utility

The actions described on this part are one-time actions. The purpose is to configure an utility in IAM Id Middle to signify the appliance you might be constructing. Particularly, on this step, you configure IAM Id Middle to have the ability to belief the id tokens by which your utility will signify its authenticated customers. Full the next steps:

On the IAM Id Middle console, add a brand new customized managed utility.
For Utility kind, choose OAuth 2.0, then select Subsequent.
Enter an utility title and outline.
Set Utility visibility as Not seen, then select Subsequent.
On the Trusted token issuers tab, select Create trusted token issuer.
For Issuer URL, present the TrustedIssuerUrl you copied from the CloudFormation stack output.
Enter an issuer title and hold the map attributes as E mail.
Within the IAM Id Middle utility authentication settings, choose the trusted token issuer created within the earlier step and add the Aud declare, offering the viewers you copied from the CloudFormation stack output, then select Subsequent.
On the Specify utility credentials tab, select Enter a number of IAM roles and supply the worth for RoleArn you copied from the CloudFormation stack output.
Evaluation all of the steps and create the appliance.
After the appliance is created, go to the appliance, select Assign customers and teams, and add the customers who may have entry to the UI utility.
On the Choose setup kind web page, select All purposes for service with similar entry, select Amazon Q from the Companies record, and select Belief purposes.
After the IAM Id Middle utility is created, copy the appliance ARN.
On the AWS CloudFormation console, replace the stack and supply the IAM Id Middle utility ARN for the parameter IdcApplicationArn, then run the stack.
When the replace course of is full, go to the CloudFormation stack’s Outputs tab and replica the URL offered there.

Customized UI

The CloudFormation stack deploys and begins the Streamlit utility on an EC2 occasion on port 8080. To view the well being of the appliance operating behind the Utility Load Balancer, open the Amazon EC2 console and select Load Balancing below Goal teams within the navigation pane. For debugging functions, it’s also possible to hook up with Amazon EC2 by means of Session Supervisor, a functionality of AWS Techniques Supervisor.

To entry the customized UI, use the URL that you just copied from the CloudFormation stack output. Select Enroll and use the identical e-mail handle for the customers that had been registered in IAM Id Middle.

After profitable authentication, you’re redirected to the customized UI. You may improve it by implementing customized options like dealing with suggestions, utilizing your corporations model colours and templates, and personalizing it to your particular use case.

Clear up

To keep away from future prices in your account, delete the sources you created on this walkthrough. The EC2 occasion with the customized UI will incur prices so long as the occasion is energetic, so cease it once you’re finished.

On the CloudFormation console, within the navigation pane, select Stacks.
Choose the stack you launched (AmazonQ-UI-Demo), then select Delete.

Conclusion

On this submit, you discovered easy methods to combine a customized UI with Amazon Q Enterprise. Utilizing a customized UI tailor-made to your particular wants and necessities makes Amazon Q extra environment friendly and easy to make use of for your enterprise. You may embrace your organization branding and design, and have management and possession over the consumer expertise. For instance, you could possibly introduce customized suggestions dealing with options.

The pattern customized UI for Amazon Q mentioned on this submit is offered as open supply—you need to use it as a place to begin to your personal answer, and assist enhance it by contributing bug fixes and new options utilizing GitHub pull requests. Discover the code, select Watch within the GitHub repo to obtain notifications about new releases, and verify again for the newest updates. We welcome your solutions for enhancements and new options.

For extra data on Amazon Q enterprise, seek advice from the Amazon Q Enterprise Developer Information.

Concerning the Authors

Ennio Emanuele Pastore is a Senior Architect on the AWS GenAI Labs workforce. He’s an fanatic of every little thing associated to new applied sciences which have a constructive influence on companies and normal livelihood. He helps organizations in attaining particular enterprise outcomes through the use of information and AI, and accelerating their AWS Cloud adoption journey.

Deba is a Senior Architect on the AWS GenAI Labs workforce. He has in depth expertise throughout large information, information science, and IoT, throughout consulting and industrials. He’s an advocate of cloud-centered information and ML platforms and the worth they’ll drive for patrons throughout industries.

Joseph de Clerck is a senior Cloud Infrastructure Architect at AWS. He leverages his experience to assist enterprises resolve their enterprise challenges by successfully using AWS companies. His broad understanding of cloud applied sciences allows him to plot tailor-made options on subjects comparable to analytics, safety, infrastructure, and automation.