GOAL: Design an animated, double-sided accordion with a modern, interesting UI. Each expanded text box can flip to show more details, including another accordion. This will be a prototype for presenting information on a new website.
Often, there will be more text on SIDE TWO. Therefore, when the flip occurs, the text box must be able to both enlarge (beyond the borders of the SIDE ONE box) and to center itself on the page – with an X to collapse and close it.
The attached document describes in detail how I visualize the animated accordion working.
The deliverable I need at the end of this project…
o A short demo video to show how the accordion functions
o The code – which will be used in a new website. Coding must be clean and good.
o A fully functioning work sample that includes SIDE ONE and SIDE TWO. I will provide the text to the project winner.
After this project: I hope to continue working with the winner of this project to create the rest of the website. When it is done, it will be maintained by our internal tech department.
IMPORTANT: I am open to ideas/suggestions about how to achieve this goal. Below is how I visualize it working.