Redesigning Tailwind UI 404 Page

Chip Dong Lim
Chip Dong Lim
    • Get in touch
    Redesigning Tailwind UI 404 Page
    Redesigning Tailwind UI 404 Page
    Redesigning Tailwind UI 404 Page
    Redesigning Tailwind UI 404 Page
    Redesigning Tailwind UI 404 Page
    Redesigning Tailwind UI 404 Page
    Redesigning Tailwind UI 404 Page
    Redesigning Tailwind UI 404 Page
    Download color palette
    1. Dribbble TailwindUI 404 01.png
    2. Dribbble TailwindUI 404 02.png
    3. Dribbble TailwindUI 404 03.png
    4. Dribbble TailwindUI 404 04.png
    5. Dribbble TailwindUI 404 05.png
    6. Dribbble TailwindUI 404 06.png
    7. Dribbble TailwindUI 404 07.png
    8. Dribbble TailwindUI 404 08.png

    How to design a simple 404 page?

    Context
    In this post, I am going to walk you through what are the design improvements we can make for the current 404 page for TailWind UI. I don't want to just redesign the UI. I want to understand what are the common problems that 404 pages are facing, and upon reading some materials, I found out these:

    Common problems of 404 pages
    - No explanation on what the error code is
    - No resolve action
    - Missed opportunity for branding & UX

    Design Goals
    - Explain the error in plain language
    - Provide actionable steps to remedy the situation
    - Make a custom error page that can win your customer's head and heart

    Design Iterations
    Learnings from Adam Wathan's tweet–rather than planning: Do, execute, and iterate along the way.

    Press L to show some love. Your comments and feedback are welcomed and appreciated! :)

    Follow me for more upcoming work!
    Portfolio | Twitter | Instagram | LinkedIn

    Rebound of
    Design a 404 Page
    By Dribbble
    Chip Dong Lim
    Chip Dong Lim Get in touch

    More by Chip Dong Lim

    View profile
    • Like