Our hero, Walad, needs your help. He has so much to say and so much to do but he is having a hard time organizing and shaping(pun intended) his thoughts and words. We like you to help him to communicate his thoughts in a more stylistic and elastic manner.
To this end, we prepared a small and fun challenge for you. Please read the guidelines below and follow the instructions to complete the challenge.
In this call, we want you to design and implement a React library that will enable Walad to speak in bubbles and configure them as he wishes.
We have some important requirements for you to fulfill.
- The user should be able to input string and emojis into a bubble.
- Once the input is displayed in the bubble, the bubble should shrink by removing the whitespaces around the input.
-
By pressing and dragging the blue circle(which has an arrow on it), the user should be able to change the direction of the bubble arrow.
-
Make sure that once the bubble is repositioned, the bubble arrow should be repositioned as well.
-
Once the bubble is resized, bubble arrow should be resized accordingly
- The user should be able to create multiple bubbles.
- The user should be able to connect the bubbles using the blue circle. Make sure that the extremity of the parent bubble is connected to the child bubble.
- Tapping on the bubble should 'select' the bubble for editing.
- Bubbles should be able to move across the screen but they should be within the screen real estate without any overflows.
- The user should be able to change the bubble's background color.
- The user should be able to remove a bubble.
Please refer to the video below in which you will find the visual representation of what we want you to implement. Please examine it carefully, make sure that you caught the small details and start hacking!
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/Library) - Commit your Changes (
git commit -m 'Add some code ') - Push to the Branch (
git push origin feature/Library) - Open a Pull Request
We value your effort and time so we prepared a small prize for you.
The selected winner will be awarded with €1,000.00 !
We want to hint you about the our criteria for deciding the most favorable PR.
If your codebase is:
- Easily readable,
- Easy to understand,use, and maintain,
- Not complex and heavy on the system,
- Following the clean and secure code best practices,
- Allowing further integration and scalability,
then your code could be what we want!
- You read, understand and agree to the HooPow’s Coding Contest Terms and Conditions
- The video shows only the MVP of the project. We are open to your creative ideas.
- You have seven(7) days to finalize the project and submit PR.
- You can always ping us if you have any questions.
- If you can create documentation, that would be nice too.
- If there are any rendering problems on this page, please refresh the page with cache-reset.(Cmd+shift+r on Mac or Ctrl+shift+r on Windows or Linux)
