🏽 💆🏽 ⛔️ Food Design Digest, February 2020 🥄 🥖 🚂

The digest has been collecting fresh articles on interface design, as well as tools, patterns, cases, trends and historical stories since 2009. I carefully filter a large stream of subscriptions so that you can upgrade your professional skills and better solve work tasks. Previous issues: April 2010-January 2020 .

Food Design Digest, February 2020

Patterns and best practices

How To Design Mobile Apps For One-Hand Usage

Maitrik Kataria has put together a good collection of front-end patterns for using mobile applications with one hand. He recorded screencasts of good examples and made out many of them.

Drag – and – Drop - How to Design for Ease of Use <

Gorgeous reminder for designing and designing the drag and drop interface from Page Laubheimer of the Nielsen / Norman Group. How to make it good on the web and on mobile.

Livin 'on the edge - how to design for edge cases early in the process

Tridip Thrizu offers its approach to working out interface states. It divides the display methods into permanent and temporary, key and auxiliary.

10 Evil Types of Dark UX Patterns

Skookum's Danny Sapio has compiled 10 commonly used dark patterns.

Executing UX Animations: Duration and Motion Characteristics

Page Laubheimer of the Nielsen / Norman Group gives tips on optimizing animations in interfaces.

How to Film and Photograph for Usability - UX Details for Videos and Images

Aurora Harley of the Nielsen / Norman Group gives tips on how to make instructional videos and photos more comprehensible to users.

Torrey Podmajersky - Strategic Writing for UX

O'Reilly has released Torrey Podmajersky's book Strategic Writing for UX about front-end texts. Review from UXmatters.

By the way, UXmatters and A List Apart published excerpts from another book on the theme: Michael J. Metts and Andy Welfle, “Writing Is Designing”.

Design systems and guidelines

Content Design below the surface

Atlassian's Linette Voller offers a cool model for systematic description of texts in an interface. She uses the idea of layers Jesse James Garrett and lays out all the tools for text communication on it.

Dark theme

Dark Mode vs. Light Mode - Which Is Better?

Raluca Budiu of the Nielsen / Norman Group has compiled calculations from studies on the perception of a dark and light topic. In most cases, a light topic makes reading easier.

Light and dark themed SVG favicon using the CSS prefers-color-scheme media feature

Catalin Red shows how to change the favicon of a site for a dark theme.

Design System Subtasks, by Step

The smartest checklist for working on components (and any other part) of the design system from Nathan Curtis. What stages does it go from a proposal to a rollout with a detailed list of specific steps.

Design System UI is More Expensive Than a Product Team's UI

In the next article, Nathan Curtis shows the difference in labor costs for creating a component from scratch and within a design system. Initially, it is not in favor of the design system, but is compensated later.

How design systems use storybook

Dominic Nguyen has compiled examples of how large design systems use the Storybook.

Design Systems, Agile, and Industrialization

Discussion by Brad Frost, Dave Rupert, and Jeremy Keith about whether design systems kill creativity and whether they are new Taylorism. As elsewhere, balance is needed and any excesses cause rejection.

Navigation for Design Systems and Style Guides

An overview of live navigation guidelines by Danielle Romo.

Microsoft Fluent Design

A new approach to application icons has rolled out at all .

Material design

Updated animation guidelines . In many examples, a visual tool with specifications appeared ( GitHub code ).

User understanding

Information Scent - How Users Decide Where to Go Next

Raluca Budiu of the Nielsen / Norman Group describes the “information flair” theory, which helps users evaluate the potential usefulness of information on websites.

Behavioral Design 2020 and Beyond

A series of interviews with experts in designing user behavior about the current state of the discipline and its prospects.

New Interface Design Tools

Sketch 63

Interface enhancements without explicit focus. And the development of the cloud .

Zeplin 3.0

There was an API and the ability to give a link to a component in the code.

Abstract

We bought the Ukrainian Flawless team .

Figma Config 2020

The first official conference. It announced an improved auto-layout (you can specify the behavior of individual elements), an improved selection of colors and fonts, links to any objects and pages within a document (or external in general), support for new control methods in prototypes (keyboards, game joysticks, devices for users disabled). By the way, if you share only the prototype, the layout itself is no longer given away. Video of performances .

Plugins

Dan Hollick described detailed instructions for creating plugins using the example of color contrast analysis.
Maze : The usability testing service is also available for Figma.
Type Today : You can try the font library of the domestic foundry.
Memo Yuan Qing Lim on the competent plug-in interface . How to make it useful and convenient.
Ditto : Facilitates collaboration on texts in the interface.
JSON to Figma : Loading data from JSON.

Articles

Interview with co-founder of Dylan Field , which he gave during his arrival in Russia in the fall of 2019.
AMA with Noah Levin , head of design for Figma.

Flow fields

The tool allows you to make animated streamlines. Similar experiments from Tyler Hobbs .

