In my last post “How AI can help product owners create effective user stories”, I wrote that Ai can help product owners by creating user stories. Today I will make a practical example and use ChatGPT and Microsoft Copilot for AI generation a user story. I will use a design of a hotel booking form, give this to the AI and ask them to generate a good well defined story ticket that a developer can start implementing from scratch. For both test I use the free version of both AI.
The Mockup
This is the mockup which I will use and ask AI to generate from this a well defined user story.
The Message
And this will be the message which I will use to trigger the AI to generate the user story:
“Please write a JIRA ticket as a user story for a developer to develop this hotel booking form from scratch. Please think about validation, required fields and enabling or disabling booking button. The user story should have a title, a description and acceptance criterias to write tests.”
Microsoft Copilot result
Title: Develop Hotel Booking Form with Validation and Conditional Button Enabling
Description: As a user, I want to book a hotel room using an online form so that I can reserve my stay conveniently. The form should include fields for room type, number of guests, name, email, arrival and departure dates and times, free pickup option, flight number, and other requests. The form should have validation for required fields and enable the “Complete Reservation” button only when all mandatory fields are correctly filled out.
Acceptance Criteria:
-
Form Fields:
- Room Type (Dropdown, Required)
- Number of Guests (Dropdown, Required)
- Name (Text fields for First and Last name, Required)
- Email (Text field, Required, must be a valid email format)
- Arrival Date (Date picker, Required)
- Arrival Time (Time picker, Required)
- Departure Date (Date picker, Required)
- Departure Time (Time picker, Required)
- Free Pickup (Radio buttons, Required)
- Flight Number (Text field, Optional)
- Other Requests (Text area, Optional)
-
Validation:
- Room Type must be selected.
- Number of Guests must be selected.
- First and Last name fields must not be empty.
- Email must be in a valid email format.
- Arrival and Departure dates must be valid dates.
- Arrival and Departure times must be valid times.
- Free Pickup option must be selected.
-
Button Enabling:
- The “Complete Reservation” button should be disabled by default.
- The “Complete Reservation” button should only be enabled when all required fields are filled out correctly.
-
Error Messages:
- Display appropriate error messages for each field if the validation fails.
- Error messages should be clear and indicate what needs to be corrected.
-
User Experience:
- The form should be user-friendly and intuitive.
- The layout should be responsive and accessible on different devices.
ChatGPT result
Title: Implement Hotel Booking Form with Validation and Submission
Description:As a user, I want to be able to book a hotel room using a booking form where I can input details such as room type, number of guests, personal information, arrival and departure dates, and request additional services such as free airport pickup. The form should have proper field validation, enable or disable the “Complete Reservation” button based on the input fields, and provide an intuitive user experience.
The form must capture all necessary information for a hotel booking, validate required fields, ensure proper input formats (e.g., dates, email), and prevent submission until all required fields are filled out correctly.
Acceptance Criteria:
-
Room Type and Number of Guests Dropdowns
- The user must select a room type from a dropdown list.
- The user must select the number of guests from a dropdown list.
- Both dropdown fields are required.
- The “Complete Reservation” button is disabled until valid selections are made.
-
Name Field
- The form must have two separate fields for first and last names.
- Both first and last name fields are required.
- Validation: Ensure that only alphabetical characters are allowed, with a minimum of 2 characters.
- If either field is missing or invalid, display an error message.
-
Email Field
- An email field is required to capture the user’s email address.
- Validation: The email should follow standard email format (e.g., example@domain.com).
- If the email is invalid or missing, display an appropriate error message.
- The “Complete Reservation” button remains disabled if the email is invalid or empty.
-
Arrival and Departure Date Fields
-
The form must provide input fields for both arrival and departure dates.
-
Both fields are required and should be in MM/DD/YYYY format.
-
Arrival date must be in the future, and departure date must be after the arrival date.
-
Time selection for both arrival and departure is optional but must be in HHformat if selected.
-
Validation: Show errors if:
- The arrival date is empty or in the past.
- The departure date is earlier than the arrival date.
-
The “Complete Reservation” button is disabled until both dates are valid.
-
-
Free Pickup Option
- The user can select whether they require free airport pickup or not with a radio button (Yes/No).
- If the “Yes” option is selected, the user must provide a flight number.
- Validation: Ensure that a valid flight number is entered if “Yes” is selected for free pickup.
-
Flight Number Field
- The flight number field is required only when the user selects the “Yes, Sure!” option for free pickup.
- Validation: The flight number must follow a valid format (alphanumeric, up to 8 characters).
- If “Yes” is selected and the field is empty or invalid, an error message must be shown.
-
Other Requests Field
- This is an optional field where the user can input any additional requests or comments.
- No validation is needed for this field.
-
Complete Reservation Button
- The “Complete Reservation” button is initially disabled.
- The button remains disabled until all required fields (room type, number of guests, name, email, arrival and departure dates) are correctly filled out.
- If the user has selected “Yes” for free pickup, the flight number must also be valid for the button to be enabled.
- When clicked, the form should trigger a submit action and provide feedback for success or failure.
-
Error Messaging
- For each field that requires validation, an appropriate error message should be displayed when the input is invalid or missing.
- The form should prevent submission until all errors are resolved.
Attachments:Include a visual representation of the form as shown in the attached image.
Conclusion
For me, the clear winner is ChatGPT when it comes to generating a good first draft for a user story.
Microsoft Copilot basically only lists the pure facts that need to be implemented, such as form fields, validation and error handling. ChatGPT, on the other hand, tries to look at the form as a whole and goes into each individual form field and, if necessary, also sets them in relation to each other, as in the example of the free checkup and flight number field. ChatGPT also combines fields where necessary, as in the example of Arrival and Departure Date. For me, this clearly shows that ChatGPT has generated a user story here where the focus is on the relationships and not just the pure enumeration of fields and their conditions.
This gives ChatGPT’s user story a completely different feel for the developer who is supposed to implement it and thus view the form as a whole. This makes much more sense than the pure enumeration generated by Microsoft Copilot. Because you should not forget that the “why” is very important for the developer when implementing the user story and the ChatGPT user story also brings this with it.