React Component for Interactive Graphic with CSS Transitions
Budget: €8 – €30 EUR
I am looking for someone to recreate the attached graphic in React. The graphic should be interactive and animated. Important: All animations and effects must be implemented using CSS Transitions only.
Here are the requirements:
⁃ The two iPhone graphics should be included as separate WebP files.
⁃ The background circle should be included as a separate vector/SVG file.
⁃ The text must be easy to adjust in the code to support a bilingual page (e.g., English/German).
⁃ The iPhone graphics and text bubbles should move on hover. For example:
◦ iPhones can slightly shift or rotate.
◦ Text bubbles can scale up or move slightly.
⁃ Use only standard CSS (no CSS libraries).
⁃ The component must be fully responsive and look good on all devices (desktop, tablet, smartphone).
⁃ Progress and reviews will be done on https://snack.expo.dev/, so make sure your implementation can be shared and tested there.
⁃ The font and style must match the original file, which can be reviewed here: https://loxonet.com/mitarbeiter-app.
Rules for bidding:
⁃ This task must be started immediately.
⁃ I only accept final bids, there will be no renegotiations.
⁃ If communication breaks at any point, the task will be canceled, and I will contact the Freelancer.com team.
⁃ On this exact project page, there are 5 more animations I want to realize. If this task is completed successfully, follow-up tasks are guaranteed.
Feel free to reach out if you have any questions!
Here are the requirements:
⁃ The two iPhone graphics should be included as separate WebP files.
⁃ The background circle should be included as a separate vector/SVG file.
⁃ The text must be easy to adjust in the code to support a bilingual page (e.g., English/German).
⁃ The iPhone graphics and text bubbles should move on hover. For example:
◦ iPhones can slightly shift or rotate.
◦ Text bubbles can scale up or move slightly.
⁃ Use only standard CSS (no CSS libraries).
⁃ The component must be fully responsive and look good on all devices (desktop, tablet, smartphone).
⁃ Progress and reviews will be done on https://snack.expo.dev/, so make sure your implementation can be shared and tested there.
⁃ The font and style must match the original file, which can be reviewed here: https://loxonet.com/mitarbeiter-app.
Rules for bidding:
⁃ This task must be started immediately.
⁃ I only accept final bids, there will be no renegotiations.
⁃ If communication breaks at any point, the task will be canceled, and I will contact the Freelancer.com team.
⁃ On this exact project page, there are 5 more animations I want to realize. If this task is completed successfully, follow-up tasks are guaranteed.
Feel free to reach out if you have any questions!