8 Overlooked Details by Beginner UI/UX Designers
source link: https://uxplanet.org/8-overlooked-details-by-beginner-ux-designers-bb6c010ee772
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
8 Overlooked Details by Beginner UI/UX Designers
When designing for a big project, there are some pages or elements that designers often forget about during the designing process. Many mentioned points are being made by beginners and/or in projects where there was no time to create wireframes to foresee all the flows and problems.
1. Forget password flow
It often happens with the beginners when they design the login and registration flows, forget password flow gets lost. Similar to login flow, it takes a short amount of time to design it still, it’s an important flow one should not forget.
Users can recover the password by email and/or phone number. Recovery can be a link that leads the user to create a new password, or it can be a one-time password.
Which would work better — depends on the app/website.
If it’s an email and the user is on a mobile device, it would take more steps to go through to recover the password. And if it’s a mobile number, the problem is that if the user changes his/her number, the future owner of that number can access their account.
More about that you can read in the 4th point of my 8 UX Design Tips for handling controversial positions of UI elements article.
2. 404 error
One of the most challenging pages to design is the 404 page, as it’s often based on personal taste. Designers have relatively creative freedom here, and there are lots of awesome 404 pages. One better than the other. And it’s hard to compete with them. There is always a simple solution of putting big 404 in the middle of the screen and writing how sorry we are, but if we want a mindblowing effect, it’s better at least to try to blow their minds. I know it’s not the best, but my personal favorite is Figma’s 404 page, where you can move the nods of the vector-based shape of 404.
3. Skeletons and Spinners
Skeleton loader is a low-fi wireframish-looking representation of the final design, that appears when you open a page and before the content is downloaded. Open your Facebook and scroll down and you’ll see the gray shapes of the images and texts for a short amount of time before the page will appear. That’s the skeleton. The other popular type of loader is a spinner. A spinner is a spinning circle that shows the user that some progress is going on.
When to use Spinners and Skeletons (and other loaders) is a subject for another day.
In short — We use skeletons when the page has many elements such as pictures, input boxes, texts, basically when information is requested from the back-end. And spinners are better for the progress of some exact process, like purchasing a ticket, the opening of an application, uploading a photo, etc.
There is also mixed variant; the page downloads with skeleton but within that webpage, there are micro-spinners on waiting processes.
So spinners and skeletons are elements (if you could say so) that many beginners often forget about, until the moment when the development process overtakes them.
4. Empty Search page
When designing e-commerce or similar website we design how the search works, and how the results show up. And the cool designs of filters of that search process, and how the products appear on our cool layout grid. But often, beginners forget to design the page of the case when the search brought no results. It’s another problem that appears during the development process.
Same goes for order-history page when users don’t have any orders yet.
5. Payment Failed Pages
In the flow of the payment process of e-commerce or some other app/website, there is this cool page at the end of the flow where a message appears telling users that their purchase was successful. There are often cases when beginner designers forget to design the failed message page, for example, when users didn’t have any money on the card, or some other problem appeared. There are even times when designers forget about the success page as well, and flow takes users straight to the homepage.
So it’s another proof that it’s always better to have, IA, Site Map and User flow before starting the design.
6. Handoff some assets
It’s an often case when the designer forgets to handoff some images or icons or other assets to developers. Again the problem appears during the development process and designers will have to go back, make and export them to hand off to engineers.
7. Providing the Style Guide
Some beginners often forget (or don’t consider it necessary) to create a Style Guide for the website/app. Some designers create the Style Guide before starting the design, others after finishing, and some during the process. I would suggest to make it whenever it suits you, but it’s an important document that developers must get before their involvement. If they have a Style Guide, they may even correct your accidental errors sometimes.
8. Favicon
Favicons are the small icons on the tabs of browsers. Usually, it’s a logo of a website/app, sometimes, another identifying symbol/image.
Often designers forget to design the favicon, and developers/project managers remind them to design and deliver it only when the project is at its launch. It would be better to include them with all other assets and hand them over to developers before the start of coding.
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK