Issue 24: What is *@©™®†‡§¶❦☜?

Fundamental principles of interface design; How neural networks help artists; How to make a good mobile navigation and way more!

Issue 24: What is *@©™®†‡§¶❦☜?

Hello, dear readers! 👋

In this issue, among other things:

  • Fundamental principles of interface design
  • How neural networks help artists
  • How to make a good mobile navigation
  • Why is a joint brainstorm not effective
  • How to properly issue error messages
  • How to make beautiful gradients using CSS
  • Recommendations on how to create effective and intuitive visualizations
  • Quotes from "User Friendly: How the Hidden Rules of Design Are Changing the Way We Live, Work, and Play" book by Robert Fabricant's & Cliff Kuang

Enjoy reading!

📌 This is worth noting

Collection of posters of the famous advertising campaign of the XX century: Volkswagen Beetle

📚 Book quotes

Today I'm suggesting you quotes from Robert Fabricant's &  Cliff Kuang's book "User Friendly: How the Hidden Rules of Design Are Changing the Way We Live, Work, and Play":

Whether we’re communicating with a human or a machine, the goal is to create a shared understanding of the world. That’s the point behind both the rules governing polite conversation and how a user-friendly machine should work.

Perhaps you’re reading this book with your phone by your side, checking your email whenever your attention drifts, tapping text messages to a friend. You sit at the end of a long line of inventions that might never have existed but for people with disabilities: the keyboard on your phone, the telecommunications lines it connects with, the inner workings of email. In 1808, Pellegrino Turri built the first typewriter so that his blind lover, Countess Carolina Fantoni da Fivizzano, could write letters more legibly. In 1872, Alexander Graham Bell invented the telephone to support his work helping the deaf. And in 1972, Vint Cerf programmed the first email protocols for the nascent internet. He believed fervently in the power of electronic letters, because electronic messaging was the best way to communicate with his wife, who was deaf, while he was at work.

You have to know why people behave as they do—and design around their foibles and limitations, rather than some ideal.

The most important problems to solve were those that weren’t being expressed. The most important questions to ask were those that people never thought to ask themselves.

Design is the silent salesman-Henry Dreyfuss

Simple as it sounds, that bit of information means the difference between feeling like you’re taking a ride, and feeling like you’ve been taken hostage.

Being polite means following a conversation, not co-opting it and dragging it in other directions. It means knowing who you’re talking with, and knowing what they know. It’s rude to talk over people, to misunderstand who they are. Those maxims happen to neatly map to the same design principles laid out by Don Norman, and the ones that guided Brian Lathrop in the creation of Audi’s self-driving A7.

User Friendly: How The Hidden Rules Of Design Are Changing The Way We Live, Work, And Play
<p><b>AMAZON BEST BOOKS OF 2019 PICK</b><br><br><b><i>FORTUNE </i>WRITERS AND EDITORS’ RECOMMENDED BOOKS OF 2019 PICK</b><br><br>”<i>User</i><i> Friendly </i>is a tour de force, an engrossing fusion of scholarly research, professional experience and revelations from intrepid firsthand reporting.”<br…

🗞 News and articles

Article by Bruce Tognazzini on the first principles of designing workable interfaces, which was published in 2003.

Part of the principles from the article:

  • Maintain a balance between full user independence and excessive restrictions
  • Inform the user of the current status of operations to reduce the voltage. This information should always be in sight
  • Supplement the color indication with additional hints so that people with color blindness can read the information
  • The controls should clearly tell the user that they can be used, while the elements that work differently should be visually different
  • Evaluate not only the speed of the interface, but also the time it takes the user to complete the task
  • Error messages and hints should accurately describe the problem. This will help save time
  • In the names of menu items and buttons, the keyword must go first. For example: not "Insert Page Break", but "Page Break"First, give the user the opportunity to solve the problem in a simple way. Open additional functions for those who need them
  • If the application is created for beginners, it should guide the user
  • Allow to cancel any action. This will allow the user to explore the interface safely
  • Consider Fitts' law, which states that the accuracy of hitting a target is inversely proportional to the distance to the target and squared to its size. Also, the fastest available targets on any monitor are the four corners of the screen
  • Use multithreading wherever possible so that the user can continue working while the calculations are going on
  • Make sure that users don't lose their data if they make a mistake
  • Workable interfaces are visually clear, forgive mistakes and give their users a sense of manageability. Users briefly look around the scope of opportunities, understand how to achieve their goals and work.

Workable interfaces do not initiate the user into the inner workings of the system. The result of labor is carefully and continuously preserved, and the user is free to cancel any action at any time.

Workable applications and services perform maximum work, requesting a minimum of information from the user.

First Principles of Interaction Design (Revised & Expanded)
The following principles are fundamental to the design and implementation of effective interfaces, whether for traditional GUI environments, the web, mobile devices, wearables, or Internet-connecte…

Drag & Drop UX Design Best Practices

Ceara Crawshaw has published detailed tips on how to properly implement the drag-and-drop function in the interface, and analyzed them with real examples. She writes about how to understand that the drag and drop function is needed, what it can be and to which elements it can be applied, as well as how to improve feedback and what nuances need to be taken into account in different types of applications.

Drag & Drop UX Design Best Practices - Pencil & Paper
A comprehensive guide on drag and drop UI/UX design, including pattern UX examples and UI demos.

Make Beautiful Gradients

Josh Cameau tells how to make beautiful gradients in CSS. A nice gradient generator is attached.

Make Beautiful Gradients
Have you ever noticed that gradients tend to look a little gray and washed-out in the middle? This happens because of a mathematical quirk with RGB colors. Fortunately, we can work around this quirk, and create beautiful, lush, saturated gradients.
CSS Gradient Generator
Friendly tutorials for developers. Focus on React, CSS, Animation, and more!

The Science of Visual Data Communication: What Works

A voluminous scientific article telling us what we currently know about how data visualization works. In other words, these are science-based recommendations on how to create effective and intuitive visualizations.

Manual: *@©™®†‡§¶❦☜

Article on is suggesting us about how to correctly place asterisks, crosses, paragraphs and other typographic symbols.

Manual: *@©™®†‡§¶❦☜

⚡️ Briefly

What «Work» Looks Like. Jim Nielsen writes about why the best ideas often do not come during work, and why joint brainstorming is not always effective.

What “Work” Looks Like
Writing about the big beautiful mess that is making things for the world wide web.

This post is for paying subscribers only

Already have an account? Sign in.

Subscribe to

Don’t miss out on the latest issues. Sign up now to get access to the library of members-only issues.