Update app.py

app.py

@@ -24,27 +24,24 @@ def cohere_response(msg):
 def generate_prototype(problem):
   prompt_sum = f'''You are a UX designer who is an expert in generating front-end code for a given requirement from a product manager: {problem}. Follow these step-by-step instructions to create a series of mockups that form a clickable prototype:
 
-Understand the Requirement: Carefully read and understand the requirement provided by the product manager.
+1.Understand the Requirement: Carefully read and understand the requirement provided by the product manager.
 
-Identify Personas: Identify the personas outlined in the input problem. For example, if the requirement is for an e-commerce website, personas could include:
+2.Identify Personas: Identify the personas outlined in the input problem. For example, if the requirement is for an e-commerce website, personas could include:
 
 Shopper
 Seller
 Administrator
-Generate Critical User Journeys (CUJs): For each persona, generate Critical User Journeys. For example:
+3.Generate Critical User Journeys (CUJs): For each persona, generate detailed Critical User Journeys that fully capture the persona's intent. 
 
-Shopper: Searching for a product, adding a product to the cart, checking out.
-Seller: Listing a product, managing inventory, viewing sales reports.
-Administrator: Managing users, handling transactions, viewing site analytics.
-Create Screens: Based on the CUJs, create the corresponding screens. For each screen, write HTML code that includes the header with the screen number and the CUJ it caters to. Ensure each screen links to the next to form a clickable prototype.
+4.Create Screens: Based on the CUJs, create the corresponding screens. For each screen, write HTML code that includes the header with the screen number and the CUJ it caters to. Ensure each screen links to the next to form a clickable prototype.
 
-Use Bootstrap and Visual Libraries: Utilize Bootstrap and other popular visual libraries to enhance the design and functionality of the mockups.
+5.Use Bootstrap and Visual Libraries: Utilize Bootstrap and other popular visual libraries to enhance the design and functionality of the mockups.
 
-Avoid Placeholders: Do not use placeholders. Instead, assume real-world use cases to make the mockups useful and realistic.
+6.Avoid Placeholders: Do not use placeholders. Instead, assume real-world use cases to make the mockups useful and realistic.
 
-Ensure Visual Appeal: The mockups should be visually appealing and user-friendly.
+7.Ensure Visual Appeal: The mockups should be visually appealing and user-friendly.
 
-Output HTML Code Only: Generate only the HTML code for the mockups, nothing else. Do not generate commentary around descriptions of the approach followed by the assistant. 
+8.Output HTML Code Only: Generate only the HTML code for the mockups, nothing else. Do not generate commentary around descriptions of the approach followed by the assistant. 
 
 This commentary will be too distracting to include in the HTML mocks for the Gradio app.
 
@@ -115,5 +112,5 @@ gr.Interface(
     outputs=[gr.HTML(),gr.Textbox()],
     title="Prototype generator",
     description="Generate a prototype for a given requirement",
-    examples=["Generate a clickable prototype for an e-commerce site with personas: Shopper, Seller, Administrator, and CUJs like searching for products, listing products, and managing users.","Create a prototype for an online learning platform with personas: Student, Instructor, Administrator, and CUJs like browsing courses, creating courses, and managing users.","Design a prototype for a social media app with personas: User, Moderator, Admin, and CUJs like posting updates, moderating content, and managing users.","Build a prototype for a banking app with personas: Customer, Banker, Admin, and CUJs like checking account balances, managing accounts, and overseeing transactions.","Develop a prototype for a healthcare portal with personas: Patient, Doctor, Admin, and CUJs like booking appointments, managing patient records, and overseeing user activities."],
+    examples=["Generate a clickable prototype for an e-commerce site with personas: Shopper, Seller, Administrator, and CUJs like searching for products, listing products, and managing users.","Create a prototype for an online learning platform with personas: Student, Instructor, Administrator, and CUJs like browsing courses, creating courses, and managing users.","Build a prototype for a banking app with personas: Customer, Banker, Admin, and CUJs like checking account balances, managing accounts, and overseeing transactions.","Develop a prototype for a healthcare portal with personas: Patient, Doctor, Admin, and CUJs like booking appointments, managing patient records, and overseeing user activities."],
 ).launch()