Can you provide feedback for my Random Quote Machine

I’ve just completed my Random Quote Machine(RQM). I’d love to have feedback from you. Feel free to critique my work and point out where I could’ve done better. I’ve just started my adventure on free-code-camp few days back and I’m new to frontend development :slight_smile:

Here’s the link to my RQM: the link

1 Like

Looks good! Only a few things bothering me which is a good thing.

First thing is that the font is not very readable. Looks good at first glance but is annoying to read when you actually want to read it. Could be a personal problem though.

Second thing is… why is the new quote button way off to the side. My guess is that your trying to get the symetric look with the twitter button, but both could easily be put underneath the quote. When I first loaded it up, I had no idea how to get a quote going. Found it after a few seconds of course but it shouldnt be waay off to the side.

Finally, your page breaks on some smaller mobile devices. Its actually not very good on most mobile devices. Just set a higher width when the screen is smaller then say… 750px wide. You would do this using a @media query. google if you dont know :wink:

That’s all. Fairly small complaints considerably but all together is a really bad combo. Otherwise its a nice site. I like the random background colors and simple styles. Its well programmed but the UX is not too far off from being bad.

1 Like

hi there, i think you can improve by making design more attractive : the color back-ground change in every quote is cool but it hard to read (maybe only me) and you can add float animation to the word and button appear much more nicer . last thing, you can consider move the reset button to the middle and make it larger.

1 Like

Looks great to me! Everything looks calm and nice! Colors are calm, not like super green or red))

1 Like

Thanks a lot, guys @ItsRoyal @masamunevntn and @IlimaVIP for taking time give suggestions.

I’ve made few changes to the RQM:

  1. Changed the font. I do agree the previous one was a little unreadable. Hope the new font is readable :slight_smile:
  2. The reason why I’ve placed the re-generate button above is that I thought of fixing its position. But now I’ve changed it and placed it below the quote. I’ve also moved the twitter and re-generate buttons closer.
  3. I’ve made few changes so that my page looks good even on mobile.
  4. I’ve made changes so neither too dark nor too light colours are generated. The range is 50 to 200 now instead of 0 to 255.

In the future, I’ll consider even adding the animations as @masamunevntn suggested. Thanks once again for your kind suggestions :slight_smile:

1 Like