Design? Visual Design?
What is Visual Design?
Visual design aims to improve a design’s/product’s aesthetic appeal and usability with suitable images, typography, space, layout and color. — interaction-design.org
In other word, visual design is about what people see on the screen instead of how the things work. Visual design helps to capture the attention of the user using visual aesthetics.
Wireframe
A Wireframe is a blueprint for your application using dummy data, the sole purpose of designing a wireframe is to create a good interface structure.
Mockups
After finishing a wireframe, you could use another step that is mockup.
In this step you will create a more detailed scheme for your app using the finalized data, images, color scheme, etc.
Nielsen’s 10 Usability Heuristics
These are the 10 points of general principles for interaction design. These points are rules of thumb on doing design and this is how we apply it in our ongoing project.
- Visibility of system status
Having an indicator that shows the user what is happening, this can be through feedback from the system based on input, or letting the users know where they are at.
- Match between system and the real world
The design is used generally. The user should feel familiar with the icons, phrases, and concepts. Using real-world conventions such as a plus to indicate adding feature is one of them.
- User control and freedom
The user should be able to undo an action without having to go through an extended process, this could be simply by having a back button to go back to the page before, or even a cancel button to simply redo their input.
- Consistency and standards
The UI of the application should be consistent, the user should not feel like they’ve gone to another app by having the same theme, objects, and colors. - Error prevention
Users should be given an indication of error before it can happen, an example of this can be easily found when a user gives input on form incorrectly, the system should check if the input given has the correct type or not to prevent an error from occurring. - Recognition rather than recall
The system should minimize the user’s memory load by reducing the information that the user needs to remember, for example editing something that user the has already inputted before, the user should be given the last input as a placeholder.
- Flexibility and efficiency of use
Regulars or users that use the app often should have the ability to do the task faster by having shortcuts. This can be by providing keyboard shortcuts, allowing for customization, etc. - Aesthetic and minimalist design
Interfaces should not be messy, contain only the information needed and focus on the essentials.
- Help users recognize, diagnose, and recover from errors
Users should be able to understand an error message that is displayed. An error message should not be expressed in error codes, indicating the problem that the system had, and giving the solution to the user.
- Help and documentation
Providing the documentation of an implemented feature the moment the user requires it, giving the user the concrete steps on what should be carried out.
Thank you for reading this article,
:)
