404 Error Page - PiggyBank

Communication is good and effective but the UI can be improved:

1. The typography is all over the place the line height can be increased, font weights and spacing can be improved for better readability.

2. Button size is too big.

3. The layout seems detached. Adding a background to the illustration and fixing the alignment and spacing will tie up the elements making it more balanced.

Other than that, there is potential, keep doing the good work.

I liked how you blended humor with a serious suggestion on navigating away from this 404 error page. The page seems to contain just the right amount of information for users.

Visually, I would recommend increasing the line height for the text, as it appears cramped. I'd also advice to reconsider the type hierarchy. Too many elements fight for users' attention.

Other than that, good work on the copy!

Very nice wordplay. I see two main concerns here. The copy may be a bit confusing for the users who are less familiar with the 404 error term. Also it may be beneficial to add more typographical hierarchy using font-sizes and additional font-weight to create easily scannable and appealing text structure. Overall looks cool 👍

Image size works for me but I wonder if the image could be tweaked to reflect the words – perhaps a pig lost in space. I really like the words and metaphor that you have come up with but watch some of your text sizing (particularly the text spacing/ leading). Maybe think about including a big 404 faded in the background to make it really clear that this is a 404 message.

Hey Nina, I really liked the UX copy - it made me smile! This is what I like to see on a 404 page...they usually feel standard and boring but I can see you were trying to add a bit of brand personality and signposting people to other resources, which is good. From a UI design aspect:

• Buttons - these are a little large, they can be a lot smaller and the blue should match the logo blue, as in theory that would be the brand's primary colour and you'd want some consistency.
• Hierarchy - 'This little piggy got lost in the 404 field' copy could be the heading, and then 'help piggy get back home' could be body copy and much smaller. At the moment it feels a bit 'shouty' and everything is bold black copy and BIG. Think about what you want people to see first, and then where you want their eye to go to after that and adjust the size, font weight etc accordingly. This will help people scan the page more effectively and take the appropriate actions.

Considering the fact that you are a copywriter, this is a good submission with lots of potential to be great. Consider the following :

• You can learn more about visual hierarchy and type scales in web design to help you use the right weight and sizes for the right sections.
• Doing the above will also lead you to learn more about how websites are structured, headers, paragraphs, sections etc.
• Read more about color schemes and pallets. There are really good resources here on Uxcel that you could check out
• Lastly, you can also learn more about visual appeal by taking a few visual design lessons, that would help you build on the typography, layout and color knowledge.

In conclusion, you did good for a copywriter, you can improve greatly with more submissions and working on feedback from the great designers on here.

Cheers!