Roast my project! Cute Cat Markdown Previewer

Hi Campers,

I have just completed my markdown previewer fCC challenge.

There is an extra functionality: every X characters, the program feeds you a cute cat picture to keep you motivated!

Cute Cat Markdown Previewer

I still haven’t optimized the project for mobile devices but I’m working on it.

I encourage you to roast, critique or suggest improvements to my project. It really helps!

P. S. Thank you for your feedback in my last project.

1 Like

Okay, that cute cat motivation is friggin’ adorable!

The project works well. I got the first image at the default 1000 character mark, changed the motivation number to 250, and was updated with a new image at 1250 characters. (I was looking for an expected bug, but it worked fine!)

As a user, I would rather see the text that I am writing in the Markup window side by side while I’m typing my text. If I typo or miss a trailing symbol, I wouldn’t notice until I scroll down and read the preview.

I would suggest adding the actual preview on the right side, next to the text box, and then use a model to display the cat image to the user at X characters. Or maybe put the image above the text box and previewer? Just some suggestions.

Check out the padding for the boxes, it seems to be a bit inconsistent. Maybe put some more padding in the buttons, adjust the padding-top for the footer, etc.

Finally, for users who don’t read the instructions, it might be better to set the default motivation amount to something significantly less than 1000. I just kept typing nonsense without actually knowing what the “motivation amount” was. It would be a cute little surprise if the amount was something like 25, something easily attainable, and the user is prompted with the cat. Then they will realize what the “Motivate me” is about, and then can adjust it to what they want.

I love the extra love you placed into this project to really make it your own

1 Like

I love it too!

A couple of stylistic suggestions!

  • First, I find the contrast between the background and the boxes a little harsh, and the contrast is even starker with the fixed background position. The combination of the strong colors and contrasts in the background AND the fixed background position detracts from the point of the page - editing markdown (and getting cute cat pictures as rewards for writing!).

  • And second, the cat pictures seem a little too big in general, and some of them are different sizes and aspect ratios. A smaller and consistently formatted cat picture reward box might be nice. Although it might be too annoying to have to close a new window, maybe a modal box might be a way to keep the rewards coming while also allowing for what @drregg6 suggests of having the formatted text appear side by side with the markdown.



Thanks a lot George! I love the honest feedback I can find on this forum. I’ll keep working on it and make a second version of the website with your suggestions.

1 Like

Thanks a million for the feedback drregg6 ! There so many thinks I always miss about user experience. I will try to make a second version of the website with your suggestions.

1 Like