Visual Design: Improve the Aesthetic Appeal of Your Product.
Do you want to add an aesthetic feel to a site? Pay attention to your ✨Visual Design✨. The first impression of the user is usually formed within 50 milliseconds. This fact reflects a deeply emotional level of design — in other words, the user’s first impression or instinct of reaction to a design. If they don’t like what they see, they will leave. So, visual design is an essential part of your job as a “designer”.
How to Start?
Making a wireframe is one of the important steps in the design process before creating a digital product. Wireframe is a framework for creating a website layout to suit the client’s wishes before entering the design process.
Making wireframes can simplify tasks for web developers, save time for revisions, build trust with clients because the website is clearly defined.
Then, to make the design look more realistic, create a mockup. Mockup is a visual way of representing a product. While the wireframe mostly represents the structure of the product, the mockup shows how the product should look.
Since mockup is high fidelity static images to demonstrate color schemes, content layouts, fonts, icons, navigation visuals, images. Hence, mockup help you make the final decision. Additionally, with mockup, you can experiment with the visual side of the product to see which one works best.
Is that enough?
To measure how well users use the product/design to achieve the specified goals effectively, efficiently, and satisfactorily, there is Usability. Designers typically measure design usability during the development process — from wireframes to completion — to ensure maximum usability.
There are many choices of guidelines that can be used, sometimes even usability researchers have their own heuristics. One of them is 10 Usability Heuristics by Jakob Nielsen:
1. Visibility of System Status
A condition that is able to provide information that is happening to the user whether it is being done, what part is it, and what is happening.
Touchscreen UIs need to reassure users that their taps have an effect — often through visual change or haptic feedback.
2. Match between System and The Real World
The system must be able to provide information that is easy to understand. To give the user an impression of familiarity and trust.
The system should speak in the user’s language, using words, phrases, and concepts that are familiar to the user.
3. User Control and Freedom
The system must be able to provide convenience and freedom to users in using the interface.
Users often select functions on the system by mistake and will need a clear “emergency exit”, to be able to leave these undesirable conditions, without going through a long process.
4. Consistency and Standard
A consistent and good design will make it easier for users to recognize features so as not to make users hesitate when using certain features.
The system has a standard in presenting elements, code, words/terms that are consistent on each page.
5. Error Prevention
An error or bug in the system is something that is not professional when seen by the user but to handle this can be replaced with an error message in the form of a design.
This can be done by providing the user with a confirmation option before they take an action.
6. Recognition Rather than Recall
Rather than forcing the user to remember, it is better for the user to recognize the system. The user does not have to memorize information from one section to another by listing key difference tables so that the user does not have to memorize them to make comparisons.
On the daftar pertanyaan page, all questions from each article are combined in one table. so that users don’t have to remember which article the question came from.
As another example, try to minimize user memory usage. Remind them to complete certain tasks that need to be completed immediately. Don’t let the user think too much or remember his memory to complete the task.
7. Flexibility and Efficiency of Use
For new users or visitors, of course, they will learn about the system or application first. Therefore the application must be flexible and efficient.
Users can quickly take an approving action by just pressing the “Setujui” button.
8. Aesthetic and Minimalist Design
A good layout design must be comfortable to look at by using good color contrast, an appropriate and harmonious position.
With a minimalist design combined with appropriate whitespace (spacing between elements), it will make the application look elegant.
9. Help user Recognize, Diagnose and Recover from Errors
A good and comfortable design is certainly not complete without handling errors when they occur.
When an error occurs, the app should not only provide an error message but also provide a solution.
10. Help and Documentation
The hope of the user using the system or application, of course, can solve the problem and work. To help them solve their problems or work, we need to provide helpful features and documentation of possible errors in use.
Conclusion
The Jakob Nielsen heuristic is one of the most widely used usability heuristics for user interface design. This guide is a general guideline and will mostly apply to any web & mobile application with a few exceptions. The function of the Heuristic Evaluation method is to determine the level of use of the interface from a website or mobile application.
References
https://www.interaction-design.org/literature/topics/usability
