A reading club signup page is a small enough project to show where three different agent skills fit. Start with a page someone can run, review the interface, then exercise the form in a browser.

1. Design the interface

Give frontend-design the audience, real copy, and primary action. Ask for a mobile-first signup page that makes the time, location, and signup action easy to find. Specify the empty, error, and success states. Review the generated code before moving on.

2. Review the interface

Point web-design-guidelines at the page and form files. Ask for findings with file locations, then manually check keyboard focus, field labels, error messages, and overflow on a narrow screen. The review depends on access to the current guidelines.

3. Exercise the form in a browser

Start the app locally and give webapp-testing a test URL and test data. Use Playwright to check empty submission, invalid input, and a successful submission. Save the expected and actual results and any screenshots needed to reproduce a failure. This requires a running app and a working Playwright environment.

These examples are based on the projects’ documentation. Check that your assistant supports each skill before using it.

Explore Skillπ. Read the original Chinese article on Juejin.

Disclosure: AI assisted with drafting and translation.