Build Design Systems With Penpot Components
Jul 21, 2:15 AM
Penpot's new component system for building scalable design systems, emphasizing designer-developer collaboration.
smashingmagazine.com
uxdesign.cc – User Experience Design — Medium | Adam Leon
In the final 5 weeks of their 15 week term, students from both of the classes I teach at Humber College (Emerging Design Trends & Advanced Interface Design) are focused on their lengthy final assignments. Each week that passes before their assignment submissions they must meet a critical milestone. Each step, from concept to completion, mirrors the design thinking process and workflow processes that they will experience in the wild after graduating. Within this article I have assembled some extra thoughts for them to chew on as they dig deeper into their work. Some of these reiterate concepts discussed in class and some take those concepts further. Anyone interested in UI/UX will find these resources useful.
Content Is Still King
As with all of the following resources, there are more than a few actionable nuggets of gold in the following article. Beautifully sculpted titles like “Why most A/B tests give you bullshit results” are a critical goal for every content developer. This one stood out for several reasons. Among them, the title promotes a position that appears to be condemning a proven method of identifying performance for design. Reading through, you’ll see that author Justin Megahan is advocating for better execution of a practice that is already industry standard.
“Take the time to construct meaningful A/B tests and you’ll get meaningful results.”
Titles are not just about dodging or aiming for clickbait. They communicate the value of the content within and convey the tone of the article’s voice. Well written titles & headlines reflect strong storytelling, refined content development, and effective SEO. Good content has more value and is more likely to be shared.
Back to Basics
Gestalt laws and basic interactive usability, as advocated by the NNG and Steve Krug, are two groups of fundamental principles that I push on my students and strive for in my own daily work. These foundational concepts can help us build applications that are both usable and beautiful.
In the early days of the skeuomorphic vs. flat design transition there was a lot of excitement and no small amount of jumping in head-first. Notice that in today’s UI aesthetic it is the wise designer who allows depth and texture to exist in the right places. Button depth, form inputs, etc.
The problem is that in the push for simplicity, flat UIs may have gone too far.
With its roots deep in minimalist design, Flat UI design intends to allow content to be unimpeded by navigation elements. When employing any design treatment we should be sure that in doing so, we don’t destroy the fundamental language of elements intended for interaction. We can then work to balance that with delight, a key characteristic of usability.
Jessica Enders notes how flat UI can kill forms:
The three biggest ways flat forms fail
* Lack of affordance (affordance is how much the design of an object — physical or digital — suggests use, like a chair inviting you to sit)
* Insufficient distinction between form elements (e.g., fields versus labels versus instructions versus buttons)
* Insufficient hierarchy within categories of form elements (e.g., primary versus secondary buttons)
Flat UI and Forms, published near the end of 2013, serves clear examples of problems that users face when designers forget why they are designing an element within interface.
http://ift.tt/1amPCo0 Three possibilities for input design, only one removes any confusion about what to do next.
Invisible Design
When you examine the most successful interaction designs of recent years, the clear winners are those who execute fundamentals flawlessly, like Gmail’s autosave function and Uber’s credit card entry form. They feed off natural human behavior, then quietly remove barriers without us ever noticing.
Carrie Cousins wrote A Practical Guide To Invisible Design. It walks the talk. With digestible chunks of actionable wisdom, this article underscores the designer’s role in anticipating expectations and facilitating user goals.
Invisible design is a perfect term for the principles described here. It puts the user’s perspective into the language of the principle being described. Invisible design is only invisible to the end user — the designer must work with all the pieces to create the illusion of invisible design.
Cousins advocates for clear behaviour guidance for users on long scrolling sites. Who is the intended audience for the example website? To the users who instinctively scroll we might ask “does the down arrow add unnecessary clutter?”. For everyone else that arrow ensures immediate understanding, eliminates cognitive load (What can I do here?), and says to the user in a soothing voice — “Follow me, I will show you the way.”
Shallow Design
Students of the Advanced Interface Design class this term are working on interfaces for an Internet of Things project. Here is a deep case study that shows the application of conceptual interaction models in specific context.
Immersive hierarchy
Shallow hierarchy
Shallow interaction design focuses on getting technology out of the way in order to support positive social interactions, like paying attention to the people and environment around you.
Vs.
Immersive design patterns and features promote deeper engagement between the human and the technological interface and user experience.
The lengthy article summarizes;
“…we suggest that designers carefully consider the goals of their users and stakeholders (no different from any user-centered design effort) to determine in advance whether shallow interaction would better support the project’s goals.”
As with everything else in the interaction designer’s ever-expanding toolkit, the specific goals and audience of individual projects should inform how design fundamentals are applied.
Like the prospectors of gold-rush days we often have to sift through huge amounts of surface to get to the truly valuable material.
Want more gold? Like & share the wealth!
15 Nuggets of Gold for the Emerging Interface Designer was originally published in uxdesign.cc – User Experience Design on Medium, where people are continuing the conversation by highlighting and responding to this story.