Tinkersynth

A simple tool for generative abstract images on the synthesizer model.

Open Peeps - Hand-Drawn Illustration Library

Another free illustration library with character designer from industry favorite Pablo Stanley.

Iconset

The tool allows you to store a set of icons and distribute it to popular design tools. There is a version for Windows.

Anicons

Icon font with animation and support for different colors.

User research and testing

Service Monitoring Digest for Online Tests

Usethics Olga Kryukova compared the services for remote usability testing with the assessment of functionality. It is useful that access to the domestic database of respondents was noted.

How to Maximize Insights in User Testing - Stepped User Tasks

Kara Pernice of the Nielsen / Norman Group describes an approach to dividing a usability testing scenario into components that provide different suggestive information. This allows you to check not only the convenience of working with functionality, but also its detectability.

Demystifying the art of giving user research feedback

Shopify's Dalia El-Shimy made an excellent user research reminder with a detailed checklist for each step. This is especially useful for modern product teams, where they are increasingly carried out by designers and product managers.

Three Goals of Usability Testing

Jim Lewis and Jeff Sauro remind us of the three main goals of usability testing: detecting problems, comparing with a specific metric or other interface. The essence of each is well described.

10 Things to Know about the Microsoft Desirability Toolkit

Jim Lewis and Jeff Sauro discuss the features of the Microsoft Desirability Toolkit.

Cultural Effects on Rating Scales

Jeff Sauro studied the influence of different cultures on the distribution of responses in surveys like NPS. His hypothesis: this may affect the bias of answers towards more pronounced or neutral.

Supercharge Your Agile UX Research with Informal Cognitive Walkthroughs

Microsoft's Valentina Strachan talks about agile-based cognitive step-by-step analysis of an interface. This allows you to detect some of the problems in the interface expertly.

The ultimate Notion template to run efficient usability tests

Inês Duvergé has published a usability test memo in Notion. The template itself .

Ten things I've learned as a UX researcher at Uber

UX researcher Minal Jain from Uber tells several life stories from company experience and user understanding.

Design is suitable or not - how to check only the appearance of the product, and not the client experience in general

Elena Borodina talks about testing visual design at Gazprombank. Using a 5-second test, key reactions were collected - how much they corresponded to the initial expectations of the team.

Checking Jobs to Be Done without talking to customers

Sergey Borisyuk from PandaDoc talks about how he identified customer needs for compiling a brand promise from the keywords in product reviews.

5 things UX Researchers can do differently - A reflection after Uber's layoffs

Elsa Ho is analyzing last year's dismissal of half of user researchers at Uber in connection with the reorganization. What conclusions for the process and format of work can be drawn from this (and whether it is necessary if this can be a feature of a particular company).

Visual programming and design in the browser

New scripts

Sarah Fossheim recreated the CSS Polaroid camera illustration .
The effect of particles flying around the object in the photo .
Breakdown of the photo into a spectacular collage .
Pure CSS Background Pattern Generator .
It seems that the most shameful trend of recent years will now definitely be everywhere. Shadow generator for non-morphic elements on the web .
Animation with the movement of text along the path .

Availability

Adam Silver shows how to make an input field with prompts and autocomplete taking into account accessibility requirements for users with disabilities.

Metrics and ROI

8 Manipulations of the Net Promoter Score - Which Ones Matter?

Jeff Sauro and Jim Lewis put together all their mini-research on the features of the use of NPS.

Design Management and DesignOps

Vectorly - Learning and development for product teams

The service allows you to maintain competency maps for a design team. Assessment, goal setting, tracking of real tasks.

Calculating ROI for Design Projects in 4 Steps

A great reminder for Kate Moran from the Nielsen / Norman Group on calculating the ROI design. How to choose suitable metrics and convert them into money.

Defragment your calendar to focus your mind

Tips for organizing a calendar design manager from Mia Blume. How to organize an endless stream of meetings.

How we hire product designers

Monzo's Zander Brade describes the process of hiring designers for a company. Step-by-step instruction.

Monthly leveling for the win

Open Table's Leslie Yang gives tips on how to regularly work on a competency map. How and what kind of meetings to conduct to advance on it.

The craft of leading remote teams

Shopify's Alaine Mackenzie gives tips on managing remote design teams. She notes that complexity depends on the degree of distribution and, oddly enough, the easiest way is with completely dispersed people - then there is no local group that inevitably becomes the core of all activities.

Curate, convene, amplify

Scott Strubberg talks about IBM's internal design knowledge base. There are few details and access is closed, but an interesting example of the categorization of reference information.

Teamwork

UX Workshops vs. Meetings - What's the Difference?

Kate Kaplan of the Nielsen / Norman Group made a memo of the meetings and working sessions that the design team can conduct. It also shows the difference between formats and recommendations for use in typical situations.

Product Management and Analytics

