Introducing Notable Notations: A Unique Project with Relume & Webflow

Samu M. · 2024-03-20T20:57:53.715Z

Hello everyone! Excited to share my new the Notable Notations project, crafted with the Relume Library and Webflow. It’s an integral part of my One Man AI initiative (Read more on the website’s ‘Story of Nono’ page). Now, I know quotes might feel like an old tale, but I found joy in reviving them through this project and am eager to see where this path leads. Your feedback is invaluable and deeply appreciated as it fuels further growth and refinement. Thanks!

Introducing Notable Notations: A Unique Project with Relume & Webflow | Relume Community

11 comments

· Sorted by Oldest

Emily M.
·
Hey, I’m viewing it on mobile. First thoughts: nice image, zoom effect would be nicer if it was looped. I also thought the pause icon in bottom right would pause the zooming effect but it hasnt. Unsure what it’s for. Also, the four icons in each corner could be aligned/resized to be more consistent. Right now they feel a bit random… nice typography and good hierarchy Scrolling down, I’m liking the different cards, they’re all distinct but somehow feel part of a group, so well done. The sticky quotes at the bottom feel a bit repetitive as all the images are similar and on the same side of the screen. Also there are a few too many. 3 might be better to allow users to scroll past quicker and to access the all-important CTA! I like it though, nice idea and visual design 👌
Samu M.
·
Thank you for your comments, Emily! I hadn’t tested the hero pause button. No idea why it doesn’t work. Could it possibly be behind some element? Good observation also that there’s an icon in every corner. I can move the top navigation icons, but the bottom ones not so easily, if at all. Need to investigate. You’re right, there are too many sticky quotes. Need to reduce them.
Todd G.
·
Really gorgeous site! all the ai artwork is great, really striking visuals and you can tell how each set is visually in the same theme. One hopefully helpful note, for noting when someone died it should be "passed away" not "past" Did you use webflow CMS for connecting all the series/quotes/authors/categories?
Emily M.
·
There might be a CSS property of pointer-events: none although that seems unlikely. I don't think you need to move the buttons necessarily, I would just make sure their edges line up and they are more visually consistent (if that's what you're going for) by adjusting their sizing. Or make three of them the same visual size and the most important one bigger.
👍1
Samu M.
·
Thank you very much, Todd! Nice to hear that you like it. Positive feedback always inspires! I corrected the “Passed away” part. I started the project without the Webflow CMS tool, so the current implementation still lacks CMS connections as a result. However, I now have a CMS version of Webflow in use and I am planning to first build the Quote page with CMS elements. The goal is to implement more Quotes in the future, so a CMS implementation makes sense.
Todd G.
·
very cool! will be curious to hear how the CMS goes for you, I mostly like the CMS implementation but sometimes you'll run into something limiting like not being able to nest properly, and so on.
Scott C.
·
The imagery is wonderful. How was it generated? I'm looking into ai generated landscapes.
Samu M.
·
Thanks Scott! The images were created with Midjourney.
Samu M.
·
And some cases I have done some color corrections and modifications in Photoshop.
Amir M.
·
its seems all images created via Midjourney
wize'el R.
·
Dope, would love to learn.

Emily M.
·
Hey, I’m viewing it on mobile. First thoughts: nice image, zoom effect would be nicer if it was looped. I also thought the pause icon in bottom right would pause the zooming effect but it hasnt. Unsure what it’s for. Also, the four icons in each corner could be aligned/resized to be more consistent. Right now they feel a bit random… nice typography and good hierarchy Scrolling down, I’m liking the different cards, they’re all distinct but somehow feel part of a group, so well done. The sticky quotes at the bottom feel a bit repetitive as all the images are similar and on the same side of the screen. Also there are a few too many. 3 might be better to allow users to scroll past quicker and to access the all-important CTA! I like it though, nice idea and visual design 👌
Samu M.
·
Thank you for your comments, Emily! I hadn’t tested the hero pause button. No idea why it doesn’t work. Could it possibly be behind some element? Good observation also that there’s an icon in every corner. I can move the top navigation icons, but the bottom ones not so easily, if at all. Need to investigate. You’re right, there are too many sticky quotes. Need to reduce them.
Todd G.
·
Really gorgeous site! all the ai artwork is great, really striking visuals and you can tell how each set is visually in the same theme. One hopefully helpful note, for noting when someone died it should be "passed away" not "past" Did you use webflow CMS for connecting all the series/quotes/authors/categories?
Emily M.
·
There might be a CSS property of pointer-events: none although that seems unlikely. I don't think you need to move the buttons necessarily, I would just make sure their edges line up and they are more visually consistent (if that's what you're going for) by adjusting their sizing. Or make three of them the same visual size and the most important one bigger.
👍1
Samu M.
·
Thank you very much, Todd! Nice to hear that you like it. Positive feedback always inspires! I corrected the “Passed away” part. I started the project without the Webflow CMS tool, so the current implementation still lacks CMS connections as a result. However, I now have a CMS version of Webflow in use and I am planning to first build the Quote page with CMS elements. The goal is to implement more Quotes in the future, so a CMS implementation makes sense.
Todd G.
·
very cool! will be curious to hear how the CMS goes for you, I mostly like the CMS implementation but sometimes you'll run into something limiting like not being able to nest properly, and so on.
Scott C.
·
The imagery is wonderful. How was it generated? I'm looking into ai generated landscapes.
Samu M.
·
Thanks Scott! The images were created with Midjourney.
Samu M.
·
And some cases I have done some color corrections and modifications in Photoshop.
Amir M.
·
its seems all images created via Midjourney
wize'el R.
·
Dope, would love to learn.