Here’s what happened when I designed this 404 page!

This is my journey in designing this 404 page that got +30K views in total. In the end, you can find a summary of what I did and why I think you should do it too.

TL;DR: Create, Share, Get feedback, Redesign, Get feedback, and Redesign Again! Then you will see how much you will learn, your work will get better, and you will gain more support as you go forward!

A couple of days ago, I designed this 404 Error Page👇 in brutalism style:

This is how I created the illustration using Adobe Illustrator and the brush tool:

To be honest, I was really happy about the result and I shared it on Twitter, and I’ve got A LOT of feedback! They were mostly focused in these issues:

1. Color issues: The red was too bright, and it wasn’t easy on the eyes
2. Illustration size

Below you can see some feedback:

Can u try a plain white background as the primary color, then play around with the pink? Pink is a Loud, bold color, and the 404 warning is already loud.

Just go with a more subtle red and black color combination as it looks too intense to the eyes. Making the illustration a little smaller would also help.

The colors look straining to the eye.

So I used the feedback, and I redesigned it to these:

And I shared it again, and I asked which one they chose. This time, the feedback was awesome there. And there were a few pieces of feedback about the UX. So I posted the result on Reddit UX communities to be criticized even more!

Guess what? I got A LOT MORE feedback. They were mostly focused on these issues:

1. The 404 is creative, but it’s not THAT obvious to many people.
2. The font is not very legible.
3. It needs further text because a lot of users don’t know what a 404 error exactly means.
4. A CTA is needed to help the user. Because a lot of users don’t know what the next steps are.

Below you can see some feedback:

Usually, 404 pages are paired with some kind of text beneath the error message graphic about what the error means and, ideally, short helper text on how the user can get back on track. And then, there is no other context to what “404” means other than the “Oops.” What is my next step as a user if I see this page? What does it mean? Why does it say “oops”? Don’t always assume your user knows what you’re talking about.

There’s no message/blurb to describe the issue. Is it a server issue? Is it an issue with my internet? Is there anything I can do to correct the error, or is it something that I just need to check back later?

Based on these comments, I fixed the UX issues. Here’s the result:

Then I posted the (I hope) final results, and I asked which was their favorite. The first one got the most votes. There was still some criticism, and some designers liked the 2nd version more, but the overall result was the 3rd version. Of course, I can’t make everyone happy. And maybe I have to test it with users and do some adjustments. I’m happy about the final result, though.

That number doesn’t matter that much. The important thing is I learned how to make my work better just because I showed up and I accepted the harsh feedback. And I think you should do it too. Don’t just share for the sake of sharing. Pay attention to the feedback you are gaining and learn from it.

1. Don’t be afraid to share your design anyway!
2. Be open to suggestions and feedback!
3. Use the feedback instead of fighting it.
4. Make your work better and ask for feedback again. That’s how you can get better!
5. You aren’t alone. And most people are supportive, and this process will help you grow.

If you don’t share your designs, you can’t make them better! This is definitely common sense, but it’s not common practice!