Growth through the creation of new products for the current audience of the company

Oleg Yakubenkov analyzes situations when a large company can grow by creating new products for its current audience.

Cases

How Waymo Uses Design to Create Trust in Self-Driving Cars

Casper Kessels parses the Waymo autonomous car interface that a passenger sees while traveling. Translation .

How to redesign, step by step guide

Taras Bakushevich from Windmill Solutions describes his approach to interface redesign.

How we updated the Yandex.Zen interface in the desktop: design process

Ulyana Salo talks about updating the Yandex.Zen interface. How to optimize the navigation and flow of information.

Invisible Changes

Medium's Sarah Klearman talks about refactoring the page design of an article and refining the design system for it.

A Library to Call Your Own

Raymonst talks about redesigning save functionality to favorites in Medium.

Digital Product Branding

Skyeng

Skyeng rebranding by Shuki. Refresh, add character and support the growing brand architecture. Application to the interface itself, however, is not shown. Case in the portfolio .

Mixcloud

Rebranding the music service Mixcloud from British Output. Good reception with the penetration of a proprietary sound wave in the logo, font, animation and other details. Case in the portfolio .

Eventbrite

Rebranding Eventbrite event calendar from Moving Brands. There are examples of touchdowns on the web, although there is not much character. Case in the portfolio .

Tripadvisor

Rebranding TripAdvisor Travel Guide from New York Mother Design. A good example of simple simplification and refreshment without a strain. Case in the portfolio .

Story

On design thinking

A good analysis of the history of the emergence of design thinking and generally systematic approaches to design from Maggie Gram. And, of course, problems with their marketing, when such a label is applied out of place.

The Xbox dashboard, a visual history

Cameron Faulkner has taken apart the evolution of the interface for all versions of the Xbox.

Trends

2020 Creative Trends - Data-Driven Design Trends

Trends in photography from Shutterstock.

Algorithmic Design

Lingua Franca - A Design Language for Human-Centered AI

Algorithmic Design Language from Standard Notation. Principles, patterns, processes.

Free Logo Maker - Create Your Logo in 5 Minutes

Logo generator from Fiverr. It's funny, because this is exactly the type of inexpensive freelancers that should suffer from algorithmic design.

What Does A Foldable Web Actually Mean?

Frederick O'Brien parses layout features for devices with flexible screens. Do they differ from the usual support for adaptability and what standards and developments already exist.

For general and professional development

Trine Falbe, Martin Michael Frederiksen & Kim Andersen - The Ethical Design Handbook

Smashing Magazine released a new book. It focuses on modern ethics when creating digital products that avoid dark patterns. Overview .

Six exercises to overcome skill plateaus as a designer

Richard Yang gives tips on boosting product designer skills. Exercises, courses, books and the development approach itself.

The most important overlooked design skill

Chris Lee advises designers to learn how to analyze their work and role in the product. This will help to grow better, and make interviews more effective.

People and companies in the industry

Attitude towards product design teams: 2019

In the fall, he launched a study of attitudes towards product design teams in Russia. Finally gathered the results. 1260 people participated - twice as much as in 2018 , although for qualitative results it is even better to take into account (I will take into account in 2020).

In Russia, there are enough strong food companies and teams with powerful designers and strong international products. Many of them help the design community with conferences, meetings, contests, and other useful things.

Such a rating will be useful to the market. Designers should better understand where there are good challenges and a comfortable environment for professional growth. Companies and design teams - see what needs to be downloaded. This will be a useful tool for evaluating investments in an HR brand.

Bonus collectedA list of prominent product design teams with links to their sites, blogs, and design systems. As you can see, this almost completely repeats the rating :) So far, the beta version, but I will actively develop it, will make a good addition to Design Systems Club .

At the same time, he redid the site of the upcoming book on design management . So far, most likely moving to a new platform with a foundation for the future.

PS Special thanks to the design communities that helped gather the answers. First of all - Odi and LOOKING FOR DESIGNER .

Design at Sberbank

The site of the design team of Sberbank.

Larry Tesler, the UI pioneer responsible for cut, copy, and paste, dies at 74

Larry Tesler, one of the key people in the history of modern interfaces, died :(
He worked in the legendary Xerox PARC laboratory, and then in the first golden years of Apple. He proposed the concept of copy & paste while working on an experimental text editor , advocated the rejection of modality in interfaces. He is credited with authorship of the key phrases “user friendly” and “what you see is what you get.” He was one of those who showed the achievements of Xerox PARC to Steve Jobs (and further helped to introduce them into the Macintosh from inside Apple). It seems from this era legends remained only Alan Kay.

Conference proceedings

Design Leadership Summit 2019

The Design Leadership Summit 2019 Design Management Conference was held November 4-5 in Toronto. Speech recordings published.

Facebook, , ― . , , , , , , , , , . .

Food Design Digest, February 2020