Product Design Digest November 2018

    The digest collects fresh articles on interface design, as well as tools, patterns, cases 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-October 2018 .


    Patterns and best practices


    Design for security


    The dichotomy between usability and security is one of the oldest in the profession, and often loses one or the other. Serena Chen describes ways to help find a balance - how to make the safest option the most convenient, so that you want to follow it.



    Building the perfect splash screen


    Gorilla Arm's Duncan Campbell examines the best practices of splash screens when launching applications. Sensible tips for different situations, to reduce the actual or perceived waiting load.



    The User Experience of Chatbots


    Raluca Budiu talks about user research bots from the Nielsen / Norman Group. Excellent description of typical scenarios and frequent problems.



    Design Guidelines for Input Steppers


    Yuxuan (Tammy) Zhou from the Nielsen / Norman Group describes the principles of using input fields with incremental values.

    Five Mistakes in Designing Mobile Push Notifications


    Tips from the Alita Joyce of the Nielsen / Norman Group on how to work with notifications on mobile. How to properly adjust their frequency and time of sending.

    Wishlist or shopping cart? Saving products for later in ecommerce


    The Lielbheimer page of the Nielsen / Norman Group describes several ways to store goods in an online store for the future and helps you choose the best one.

    Design systems and guidelines


    Efficient Consistency with the Mosaic Design System


    Benjamin Martin's powerful story from TeleTracking about how their design system assembles components and templates in Sketch from tokens. The article is an excellent diagram of the assembly sequence with the mention of all the necessary tools.



    Master Product Design at Scale


    Brad Frost, Dan Mall and Josh Clark prepared a series of educational videos on design systems for InVision. Announcement .


    Redesigning your website and website for dark mode


    Apparently, the dark themes will become a hit next year. Andy Clarke shows how to maintain it on the site through media queries.



    How we document components and patterns in the GOV.UK Design System


    Amy Hupe from GOV.UK tells how the team describes the components and patterns in the design system.

    Palx


    Color palette generator. You are his main color, he is your auxiliary.

    Microsoft Fluent Design


    Jon Friedman from the MS Office team talks about working on new application icons . This is one of the most powerful examples of how to express a visual language - they are cool with Fluent Design System, which is based on 3D materials, acrylic and clay-rendering.



    Understanding the user


    We are Colorblind - for the colorblind


    An intelligent resource for optimizing interfaces for people with color perception disorders (300 million people in the world). Cases, articles, tools.



    UX Research Findings Using the Jobs to Be Done Framework


    J. Henry McKeen of The Home Depot talks about the atlas of Jobs to Be Done. It helps to analyze key components - drivers, current behavior, pain points and success criteria.

    Deep immersion in jtbd


    Video series by Mikhail Rudenko from the Bureau of Service Design , describing the basics of the Jobs to Be Done method. Part 2 and 3 . They also published a checklist for job descriptions .




    Information architecture, conceptual design, content strategy


    Describe the task as a story


    Ksenia Ilinykh from Kontur talks about the format of transferring the interface specification to developers in the form of a storyboard.

    Build Customer Journey Map


    Stanislav Khrustalev from Hard Client described a valid reminder for creating a customer journey map. The company’s blog contains many other excellent materials on the subject of service design:

    Feedback collection methods .
    The introduction of improvements .
    Building loyalty programs .



    Design and design of interface screens


    Bondlayer


    New design tool and development. You can get the code for the web or Android / iOS (and even publish in app stores).



    Figma


    Dylan Field reviewed the major updates for the year . The speed of development of the tool, of course, is fantastic.
    Read also Tom Johnson tooling tips .

    Framer


    We received another $ 24 million investment in the series B .

    InVision Studio 1.0


    Common component libraries, improved interface and performance. UI Kit for iOS and Android .



    Atomic


    The tool closes . The team plans to do a more general tool for product development.

    Adobe XD



    Sketch


    Plugins


    • Timelapse : allows you to record a screencast of work on the layout.
    • Anima : controls the indents of nested characters.
    • Felipe : allows you to turn primitive shapes into Sketch symbols. Announcement from the author .
    • VK Data : allows you to insert various data from the profile of VKontakte: avatars of friends, communities, video covers.

    Leeflets


    Hooray! Another one-page designer.

    Grid studio


    Stop. One more!

    Drawkit


    Patterns of illustrations in the spirit of Slack.



    Avocode


    Now also shows a bunch of screens loaded as a prototype .

    Squoosh


    Service to optimize images from Google.

    Meta Tags


    The service helps to quickly try on the site’s meta tags and how the link is displayed in Google, Facebook, Twitter, LinkedIn, Pinterest and Slack.



    Hadron


    The tool added a separate set of features for developers , so that they can work together with the designer on one project.

    Readymag


    Announced a beta version of the breakdown of long pages into sections . This will simplify the change of content in the middle (you do not have to move and recheck what is below).

    Iterate


    Taras Brizitsky makes his tool for designing interfaces on the iPad. Recently appeared beta . An earlier announcement describing the original idea .


    Falafel + AIC


    AIC made a notebook for interface sketches.

    User research and testing, analytics


    Research That Counts


    Duyen Mary Nguyen talks about the quantitative research methods that Facebook uses.

    The Methods UX Professionals Use (2018)


    Jeff Sauro conducted a regular survey among UX-specialists on the topic of user research methods they used. The article statistics for 2018.

    Scoping User Research


    Memo Jim Ross on determining the amount of work in conducting user research. How many and what respondents to look for, what tasks to include, how to build logistics, in what form to analyze and present the results.

    Visual programming and browser design


    New scripts



    Experimenting with brain-computer interfaces in JavaScript


    Charlie Gerard learned to manage sites in a browser through a brain-computer device using JavaScript.

    FE webdev on iPad Pro (2018)


    Craig Morey tried the iPad Pro as a web development tool. For serious work, it is not suitable, no matter how Apple has sold the future.

    Metrics and ROI


    Do Detractors Really Say Bad Things about a Company?


    NPS, like any other method, has its own characteristics and limitations, as well as critics who have not read the books, but must speak out. Jeff Sauro repeated the experiment of the author of the metric Fred Reichheld and showed the distribution of ratings and willingness to recommend a product. Spoiler: almost everything works as promised.

    Design Management


    Implementing UX Strategy 2.0 or DesignOps


    My presentation is about our fresh approach to long-term planning for design changes in the company. At the beginning of the year, we launched a fresh version of the approach, through which we systematically improve product design and introduce new methods of work. At the heart of it is the classic pyramid of strategic planning, from vision and mission to concrete steps based on OKR (Objectives & Key Results).



    Design value indices for business


    Understanding the value of design for business helps both parties. I collected several indexes trying to calculate interopedoobrazion: McKinsey Design Index, Design Value Index; Forrester reports for IBM, British Design Council and the Finnish design market. The article discusses whether they can be trusted.



    How to disassemble the interface debt, №1


    Debt is a card, technical, organizational and interface. For the first, you can suffer personally and physically, for the rest - to grab problems like a grocery company. Design debt is intentionally or unintentionally accumulated usability problems, the solution of which is postponed until future versions. As a result, users suffer, and they, though patient, eventually jump off and never return. There are several examples of a systems approach: Nielsen / Norman Group, Truven Health, Athena Health, Salesforce, Optimizely.



    Progression pack


    A tool for assessing the competencies of designers and their development. It is divided into three categories - universal, professional and leadership skills.



    progression.fyi - A collection of open source frameworks for helping designers and engineers to grow at work


    Jonny Burch has assembled a collection of competency cards for designers and developers from different companies.



    Interview with Stephen Olmstead VP Product Design Strategy at InVision


    InVision's Stephen Olmstead talks about how the design team works in the company. In total, the organization has 750 distributed employees, of whom about 30 are engaged in design.

    Design Leaders are Business Leaders


    Atlassian's Alastair Simpson describes the main points of his speech at Leading Design 2018. He says that designers have long had a place at the key decision-making table, but are afraid to take full advantage of it. In addition, self-conceit in the spirit of “we are the only ones who know about users” makes it difficult to realize that there are many such roles in the modern product team and they are no less valuable.

    Playback on Design Thinking - Not Just For Designers


    IBM's Kelly Churchill continues the story of how design thinking helped front-end developers. They measure NPS with people in companies that work with new developers, and it has grown thanks to the proposed improvements.

    Increase your design influence by understanding your organization's decision-making style


    Dani Nordin from athenahealth shows you how to incorporate decision-making style in an organization. She gives advice to design teams for each of the four.

    About food culture Facebook. Inside view


    Oleg Yakubenkov worked on Facebook and talked about the company's product culture.

    Microsoft CEO Satya Nadella on innovation and organizational change


    Interview of the head of Microsoft Satya Nadella about changes in the culture and organization of the company, which were needed for a new breakthrough. It is more than noticeable - at the end of November, their capitalization overtook Apple . The article is not about the design, but about the importance of restructuring the organization for a new breakthrough, which in the case of Microsoft affected the interfaces.

    Intranet Design After a Merger or Acquisition


    Memo Kara Pernice from Nielsen / Norman Group on the integration of companies' intranets after their merger. The problem is not that frequent, but the situation is complex and the analysis is quite detailed.

    Team interaction


    Cleverstack


    The service helps to conduct online brainstorming - to write down ideas and vote for them in order to choose the most suitable ones.



    Methodologies, procedures, standards


    How concept sprints can improve customer-experience innovation


    McKinsey took the design sprint methodology and renamed concept sprints to their approach. There are few differences, except that the binding to business objectives and ROI calculation from implementation are spelled out more clearly.

    Cases


    What We're Working On: Facebook


    MetaLab's Jordan Amblin explains how they made the concept of presenting videos in a Facebook mobile app.

    Trends


    Market statistics (Quarter III 2018)


    growth of sales of smart watches in the world - 67%

    Samsung Infinity Flex


    Samsung has long shown the technology of flexible screens, and in early November, showed the concept of the phone. In the spring there will be a commercial model. It seems that an interesting movement will finally begin in mobile interfaces, where everything has become too predictable.


    Android will support this feature soon.

    Announced just support for We foldables for AT #AndroidDevSummit , a new The form factor coming next year from All Android partners.

    Android apps run seamlessly: pic.twitter.com/NAfOmCOY26
    - Android Developers ( AndroidDev ) November 7, 2018

    In addition, they announced a new interface shell One UI . Interestingly, they divided the screen into top (content) and bottom (controls).



    Algorithmic design


    Apple's New Maps


    In one of the past issues, there was a story about how Google uses algorithmic design approaches and highlights a lot of useful information from satellite images and street panoramas . It seems that Apple solves this problem manually.

    Generating custom photo-realistic faces using AI


    An experimental generator of realistic photos of people from Shaobo Guan. You can choose gender, age, race and other details.


    Chinese news agency adds AI anchors to its broadcast team


    Chinese news agency Xinhua launched two algorithmic presenters. Their voice, facial expression and lip movement are synthesized.


    Voice Interfaces


    Voice assistants show steep growth - at the end of the year, 75 million units sold worldwide are forecast (detailed statistics below). China will soon overtake the United States, and in Russia a hot season is planned - Mail.Ru Group will be added to Yandex and Google. In order not to stand aside, it's time for designers to download the muscle of voice interfaces.

    Amazon's share of sales - 31.9%

    29.4% of sales accounted for China

    annual sales forecast - 75M

    on smartphones in the US - 90M

    in columns in the US - 46M

    50,000 skills from Alexa in the US , few

    Siri reviews on smartphones in the US - 44%

    Siri on smartphones in the world - 31%

    Google Assistant on smartphones in the world - 51%

    Voice principles


    Ben Sauer has compiled for Clearleft a collection of voice interface design principles from various companies. In addition to them - books, articles and general thoughts.

    Voice User Interfaces (VUI) - The Ultimate Designer's Guide


    A useful guide to designing voice interfaces from Justin Baker from Intuit. Device type selection, usage scenarios and contexts, technological constraints, and key interaction points.

    Mediocre usability of smart assistants: a study of users of Alexa, Google Assistant and Siri


    Translation of the very first part of the study from the Nielsen / Norman Group.

    How To Use Voice UI Prototyping for Delightful User Experiences


    Prototyping voice interfaces from Cathy Pearl from Google, Cassidy Williams from Amazon, Susse Sønderby Jense from Adobe XD, Ben Sauer from Clearleft.

    Aimylogic


    Online chat chat bots and skills for voice assistants Google Assistant and Yandex Alice.

    For general and professional development


    Why are tech companies making custom typefaces?


    Arun Venkatesan examines the reasons why companies create their own fonts. Recently there are more and more of them, despite the fact that this is not always expressed in a characteristic result - many of them are very similar.

    Conference proceedings


    All videos from Dribbble Meetup, UX-Environment and other Mail.Ru Design events on YouTube and VKontakte


    We hold a lot of conferences and meetings for designers, and most of them are recorded on video. Since 2011, a hundred and fifty records of speeches and panel discussions about interface design, graphic design, user research, and other professional fields have accumulated. Finally collected them on a single channel on YouTube and VK.



    DesignOps Summit 2018 Report


    Got to a relatively recent conference on design management of digital products DesignOps Summit (it is the second year). It turned out very well - one of the most useful, which he visited. It is powerful that they were able to gain as much highly specialized content for two days - almost all the performances were either good or cool (just a few dummies). There are already presentations and reports from Natalie Hanson. Organizers promise to post a video.


    Subscribe to a digest on Facebook , VKontakte , Telegram or by mail - there fresh links appear every week. Thanks to everyone who shares the links in the group, especially Gennady Dragun, Pavel Skripkin, Dmitry Podluzhny, Anton Artyomov, Denis Efremov, Alexey Kopylov, Taras Brizitsky, Yevgeny Sokolov and Anton Oleynik.

    Also popular now: