Frontend developer tests
test 1
Use these AIs to create a simple web app or landing page of your choice, you should give the same prompt to all 3 AIs and compare the output.
Use the current best model from the above providers, or another one if you have a good reason.
You have to use Web Awesome for UI components.
Make sure you read the Web awesome docs and use all it offers: Color variables, components, patterns etc.
The AI will probably hallucinate as it is a newer framework, you have to fix the AI’s errors manually.
The app has to at least show:
- Use of media queries
- Use of svg images (Also show how you compress / optimize SVGs)
Things you need to consider:
- Aesthetics
- Library usage (does the AI use outdated libraries or the latest ones)
- Code quality
- Efficiency
- Modern CSS: Does it use outdated / bad CSS practices or deprecated APIs?
Then do a second prompt for each of the AI with your suggestions on how to improve the code. Then make an assesment.
Then, after this “final result” from the AI. Make manual changes to improve what the AI did not do well, explain what you do an why.
You have to use these browser APIs in your app: