In today’s creative and technical web environment, the terms 'UID' (User Interface Design) and 'UXD' (User Experience Design) are being used more than ever. Most of the designers and developers have a open doubt about the difference between UI and UX. Even some will be assuming that both UI and UX are same terms. But in short,
The term UI means the actual buttons, text, and pixels that appear on the screen. So the UI designer would be responsible for everything about how a web site or application appears in the interface - this would include visuals as well as overall architecture of the page. In shorter, UI is everything that shows up on the screen: the images, text, diagrams, and widgets as well as their color, size, and positioning. For example,
1.) Are the buttons blue or red?
2.) Do they have gradients or are they flat?
3.) What background color can be used?
4.) What is the border color and thickness that can be used for box shapes?
5.) Is box-shadow required for the side widget?
etc..
UX is next or higher-level discipline than UI, because it includes not just the design interface, but also all the systems and interactions that support it. UX is an overall experience and interaction with design. And also how end user feel easier towards the design. UX is much more comprehensive than UI. It’s the entire experience a user has when they use your product. For example,
1.) Where to place social media buttons in the header?
2.) Is sticky header menu is necessary for this page?
3.) What font-size to be used in website?
4.) What standard of colors can be used for fonts?
5.) What is the delay time used in animation effects?
etc..
User Experience Design - how the user thinks and feels
Information Architecture - how the system is organized
User Interface Design - how the content is organized
Interaction Design - how the user and device act and react
Visual Design - how it looks
To be more clear and perfect, the examples of UI and UX are shared below:
1.) Take restaurant as a example. The utensils, plate, table and chair. That's User Interface (which can contribute to experience). The food served, service and ambiance. That's User Experience.
2.) We can take Ketchup bottle as one more example. Initially, a company manufactured their ketchup in a slim bottle with narrow neck at the top and with small opening holes. The bottle was strong and user can slightly tilt down the bottle to pour ketchup in his food. When the bottle was about to empty, user need to shake / tilt the bottle 270 deg for ketchup. Also, It is not easy for keeping the bottle upside down (in the refrigerator).
Here the bottle design and narrow edge at top is UI. But uncomfortability of using bottle in fridge and tilting 270 deg is the 'poor' UX. But later, bottle was designed stronger with broad top with bigger cap. Now everything became easier for end user. This is called UX.
Source: udacity, careerfoundry, quora
UI != UX
The term UI means the actual buttons, text, and pixels that appear on the screen. So the UI designer would be responsible for everything about how a web site or application appears in the interface - this would include visuals as well as overall architecture of the page. In shorter, UI is everything that shows up on the screen: the images, text, diagrams, and widgets as well as their color, size, and positioning. For example,
1.) Are the buttons blue or red?
2.) Do they have gradients or are they flat?
3.) What background color can be used?
4.) What is the border color and thickness that can be used for box shapes?
5.) Is box-shadow required for the side widget?
etc..
UX is next or higher-level discipline than UI, because it includes not just the design interface, but also all the systems and interactions that support it. UX is an overall experience and interaction with design. And also how end user feel easier towards the design. UX is much more comprehensive than UI. It’s the entire experience a user has when they use your product. For example,
1.) Where to place social media buttons in the header?
2.) Is sticky header menu is necessary for this page?
3.) What font-size to be used in website?
4.) What standard of colors can be used for fonts?
5.) What is the delay time used in animation effects?
etc..
"User Experience (UX) and User Interface (UI) are some of the most confused and misused terms in our field. A UI without UX is like a painter slapping paint onto canvas without thought; while UX without UI is like the frame of a sculpture with no paper mache on it. A great product experience starts with UX followed by UI. Both are essential for the product’s success.” - Rahul VarshneyThere are some basic concepts which are called as 'Umberlla Effect'.
User Experience Design - how the user thinks and feels
Information Architecture - how the system is organized
User Interface Design - how the content is organized
Interaction Design - how the user and device act and react
Visual Design - how it looks
To be more clear and perfect, the examples of UI and UX are shared below:
1.) Take restaurant as a example. The utensils, plate, table and chair. That's User Interface (which can contribute to experience). The food served, service and ambiance. That's User Experience.
2.) We can take Ketchup bottle as one more example. Initially, a company manufactured their ketchup in a slim bottle with narrow neck at the top and with small opening holes. The bottle was strong and user can slightly tilt down the bottle to pour ketchup in his food. When the bottle was about to empty, user need to shake / tilt the bottle 270 deg for ketchup. Also, It is not easy for keeping the bottle upside down (in the refrigerator).
Here the bottle design and narrow edge at top is UI. But uncomfortability of using bottle in fridge and tilting 270 deg is the 'poor' UX. But later, bottle was designed stronger with broad top with bigger cap. Now everything became easier for end user. This is called UX.
Source: udacity, careerfoundry, quora
No comments:
Post a Comment
Thanks for your comments. It'll be published after admin's approval !