Chat app CSS illustration solution (Animated)

Solution retrospective
This was a very fun challenge, full of new things to learn and many more to practice.
Easy:
- the initial drawing: making the original design was simple and fun, and I was able to exercise everything I've learned so far in previous challenges.
Difficult:
- Optimize the design of the css and html, since it used too many classes and tags, even after finishing I think it can be further optimized.
- the changes in the drawing to allow the animations, which already represented a load of resources.
- for rendering reasons, the drawing did not look the same in safari and mozilla, which made me change a large part of the structure, so that in both cases it would stay as good as possible (achieved after a few minutes of changes)
- the animation: deciding what to do, how much to do, and limiting myself to only a maxi or 10 seconds of animation was very difficult, and that taking into account not accidentally destroying what I had already done (I would like some advice on animation .. ...)
Impossible:
- ...as always... NAME things!!!!
This was a very fun challenge, full of new things to learn and many more to practice. Easy:
- the initial drawing: making the original design was simple and fun, and I was able to exercise everything I've learned so far in previous challenges. Difficult:
- Optimize the design of the css and html, since it used too many classes and tags, even after finishing I think it can be further optimized.
- the changes in the drawing to allow the animations, which already represented a load of resources.
- for rendering reasons, the drawing did not look the same in safari and mozilla, which made me change a large part of the structure, so that in both cases it would stay as good as possible (achieved after a few minutes of changes)
- the animation: deciding what to do, how much to do, and limiting myself to only a maxi or 10 seconds of animation was very difficult, and that taking into account not accidentally destroying what I had already done (I would like some advice on animation .. ...) Impossible:
- ...as always... NAME things!!!!
Thanks in advance for your advice and feedback.
Please log in to post a comment
Log in with GitHubCommunity feedback
No feedback yet. Be the first to give feedback on Marcos Valenzuela's solution.
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord