memeify icon indicating copy to clipboard operation
memeify copied to clipboard

Use visual libraries to make the webpage more attractive and easy to use

Open jai-dewani opened this issue 5 years ago • 5 comments

Maybe Material UI? Refer to different UI libraries: https://www.codeinwp.com/blog/react-ui-component-libraries-frameworks/

jai-dewani avatar Sep 20 '20 21:09 jai-dewani

I'm interested in contributing to this. Do you have the UI design for this website?

andylim0221 avatar Sep 21 '20 02:09 andylim0221

No, I don't have a UI design to show you, but here is an idea of what I think will look good,

Keep the current layout, navbar at the top, the rest of the screen divided between the meme and the editing functionalities like adding text and whatever we plan to add next. The ratio could be 1:1 or 1:2 giving more screen to the meme 🤭

Do you have specific design views?

jai-dewani avatar Sep 21 '20 04:09 jai-dewani

I don't, but basically I was referring to this meme generator website. I could try out the suggestion which you have provided.

andylim0221 avatar Sep 21 '20 05:09 andylim0221

do you mind if i convert meme generator page into functional component?

andylim0221 avatar Sep 21 '20 12:09 andylim0221

Yeah, I like the popular section on the website you provided...I was aiming to create a place where users can select meme from a catalog or something...maybe you can include that if it fits, feel free to try out any design you find suitable. Just the main motive is to keep the UI simple and easy to use without any instructions :)

I used the class component because I need componentDidMount and componentDidUpdate functions. I know it is possible to do the same in the functional component also but I don't have much experience with it.

Btw most of the display logic is in displayMeme.js which has a function component, won't that work?

jai-dewani avatar Sep 21 '20 12:09 jai-dewani