Logo

dev-resources.site

for different kinds of informations.

The importance of UI/UX | Software Engineering

Published at
8/30/2021
Categories
design
uiux
sketch
mockup
Author
sanajitjana
Categories
4 categories in total
design
open
uiux
open
sketch
open
mockup
open
Author
11 person written this
sanajitjana
open
The importance of UI/UX | Software Engineering

The user interface is the front-end application view to which the user interacts in order to use the software. The software becomes more popular if its user interface is:

  • Attractive
  • Simple to use
  • Responsive in short time
  • Clear to understand
  • Consistent on all interface screens

There are two types of User Interface:

Command Line Interface:

Command Line Interface provides a command prompt, where the user types the command and feeds it to the system. The user needs to remember the syntax of the command and its use.

Graphical User Interface: Graphical User Interface provides a simple interactive interface to interact with the system. GUI can be a combination of both hardware and software. Using GUI, the user interprets the software.

User Interface Design Process:

Alt Text

The analysis and design process of a user interface is iterative and can be represented by a spiral model. The analysis and design process of the user interface consists of four framework activities.

  1. User, task, environmental analysis, and modelling: Initially, the focus is based on the profile of users who will interact with the system, i.e. understanding, skill and knowledge, type of user, etc, based on the user’s profile users are made into categories. From each category, requirements are gathered. Based on the requirements developer understand how to develop the interface. Once all the requirements are gathered a detailed analysis is conducted. In the analysis part, the tasks that the user performs to establish the goals of the system are identified, described and elaborated. The analysis of the user environment focuses on the physical work environment. Among the questions to be asked are:
  • Where will the interface be located physically?
  • Will the user be sitting, standing, or performing other tasks unrelated to the interface?
  • Does the interface hardware accommodate space, light, or noise constraints?
  • Are there special human factors considerations driven by environmental factors?
  1. Interface Design: The goal of this phase is to define the set of interface objects and actions i.e. Control mechanisms that enable the user to perform desired tasks. Indicate how these control mechanisms affect the system. Specify the action sequence of tasks and subtasks, also called a user scenario. Indicate the state of the system when the user performs a particular task. Always follow the three golden rules stated by Theo Mandel. Design issues such as response time, command and action structure, error handling, and help facilities are considered as the design model is refined. This phase serves as the foundation for the implementation phase.

  2. Interface construction and implementation: The implementation activity begins with the creation of a prototype (model) that enables usage scenarios to be evaluated. As the iterative design process continues a User Interface toolkit that allows the creation of windows, menus, device interaction, error messages, commands, and many other elements of an interactive environment can be used for completing the construction of an interface.

  3. Interface Validation: This phase focuses on testing the interface. The interface should be in such a way that it should be able to perform tasks correctly and it should be able to handle a variety of tasks. It should achieve all the user’s requirements. It should be easy to use and easy to learn. Users should accept the interface as a useful one in their work.

Golden Rules:

The following are the golden rules stated by Theo Mandel that must be followed during the design of the interface.

Place the user in control:
  • Define the interaction modes in such a way that does not force the user into unnecessary or undesired actions: The user should be able to easily enter and exit the mode with little or no effort.

  • Provide for flexible interaction: Different people will use different interaction mechanisms, some might use keyboard commands, some might use a mouse, some might use the touch screen, etc. Hence all interaction mechanisms should be provided.

  • Allow user interaction to be interruptible and undoable: When a user is doing a sequence of actions the user must be able to interrupt the sequence to do some other work without losing the work that had been done. The user should also be able to do undo operations.

  • Streamline interaction as skill level advances and allow the interaction to be customized: Advanced or highly skilled users should be provided with a chance to customize the interface as the user wants which allows different interaction mechanisms so that the user doesn’t feel bored while using the same interaction mechanism.

  • Hide technical internals from casual users: The user should not be aware of the internal technical details of the system. He should interact with the interface just to do his work.

  • Design for direct interaction with objects that appear on the screen: The user should be able to use the objects and manipulate the objects that are present on the screen to perform a necessary task. By this, the user feels easy to control over the screen.

sketch Article's
29 articles in total
Favicon
Mastering the craft: Top UI/UX Design Tools for 2024
Favicon
Unleash Your Creativity with Online Drawing Tools
Favicon
Figma vs. Sketch – Which Design Tool is Right for You?
Favicon
Aplicaciones para Desarrollador UX πŸ§πŸ»β€β™€οΈ
Favicon
Automating Sketch with GitHub Actions
Favicon
Font Awesome fonts to Sketch.app by category
Favicon
Sketch-icons makes it simple to import icons
Favicon
What Is Sketchpad and How Does It Work?
Favicon
What Does the Term "Sketchpad" Mean?
Favicon
The importance of UI/UX | Software Engineering
Favicon
How I Created These Generative Underline Pen Strokes
Favicon
Figma and Sketch: any relation to the development?
Favicon
How I handoff designs to developers with Sketch y Zeplin
Favicon
Draw your application sketch with Inkscape
Favicon
UI Component Source Files (.sketch)
Favicon
Is it possible to build plugins for multiple design tools with a single code base?
Favicon
How to select Best Sketch to HTML Conversion Company?
Favicon
A Lightweight React Library for creating clickable Prototypes
Favicon
Generate Angular code with Infragistics Indigo.Design
Favicon
UI/UX Tools for Beginners: Designing and Prototyping in Sketch
Favicon
Sketch symbol folder frustrations
Favicon
How to Convert Sketch design to UI with Angular/React framework
Favicon
Sketch Data Table Components
Favicon
Sketch Units Plugin 2.0.0-rc.1 available
Favicon
Lorem Ipsum Generator plugin for Sketch
Favicon
30 day of Sketch: the playbook and basics
Favicon
Sketch Template for Prototyping Semantic UI
Favicon
Help From WordPress Developers To Convert Sketch File To WordPress
Favicon
A single source of truth: the future of design systems

Featured ones: