UI Design / Patterns

Written by Cody Lindley

The Front-End Developer Roadmap from Frontend Masters - Advance your skills with in-depth, modern front-end engineering courses.


Overview:

Learning resources and tools.


Definitions:

Humanโ€“Computer Interaction
Humanโ€“computer interaction (HCI) researches the design and use of computer technology, focusing particularly on the interfaces between people (users) and computers. Researchers in the field of HCI both observe the ways in which humans interact with computers and design technologies that lets humans interact with computers in novel ways.
Interaction Design Pattern
User Experience Design (UXD or UED or XD) is the process of enhancing user satisfaction by improving the usability, accessibility, and pleasure provided in the interaction between the user and the product. User experience design encompasses traditional humanโ€“computer interaction (HCI) design, and extends it by addressing all aspects of a product or service as perceived by users.
User Interface Design
User interface design (UI) or user interface engineering is the design of user interfaces for machines and software, such as computers, home appliances, mobile devices, and other electronic devices, with the focus on maximizing the user experience. The goal of user interface design is to make the user's interaction as simple and efficient as possible, in terms of accomplishing user goals (user-centered design).

Contribute content, suggestions, and fixes on github:

https://github.com/FrontendMasters/learning-roadmap


Tools

Design Applications

  • Sketch ๐Ÿ†“ ๐Ÿ’ต
  • Figma ๐Ÿ†“ ๐Ÿ’ต

Wireframe Applications

Diagram Applications