Hi,
I’m designing a full-stack web app, and in my humbel opinion it looks terrible. Here is a link to it. Can someone give me some pointers so it looks more on the level of this? All feedback or suggestions appreciated. Thanks.
The repo is here: https://bitbucket.org/b3uuy/kittens-app/
1 Like
I actually think your design is better. It is pretty clean, I’d say go for it.
What I didn’t like about the other one is that they’ve used too much shadows.
2 Likes
I added a background to the nav bar. I’m not sure about it though. It sort of frames the page.
Crazy…I had to come back to double check which link was the project and which was the goal! @b3u, I also much…much prefer yours to the other site…much more modern and clean looking. I kinda feel ike you should go with your gut on this…cause you are doing a lot better at designing this than you think you are.
Please dont put a ton of animated hovers effects on your site as is in the other one you posted though…you really dont need it.
2 Likes
Hi from Gitter! A few things that you may not agree with me on:
I agree with the others, YelpCamp is not really a good thing to copy. But just like the thing I said on gitter about things lining up, I think it would be great if you scanned through your padding and margins to see if things lined up. Stuff like your persian kittens in your store seem to have arbitrary padding between the picture and the container in terms of width and height.
Also the page for each individual kitten is a good example of the main pic not lining up with text or headings. It looks messy.
If this was a real website, I would not assume that the person entering the site knows what it is about, so instead of having a splash page that does nothing except take you to the store, I would add a description underneath the title at the very least. Go with the rule of thumb that nobody likes clicking and waiting for another page to load more than they need to.
I agree with cndragn about the pics expanding in YelpCamp, it’s untidy because it moves the “More Info” button to a different spot on the screen. But if something is clickable, make sure that there is some indication to the user that it actually is clickable (maybe shadows, change in colour, there are many ways to do this).
Don’t know if you want to go pro with this and actually sell cats through your online store. I am just going to assume so, so some feeling that I get from your splash page (white logo on left above cloud) and shadow logo over title is that these cats are dead and that you can see ‘ghost’ versions of them walking around a park. Not what you want for a happy pet kitten site…
Overall though, because you’re doing all this by styling CSS alone without a framework, great work. But remember to make the site responsive.
1 Like
@cndragn @Recelis @ghukahr Thank you all so much for your feedback and support. I will definitely implement said suggestions.
@Recelis You think this looks like a ghost, you should’ve sees it when the center cat was white 
. Also, I do need to get better about aligning stuff in prototypes in general.