Having made my Apollo project prototype in Figma, we had a class critique where my teacher and classmates gave me some feedback on the prototype.
( my Figma Apollo 11 project prototype )
Although after the critique I’ll not make any big changes to my Figma prototype because I need to get started on making the website on Framer; I will take the feedback and make all necessary adjustments on the Framer website instead.
This blog will document the feedback I received and how I made changes to my framer websites according to this feedback.
My teacher suggested that I implement a hover state for some of my buttons. This will provide some visual feedback to the user so that they understand that these elements are clickable.
For example, in the Figma prototype home screen, nothing happens if the user hovers over the “start” button;
I fixed this issue in Framer by adding a hover state for this exact same button;
( resting state - user mouse not hovered over button)
( Hover state - user mouse hover over button )
I found the hover state more difficult to implement in Framer than in Webflow. Each colour-changing element that I want to have a hover state for needs to be first made into a variant and then have the hover state adjusted within the variant.
However, this did not put me off and taking on my teacher's advice forward, I also implemented a hover state for most of the clickable buttons in my framer website, and this included the navigation bar;