October 8, 2015 at 15:22Food Design Digest, September 2015
For five years now I have been publishing regular reviews of fresh articles on the topic of interfaces, new tools and collections of patterns, interesting cases and historical stories. From the tapes of several hundred thematic subscriptions, approximately 5% of the publications worth publishing are selected, which are interesting to share. Previous materials: April 2010-August 2015 .
vc.ru: We announce the hunt for interface cases from Russia.
In early September, Zuckerberg Calls, now called vc.ru , restarted . I became one of the curators of the “Interfaces” column - together with Filipp Konzarenko and Anton Frolov. Since last year, my digest has been published on the site, and even earlier I gave comments on some of the translations. Now the cooperation will be more systematic. We have made an interesting content plan that will help to make the already demanded source of Russian-language content on interfaces one of the best. Within six months, it should materialize. Among the tasks:
Recently, Vladislav Golovach put forward a cool initiative to motivate Russian-language authors of articles on design . The topic is really painful - a lot of interesting things are happening in our market, but little is written about it. So the profession looks extremely poor in this regard, when compared with English-language publications. How so ?!
In general, if you have good cases, a desire to write a memo on working with one of the new tools for designers, well, or a good-quality column with your own thoughts on an unfinished topic - write to us . Template for case studies and tool reviews .
Motion and interface design - Continuity and expectation
Issara Willenskomer's good message is that the animation in the product must be consistent, to which it brings the theoretical basis for its theses.
How to fix a bad user interface
One of the best articles on the empty state interface by Scott Hurff. He divides them into five stages - no data, loading, little information, error, perfect condition. Type Sizes for Every Device Steven Hoober describes the optimal font sizes for different devices depending on the screen size and user position. At the end of the article is a useful summary table. How to display threaded discussions on the web
The Rian van der Merwe blog compares different approaches to displaying comments in branch discussions. Pros, cons, pitfalls. Product List Usability - Avoid 'Quick View' Overlays Baymard Institute's New Intermediate Popup Study with Online Product Information. This is bad practice, because users perceive them as the main product card, although there is very little information. Form Usability - 5 Requirements for Slider Interfaces Christian Holst of the Baymard Institute describes the problem areas of the sliders. They have a lot of problems and are not always useful. The article gives recommendations on the competent implementation of this control element. Continuing the topic:
Presentation of content in the form of cards
Work with notifications
Spatial Interfaces
Pasquale D'Silva very interesting reflection on Russian about how to present a map of interaction with a product in the form of a multidimensional space. This space can be either simple, two-dimensional, or more complex. If there is a clear model, then it will be much easier for the user to work with the application. He gives successful examples and complete mess, which for some reason is famous for music services.
The Visual Storyteller's Guide to Web UI Design
A new book from UXPin on how to convey a visual message using pictures, video, interaction, styles, using examples from Tesla, FitBit, Microsoft and Squarespace.
Smart tv
Apple iOS 9
September 9 shows the final version of iOS 9. Starting with iOS 7, I go with beta versions of OSes on the phone. This time, the changes turned out to be small and in many ways strange - two searches (pulling down and to the left of the first screen), multitasking mode with the worst comfort for a wheelbarrow, clumsy solution with a return to the previous application in the status panel. Unless the stability of work, it seems, began to improve. It turned out that the most interesting thing was waiting for the announcement of force touch and taptic engine
- all major interface changes relate to them. A whole package of solutions has been added to the OS, greatly reducing and simplifying application scenarios: quick actions from the home screen and pop-ups for displaying key information without switching to the application. This is very, very cool, makes the phone an even more powerful tool and gives a bunch of opportunities to designers. Tomorrow morning we will discuss how to use it in our applications.
Another thing is that most of the shown for many years was called “long tap” and does not require additional technologies. Except that the context menu in the icon on the main screen (now long-tap calls up the settings mode) and calling multitasking with a swipe with effort from the left edge of the screen - but the affordance of this gesture is not better than the classic solution with double-clicking the Home button. Yes, and long-tap itself (aka 3D touch - Samsung couldn’t do without marketers) suffers from a lack of affordance (iOS apologists blamed it, seeing the solution in Android and WinPhone). Well, the quick photo view on Instagram shown is completely meaningless - this is an additional way in the interface that does not give any value regarding the transition to a separate screen. In addition, all these operations with 3D touch often require the use of both hands. Although in any case, the gesture is still unusual and you need to watch it live. Surely he will give a bunch of interesting opportunities for games.
We laughed separately about the mail mode a la Tinder - the topic constantly popped up in working discussions, but only in the banter format (though they had a super-like announced on the same day , so there’s room for improvement ). In fact, now any application can implement this interface solution to itself. Already gone concepts on Dribbble .
Useful materials:
Apple TV Human Interface Guidelines
A new version of Apple TV is shown, the operating system of which is called tvOS. Guidelines are already available for her. The interface has become modern, in the spirit of iOS and MacOS, a remote control with gestures in the spirit of Nintendo Wii and a touch surface has been added to the control capabilities. It works without a cursor; at the point of pointing, an element on the screen increases with an interesting parallax effect . Another interesting thing is the two actions described at the remote control - “touch” and “click” . It also recommends skipping intro to games and videos by user action. Other materials:
Apple watch
The US Digital Services Playbook
Soon, the entire US state Internet will become one, as the government officially publishes an alpha version of the design standards. Announcement of guidelines with an eyeliner about the problems . Material design
Android Wear
iPad
Designing Safer Web Animation For Motion Sensitivity
Val Head raises a fairly new issue - accessibility for front-end animation. A certain percentage of people suffer from motion sickness and for them modern products, stuffed with sophisticated transitions, are not very comfortable. She discusses specific problems and suggests even thinking about a single button to turn off the animation on the site. Why Performance Matters - The Perception Of Time Denis Mishunov talks about the budget for optimizing performance for web services. It is very interesting how he calculates the optimal download time for the service, taking into account the perception and condition of competitors. Investigation of the physical limitations of users when working with a tablet
My colleague Ksenia Sternina shares the results of the latest usability research. She studied physical limitations when working with the tablet. According to the results of the study, it was possible to create a map of comfortable areas for the iPad Air 2.
Accessibility
Microsoft Inclusive Design Toolkit
Microsoft's barrier-free design guide for people with disabilities. A 20 minute film about him.
Content Strategy A Guide for UX Designers
Another GatherContent book (fourth) about working with content, this time with a focus on designers. It is rather a set of good practices, but, due to the rarity of sensible materials on working with content, it should be interesting to many. Chaos Method of Requirements Prioritisation Gennady Dragun describes the reverse chaos method - a simple and effective way to prioritize requirements.
http://www.slideshare.net/Hienadz.Drahun/chaos-method-of-requirements-prioritisation
Customer Journey Map
Audience-Based Navigation - 5 Reasons to Avoid It
Katie Sherwin writes about navigation issues, which are divided into groups of the target audience. Most implementations cause users to get lost in trying to understand which group they belong to, and also have problems with incorrect expectations.
Axure RP 8 Beta is Now Available
In August, the opportunity appeared to put a beta version of Axure RP 8. The link is a complete list of innovations, and the product blog itself tells in detail about each of them . Frontify - Collaboration for Web Designers and Front-End Developers The product has recently been reborn, now it is a powerful tool for creating guidelines. Very very cool!
Invision
Sympli
A tool for transferring design from designers to developers. Its main difference from existing solutions is that it supports several graphical editors (Photoshop and Sketch). And for developers, in addition to the web application, extensions for the IDE (Android Studio and Xcode) are provided, which can save time on pulling the design on the application. The project is currently in beta and free, after the release it will continue to remain free for a limited number of projects. Atomic - Interface design software for professionals
Beta is completed, the project is officially launched. Compared to Invision / Marvel, there are vector layers for which you can manually prescribe CSS (hi rounded corners, aha) and finer animation settings. Of the minuses - there is not even a vertical scroll, which limits the work with many layouts of mobile applications, plus resources must be added independently, there is no auto-parsing or plugins.
Creating interactive application mockups using Mockup.io
Mockup.io is an online platform for creating and presenting prototypes of mobile applications with the ability to test on real devices (iOS and Android). Allows you to work with prototypes for iOS and Android devices, Apple Watch, as well as for devices with custom (customizable) screen sizes.
Vectr
To the heap of design tools: Vectr, a browser-based vector editor. Sites, printing, etc.
Principle
Sketch
Comparison of prototyping tools
Zeplin
Readymag
10 Best Practices For Competitive UX Benchmarking
Pack of Jeff Sauro Benchmarking Tests.
Polls
New Mr Tappy - A filming rig for mobile and tablet usability testing
New version of Mr.Tappy - mounts for testing mobile devices.
Presumptive Design - Design Provocations for Innovation
Excerpt from Leo Frishberg and Charles Lambdin's book Presumptive Design: Design Provocations for Innovation . Part 1, definition of the term.
Live guidelines and component systems
Xcode и Swift для дизайнеров
Framer
Новые скрипты
Работа с SVG
Flexbox
Веб-типографика
UX-стратегия
Дизайн-культура
Метрики и ROI
A list of creative exercises for creative teams
Foursquare's Jon Steinback describes a weekly practice among designers and other company employees when every Friday they solve a non-standard task or try another creative experiment. He gives a bunch of examples of exercises. UX and CX - Maximize the Value of Your User Experience Team Tandem Seven's blog describes approaches to linking UX and CX initiatives. Including the intersection between these different faces of the same task. Prevent Feature Creep and Bad Product Requests A simple one-page page from Intercom for product managers and designers that teaches you to answer “no” to requests that break the product.
UX-Environment AMA: Redesign of Russian Post
In September, we launched the first AMA (ask me anything) from UX-Environment and vc.ru - Ruslan Lobachev (project manager, Tsentsiper) and Sergey Surganov (art director, Medusa, formerly Tsentsiper, who worked on the new Russian Post website. The company is undergoing large-scale changes and the site is just the top of the restructuring of internal processes, without which it is impossible to give out a good service. You need to think about the whole ecosystem. Therefore, the experience of the guys is especially interesting.
We wanted to launch the AMA format at the end of last year, but there wasn’t enough time, and then it appeared with Creative Russia and Roem.ru, so in a simple form it no longer made sense. But the thematic format is not yet well-worn, so let's try it in practice. We thank Sergey and Ruslan for the detailed answers, and our readers on Facebook for interesting questions. Authors of the questions: Nadezhda Shpiyakina, Sergey Aleshin, Yana Moskvina, Anatoly Batareikin, Ivan Prishvin, Denis Shumov, Olga Oreshkova, Natalya Kharzu, Vladislav Kovalev from Wonderfull.
World map design
Andrey Karmatsky opened his Urbica Design studio after leaving Yandex.Maps. Their first project was a map redesign of the Maps.me application. The article has many interesting details of the process.
Games Mechanics in Apps - An Interview with Courtney Christopher of Swarm
Chatting with Courtney Christopher, Swarm's lead designer, about working on a new game mechanic for the app. After splitting Foursquare into two products, most of the iconic chips disappeared, but recently the team completely rethought the service and turned it into a real game. The Making Of FiftyThree's Beloved Paper App For The iPhone A smart case study on the new Paper app for iPhone. Why FiftyThree did not start porting the well-known iPad version, but rethought it from scratch. Other cases
Telephone Keypad Design
Another article on this landmark 60-year-old usability test. How Bell Labs chose the optimal button layout on the phone. Translation into Russian .
Subtraction.com Design Tools Survey
Khoi Vinh recently conducted a survey among designers about the tools used. According to its outcome, he published a report with conclusions on various categories. 4000 people from 196 countries participated. He recently moved to Adobe, so that all this will be taken into account in the development of the company's products.
Design Machines
UX Fox translated into Russian one of the best materials of the month from Travis Gertz. He says that modern design on the web has turned into a dull monotony and looks at the reasons for this clone dominance. And then he offers a way out - where to look and where to move in order to break the deadlock. Very inspiring, and the decor is great. Continuing the topic:
Trends 2015
UX-Marathon 2015: Yuri Vetrov - Product Design Digest
For the online conference, “ UX-Marathon ” tried to make a digest in presentation format. Gathered the most interesting news for the last couple of months. I don’t know if this makes sense and demand, but I checked the “try the presentation” checkbox :) By the way, Sergey Andronov has been doing his digest in this format since last year .
The course "Design of human-computer systems" at ITMO (St. Petersburg)
On September 1, a group of master students started classes at the ITMO University on the program "Design of human-computer systems", which is dedicated to the design of interfaces and interaction with users. Over the course of two years, they will have to acquire and deepen their skills in project management methodology, analytics, design, psychology, graphic design and programming. In addition to lectures, students are waiting for practical exercises, projects, studies in a well-equipped usability laboratory. The UXSPb community works closely with students and teachers of the department so that training is closely connected with practicing specialists and real-life companies.
PS In two years, employers will be able to safely write in the job descriptions of designers and interface designers - “specialized higher education” and there are such people :)
Online courses
Jokes for designers for 400
Interns
UX Hero
Tal Florentin's second edition of the UX Hero comic is released, dedicated to the life of mythical food designer Jonathan Sketch. UX Fox - newsletter for interface designers Yaroslav Birzul restarted the translation site for UX Fox articles as a newsletter. Each week, subscribers receive an exclusive translation of a cool article, a set of free useful materials, references for inspiration and several links for professional leveling. Death to Bullshit Brad Frost launched the new Death to Bullshit blog based on its presentation . He collects examples of bad design practices and how the industry fights them. Detox for facebook
The funniest among browser plugins to make reading designer resources easier. Detox replaces Facebook feed with materials from Designer News, Dribbble, Behance, Awwwards, Smashing Magazine and other sites. Created by the famous Panda plugin team.
Andrei Herasimchuk - Twenty Years in the Valley
Andrei Herasimchuk, Adobe's first UX designer, writes a series of articles about his 20 years of work. A very cool series of materials from a person who stood at the origins of the profession. First issues:
Cooper and Cooper U, Part 1
Масштабная серия статей о Cooper U, большой инициативе компании Cooper Consulting по дизайн-образованию. Интервью с Tereza Brazen, заведующей программами обучения, а также разбор курсов.
Покупки дизайн-студий крупными компаниями
John Maeda Interview
A short but meaningful interview with John Maeda after the workshop at the HackMIT hackathon. By the way, he combined his mini-sites under one umbrella .
AMA Sessions
OFFF RUSSIA 2015
On October 10 and 11, ICR brings the OFFF international festival to Russia for the second time. It is held annually in Barcelona and in countries around the world. OFFF is known in the domestic professional community - whole delegations from Russian-speaking countries regularly leave for the main event in Barcelona. Designers work on a variety of types of tasks in different environments, and this conference manages to make a good cut of all this diversity - how to make unusual and fresh decisions in interfaces, promotional and marketing things, and the real world. Last year it was held in St. Petersburg, this time at the office of Mail.Ru Group. IDEO, AKQA, Joshua Davis, StinkDigital, MUCHO will arrive. On the second day, master classes from Burton Rast from IDEO and Joshua Davis will be held. By the way, Burton gave
interview for Look at Me. and participated in the AMA .
UX STRAT 2015
Presentations from the UXSTRAT 2015 conference , which took place on September 8-10 in Athens, Georgia (USA). It is dedicated to design strategies and gathers a powerful line-up of thematic speakers.
Fresh links can also be tracked in the same Facebook group . Thanks to everyone who also publishes links in it, especially Gennady Dragun, Pavel Skripkin, Dmitry Podluzhny, Anton Artemov, Denis Efremov, Alexei Kopylov, Taras Brizitsky and Evgeny Sokolov. More and more materials appear in reviews thanks to them.
A letter arrives once a month.
Topic " Interfaces " on vc.ru
vc.ru: We announce the hunt for interface cases from Russia.
In early September, Zuckerberg Calls, now called vc.ru , restarted . I became one of the curators of the “Interfaces” column - together with Filipp Konzarenko and Anton Frolov. Since last year, my digest has been published on the site, and even earlier I gave comments on some of the translations. Now the cooperation will be more systematic. We have made an interesting content plan that will help to make the already demanded source of Russian-language content on interfaces one of the best. Within six months, it should materialize. Among the tasks:
- Publish interesting domestic cases. We made a template for them , allowing us to make an intelligent story. It's just that studio step-by-step descriptions of layouts are not good, you need a description of business problems and how the redesign solved them.
- Write reviews of domestic and western tools for designers ( structure ). The first material based on it about the Ukrainian service Mockup.io was released . There is still a pack on the way.
- Establish transfer of all 20 articles that fall into the squeeze from the digest for vc.ru . Of course, you need to know English in order to have access to all modern journalism. But translations make life easier for many.
- Question and Answer Sessions (AMA) with domestic designers. The first experience with the team of the Censiper company, which was redesigning the Russian Post, has recently ended ( article-interview based on it ). We will continue.
Recently, Vladislav Golovach put forward a cool initiative to motivate Russian-language authors of articles on design . The topic is really painful - a lot of interesting things are happening in our market, but little is written about it. So the profession looks extremely poor in this regard, when compared with English-language publications. How so ?!
In general, if you have good cases, a desire to write a memo on working with one of the new tools for designers, well, or a good-quality column with your own thoughts on an unfinished topic - write to us . Template for case studies and tool reviews .
Patterns and Best Practices
Motion and interface design - Continuity and expectation
Issara Willenskomer's good message is that the animation in the product must be consistent, to which it brings the theoretical basis for its theses.
How to fix a bad user interface
One of the best articles on the empty state interface by Scott Hurff. He divides them into five stages - no data, loading, little information, error, perfect condition. Type Sizes for Every Device Steven Hoober describes the optimal font sizes for different devices depending on the screen size and user position. At the end of the article is a useful summary table. How to display threaded discussions on the web
The Rian van der Merwe blog compares different approaches to displaying comments in branch discussions. Pros, cons, pitfalls. Product List Usability - Avoid 'Quick View' Overlays Baymard Institute's New Intermediate Popup Study with Online Product Information. This is bad practice, because users perceive them as the main product card, although there is very little information. Form Usability - 5 Requirements for Slider Interfaces Christian Holst of the Baymard Institute describes the problem areas of the sliders. They have a lot of problems and are not always useful. The article gives recommendations on the competent implementation of this control element. Continuing the topic:
Presentation of content in the form of cards
- Samantha Zhang on working on the Graphiq product . They structured the format for issuing information in cards; at the end of the article, useful developments on the topic.
Work with notifications
- The new Basecamp introduces the "work will wait" mode (do not disturb) . And in general, he thinks about how to separate work and personal life.
Spatial Interfaces
Pasquale D'Silva very interesting reflection on Russian about how to present a map of interaction with a product in the form of a multidimensional space. This space can be either simple, two-dimensional, or more complex. If there is a clear model, then it will be much easier for the user to work with the application. He gives successful examples and complete mess, which for some reason is famous for music services.
The Visual Storyteller's Guide to Web UI Design
A new book from UXPin on how to convey a visual message using pictures, video, interaction, styles, using examples from Tesla, FitBit, Microsoft and Squarespace.
Smart tv
Guidelines for platforms and companies
Apple iOS 9
September 9 shows the final version of iOS 9. Starting with iOS 7, I go with beta versions of OSes on the phone. This time, the changes turned out to be small and in many ways strange - two searches (pulling down and to the left of the first screen), multitasking mode with the worst comfort for a wheelbarrow, clumsy solution with a return to the previous application in the status panel. Unless the stability of work, it seems, began to improve. It turned out that the most interesting thing was waiting for the announcement of force touch and taptic engine
- all major interface changes relate to them. A whole package of solutions has been added to the OS, greatly reducing and simplifying application scenarios: quick actions from the home screen and pop-ups for displaying key information without switching to the application. This is very, very cool, makes the phone an even more powerful tool and gives a bunch of opportunities to designers. Tomorrow morning we will discuss how to use it in our applications.
Another thing is that most of the shown for many years was called “long tap” and does not require additional technologies. Except that the context menu in the icon on the main screen (now long-tap calls up the settings mode) and calling multitasking with a swipe with effort from the left edge of the screen - but the affordance of this gesture is not better than the classic solution with double-clicking the Home button. Yes, and long-tap itself (aka 3D touch - Samsung couldn’t do without marketers) suffers from a lack of affordance (iOS apologists blamed it, seeing the solution in Android and WinPhone). Well, the quick photo view on Instagram shown is completely meaningless - this is an additional way in the interface that does not give any value regarding the transition to a separate screen. In addition, all these operations with 3D touch often require the use of both hands. Although in any case, the gesture is still unusual and you need to watch it live. Surely he will give a bunch of interesting opportunities for games.
We laughed separately about the mail mode a la Tinder - the topic constantly popped up in working discussions, but only in the banter format (though they had a super-like announced on the same day , so there’s room for improvement ). In fact, now any application can implement this interface solution to itself. Already gone concepts on Dribbble .
Useful materials:
- Meng To's UI Kit for Sketch with 3D touch .
- I put in two cents for vc.ru .
- Luke Wroblewski has put together the coolest comparison chart of input methods across the entire line of Apple devices . The smartphone is the most advanced.
- Analysis of the implementation of the bottom panel in well-known applications for the iPhone . How much they correspond to guidelines and in general are qualitatively implemented.
- Analysis of the nuances of the font San Francisco on different devices and resolutions .
- UI Kit for Photoshop by Oz Pinhas, adapted to 3 types of screens (iPhone 5, 6, 6+) .
Apple TV Human Interface Guidelines
A new version of Apple TV is shown, the operating system of which is called tvOS. Guidelines are already available for her. The interface has become modern, in the spirit of iOS and MacOS, a remote control with gestures in the spirit of Nintendo Wii and a touch surface has been added to the control capabilities. It works without a cursor; at the point of pointing, an element on the screen increases with an interesting parallax effect . Another interesting thing is the two actions described at the remote control - “touch” and “click” . It also recommends skipping intro to games and videos by user action. Other materials:
- The first UI kit for Sketch . And one more
- Ben Markowitz experimentally collected the parallax effect on the web icon .
- The effect of parallax caught many designers, scripts rained down on all sides . Version of Designmodo.
- A detailed analysis of transformations in the effect with formulas from Nash Vail .
Apple watch
- Guidelines for watchOS have been updated . Including animation.
- Translation of an article by Luke Wroblewski with his interface logic concept .
The US Digital Services Playbook
Soon, the entire US state Internet will become one, as the government officially publishes an alpha version of the design standards. Announcement of guidelines with an eyeliner about the problems . Material design
- August update of material design guidelines . In particular, how to ask permission to use the phone functions in a new form.
- Google launched a competition to design the best domestic application in the spirit of material . Promising and just material prizes.
Android Wear
iPad
User understanding
Designing Safer Web Animation For Motion Sensitivity
Val Head raises a fairly new issue - accessibility for front-end animation. A certain percentage of people suffer from motion sickness and for them modern products, stuffed with sophisticated transitions, are not very comfortable. She discusses specific problems and suggests even thinking about a single button to turn off the animation on the site. Why Performance Matters - The Perception Of Time Denis Mishunov talks about the budget for optimizing performance for web services. It is very interesting how he calculates the optimal download time for the service, taking into account the perception and condition of competitors. Investigation of the physical limitations of users when working with a tablet
My colleague Ksenia Sternina shares the results of the latest usability research. She studied physical limitations when working with the tablet. According to the results of the study, it was possible to create a map of comfortable areas for the iPad Air 2.
Accessibility
- Katie Sherwin of NN / g on the use of mobile touch devices by visually impaired users .
- Yahoo, Facebook, Dropbox and LinkedIn will give preference to candidates who can optimize their work for accessibility .
- Tips from the Medium team on CSS issues that violate accessibility .
- Recommendations from an accessibility expert for the blind .
- Anthony T advises to modify the elements of forms for people with a violation of color perception .
Microsoft Inclusive Design Toolkit
Microsoft's barrier-free design guide for people with disabilities. A 20 minute film about him.
Information architecture, conceptual design, content strategy
Content Strategy A Guide for UX Designers
Another GatherContent book (fourth) about working with content, this time with a focus on designers. It is rather a set of good practices, but, due to the rarity of sensible materials on working with content, it should be interesting to many. Chaos Method of Requirements Prioritisation Gennady Dragun describes the reverse chaos method - a simple and effective way to prioritize requirements.
Customer Journey Map
- Very sensible material from Livework studio on how to analyze customer experience . Many interesting customer journey map diagrams for different slices.
- Materials from the Jim Kalbach Experience Mapping workshop at UXSTRAT 2015 .
Audience-Based Navigation - 5 Reasons to Avoid It
Katie Sherwin writes about navigation issues, which are divided into groups of the target audience. Most implementations cause users to get lost in trying to understand which group they belong to, and also have problems with incorrect expectations.
Design and design of interface screens
Axure RP 8 Beta is Now Available
In August, the opportunity appeared to put a beta version of Axure RP 8. The link is a complete list of innovations, and the product blog itself tells in detail about each of them . Frontify - Collaboration for Web Designers and Front-End Developers The product has recently been reborn, now it is a powerful tool for creating guidelines. Very very cool!
Invision
- InVision has launched a beta version of the new Insight feature . It simplifies the interaction between designers and developers.
- A single tool for working with correspondence around projects will soon be launched .
- It seems that soon InVision can be added to the number of sensible animation tools - the Motion function will greatly improve these features of the product .
Sympli
A tool for transferring design from designers to developers. Its main difference from existing solutions is that it supports several graphical editors (Photoshop and Sketch). And for developers, in addition to the web application, extensions for the IDE (Android Studio and Xcode) are provided, which can save time on pulling the design on the application. The project is currently in beta and free, after the release it will continue to remain free for a limited number of projects. Atomic - Interface design software for professionals
Beta is completed, the project is officially launched. Compared to Invision / Marvel, there are vector layers for which you can manually prescribe CSS (hi rounded corners, aha) and finer animation settings. Of the minuses - there is not even a vertical scroll, which limits the work with many layouts of mobile applications, plus resources must be added independently, there is no auto-parsing or plugins.
Creating interactive application mockups using Mockup.io
Mockup.io is an online platform for creating and presenting prototypes of mobile applications with the ability to test on real devices (iOS and Android). Allows you to work with prototypes for iOS and Android devices, Apple Watch, as well as for devices with custom (customizable) screen sizes.
Vectr
To the heap of design tools: Vectr, a browser-based vector editor. Sites, printing, etc.
Principle
- The Mirror app for viewing prototypes on iOS passed Apple's test . Because of this, it is available later than the announcement of the tool itself.
Sketch
- Plugin for using icon fonts .
- Simplification of the work with the choice of colors .
- Plugin for searching and replacing text in layers .
- The plugin creates an HTML page with a specification of layouts .
Comparison of prototyping tools
Zeplin
- Now you can publish design guidelines on the Internet . In addition, Zeplin now connects to Slack.
Readymag
User research and testing, analytics
10 Best Practices For Competitive UX Benchmarking
Pack of Jeff Sauro Benchmarking Tests.
Polls
- Erica Hall on the design of questionnaires .
- Response article by Jeff Sauro to Erika Hall . It describes the tasks that polls do well.
New Mr Tappy - A filming rig for mobile and tablet usability testing
New version of Mr.Tappy - mounts for testing mobile devices.
Presumptive Design - Design Provocations for Innovation
Excerpt from Leo Frishberg and Charles Lambdin's book Presumptive Design: Design Provocations for Innovation . Part 1, definition of the term.
Visual programming and design in the browser
Live guidelines and component systems
- Stef. Sullivan Rewis talks about the history of Salesforce Lightning . The company already had a live guideline, but it lacked the systematic nature of all the processes of working inside and interacting with partners. Interestingly, they see Lightning in many ways as an “interface” for working with external designers.
- Мои коллеги из команды бек-энда описали кусочек своей части решения для «бургерного дизайна». Ребята из фронт-енда начали рассказывать о своей половине.
Xcode и Swift для дизайнеров
- Дизайнер Linda Dong учится работе со Swift. Она запустила сайт с экспериментами и исходным кодом на GitHub.
Framer
- Плагин для Sketch, который позволяет сравнительно легко создавать анимированные прототипы во Framer на основе макетов.
- Приложение Frames для просмотра прототипов на iPhone.
Новые скрипты
- Несколько способов того, как скрыть длинное меню под «еще».
- Простой скрипт для проверки доступности тех или иных возможностей HTML, CSS, JS, SVG и т.п. в текущем браузере, используя данные известного сайта Can I Use.
- Скрипт обрабатывает запросы на естественном языке, в которых указываются даты, ссылки, телефоны, адреса почты, физические адреса. Способен выдрать их из куска обычного текста.
- Еще одно решение фотогалереи на JavaScript, легкое и адаптивное, по словам авторов.
- Экспериментальная навигация в духе зумируемого интерфейса.
- Как сделать эффект расходящихся кругов а-ля Material design с помощью SVG.
- Сайт Stylesheets.io собирает новые CSS-скрипты и обучалки.
- Не скрипт, но безумно крутая демонстрация их возможностей. Разные виды физических частиц с реакцией на действия пользователя.
- Эластичный индикатор прогресса на SVG+JS.
Работа с SVG
- Небольшая инструкция Chris Youderian по работе с картами в SVG.
- Heydon Pickering описывает подход к анимации в SVG, аналогичный полупрозрачным пленкам, которые используют мультипликаторы. Создается несколько наслаиваемых частей изображения, которые могут двигаться самостоятельно для создания целостной анимации.
Flexbox
- Обзорная статья Patrick Brosset о CSS Grid Layout — альтернативе flexbox, которая прорабатывается W3C. В соседнем материале Rachel Andrews приводит пару замысловатых примеров компоновки с его использованием (из материалов сайта Grid by Example).
Веб-типографика
UX-стратегия и менеджмент
UX-стратегия
- Очень толковая статья Jon Innes с историей роста интереса к явлению.
- Толковые советы по перестройке дизайна в ПО для корпоративного рынка от Anton Baturan.
Дизайн-культура
- Как устроена дизайн-команда сервиса Optimizely.
- Jim Ross о том, когда компании нужен генералист, а когда — специалист.
- Как устроена дизайн-команда TED.
- Толковая колонка Aaron Walter из Mailchimp о том, почему он старается нанимать людей, а не навыки.
- Игровая компания Halfbrick, выпускающая известную игру Fruit Ninja, отказалась от роли дизайнера в команде. Они считают, что навыками дизайна должен обладать каждый участник команды, это критически важно для успеха игры. Мнения игроделов.
- Простая и очень здравая колонка Cap Watkins о том, как строить культуру взаимодействия между менеджером продукта, дизайнером и разработчиком.
Метрики и ROI
- Jeff Sauro перечисляет 10 метрик для расчета ROI дизайна вместе со способами их расчета.
- Jeff Sauro о том, как оценить LTV/CLV для продукта, даже если нет реальных данных.
A list of creative exercises for creative teams
Foursquare's Jon Steinback describes a weekly practice among designers and other company employees when every Friday they solve a non-standard task or try another creative experiment. He gives a bunch of examples of exercises. UX and CX - Maximize the Value of Your User Experience Team Tandem Seven's blog describes approaches to linking UX and CX initiatives. Including the intersection between these different faces of the same task. Prevent Feature Creep and Bad Product Requests A simple one-page page from Intercom for product managers and designers that teaches you to answer “no” to requests that break the product.
Cases
UX-Environment AMA: Redesign of Russian Post
In September, we launched the first AMA (ask me anything) from UX-Environment and vc.ru - Ruslan Lobachev (project manager, Tsentsiper) and Sergey Surganov (art director, Medusa, formerly Tsentsiper, who worked on the new Russian Post website. The company is undergoing large-scale changes and the site is just the top of the restructuring of internal processes, without which it is impossible to give out a good service. You need to think about the whole ecosystem. Therefore, the experience of the guys is especially interesting.
We wanted to launch the AMA format at the end of last year, but there wasn’t enough time, and then it appeared with Creative Russia and Roem.ru, so in a simple form it no longer made sense. But the thematic format is not yet well-worn, so let's try it in practice. We thank Sergey and Ruslan for the detailed answers, and our readers on Facebook for interesting questions. Authors of the questions: Nadezhda Shpiyakina, Sergey Aleshin, Yana Moskvina, Anatoly Batareikin, Ivan Prishvin, Denis Shumov, Olga Oreshkova, Natalya Kharzu, Vladislav Kovalev from Wonderfull.
World map design
Andrey Karmatsky opened his Urbica Design studio after leaving Yandex.Maps. Their first project was a map redesign of the Maps.me application. The article has many interesting details of the process.
Games Mechanics in Apps - An Interview with Courtney Christopher of Swarm
Chatting with Courtney Christopher, Swarm's lead designer, about working on a new game mechanic for the app. After splitting Foursquare into two products, most of the iconic chips disappeared, but recently the team completely rethought the service and turned it into a real game. The Making Of FiftyThree's Beloved Paper App For The iPhone A smart case study on the new Paper app for iPhone. Why FiftyThree did not start porting the well-known iPad version, but rethought it from scratch. Other cases
- Frankie Gaw on the Facebook Mentions app case study .
- A small case about remaking a section of a mobile application for Android with a more explicit access to the photo gallery . There are useful numbers on how and how it worked.
- Translation into Russian of Denis Nevozhaia’s chic case on working on the Alcatel One Touch Watch smartwatch interface .
History
Telephone Keypad Design
Another article on this landmark 60-year-old usability test. How Bell Labs chose the optimal button layout on the phone. Translation into Russian .
Trends
Subtraction.com Design Tools Survey
Khoi Vinh recently conducted a survey among designers about the tools used. According to its outcome, he published a report with conclusions on various categories. 4000 people from 196 countries participated. He recently moved to Adobe, so that all this will be taken into account in the development of the company's products.
Design Machines
UX Fox translated into Russian one of the best materials of the month from Travis Gertz. He says that modern design on the web has turned into a dull monotony and looks at the reasons for this clone dominance. And then he offers a way out - where to look and where to move in order to break the deadlock. Very inspiring, and the decor is great. Continuing the topic:
- Material on the theme from The Next Web . Not so systematic, of course, but there are a couple of practical thoughts.
Trends 2015
For general and professional development
UX-Marathon 2015: Yuri Vetrov - Product Design Digest
For the online conference, “ UX-Marathon ” tried to make a digest in presentation format. Gathered the most interesting news for the last couple of months. I don’t know if this makes sense and demand, but I checked the “try the presentation” checkbox :) By the way, Sergey Andronov has been doing his digest in this format since last year .
The course "Design of human-computer systems" at ITMO (St. Petersburg)
On September 1, a group of master students started classes at the ITMO University on the program "Design of human-computer systems", which is dedicated to the design of interfaces and interaction with users. Over the course of two years, they will have to acquire and deepen their skills in project management methodology, analytics, design, psychology, graphic design and programming. In addition to lectures, students are waiting for practical exercises, projects, studies in a well-equipped usability laboratory. The UXSPb community works closely with students and teachers of the department so that training is closely connected with practicing specialists and real-life companies.
PS In two years, employers will be able to safely write in the job descriptions of designers and interface designers - “specialized higher education” and there are such people :)
Online courses
- It seems that online courses for designers will now be added to an infinite number of InVision initiatives. The first one is led by Scott Hurff of Tinder.
- Designlab, another online course . In addition to just materials, they promise to give interesting tasks and a mentor to help.
Jokes for designers for 400
- In addition to the statement that designers should be able to typeset, a website has been launched with a selection of all the things that a designer should do .
Interns
- Andrew Hwang gives advice to trainees in a company interview . Useful for anyone trying to get settled without experience.
UX Hero
Tal Florentin's second edition of the UX Hero comic is released, dedicated to the life of mythical food designer Jonathan Sketch. UX Fox - newsletter for interface designers Yaroslav Birzul restarted the translation site for UX Fox articles as a newsletter. Each week, subscribers receive an exclusive translation of a cool article, a set of free useful materials, references for inspiration and several links for professional leveling. Death to Bullshit Brad Frost launched the new Death to Bullshit blog based on its presentation . He collects examples of bad design practices and how the industry fights them. Detox for facebook
The funniest among browser plugins to make reading designer resources easier. Detox replaces Facebook feed with materials from Designer News, Dribbble, Behance, Awwwards, Smashing Magazine and other sites. Created by the famous Panda plugin team.
People and companies in the industry
Andrei Herasimchuk - Twenty Years in the Valley
Andrei Herasimchuk, Adobe's first UX designer, writes a series of articles about his 20 years of work. A very cool series of materials from a person who stood at the origins of the profession. First issues:
- In the first article, he talks about the first day of work at Adobe (Adobe, 1994).
- One of the biggest mistakes in 20 years (Adobe, 1995).
- Make it Red. The fact that not only the design itself is important, but also how it is presented (Adobe, 1997).
- О встрече со Стивом Джобсом (Adobe, 1997).
- О конфликте с разработчиком, который вылился в успешную рабочую сессию и живущий до сих пор инструмент трансформации в Photoshop (Adobe, 1995).
Cooper and Cooper U, Part 1
Масштабная серия статей о Cooper U, большой инициативе компании Cooper Consulting по дизайн-образованию. Интервью с Tereza Brazen, заведующей программами обучения, а также разбор курсов.
Покупки дизайн-студий крупными компаниями
- Cooper пошли против тренда схлопывания самостоятельного бизнеса на дизайне и сами купили студию Catalyst Group. Теперь у них есть офис в Нью-Йорке и расширенная экспертиза.
- Airbnb bought the domestic industrial design studio Lapka . Not quite on the topic of interfaces, but the first such case is from Russia.
- Tenny Pinheiro intelligently describes the problems of design studios in the current moment . A particular irony of the situation is that agencies have long been explaining to the client the importance of design. But as soon as the client understands it and thinks about systematicity, he often opens the internal design department.
John Maeda Interview
A short but meaningful interview with John Maeda after the workshop at the HackMIT hackathon. By the way, he combined his mini-sites under one umbrella .
AMA Sessions
Conference proceedings
OFFF RUSSIA 2015
On October 10 and 11, ICR brings the OFFF international festival to Russia for the second time. It is held annually in Barcelona and in countries around the world. OFFF is known in the domestic professional community - whole delegations from Russian-speaking countries regularly leave for the main event in Barcelona. Designers work on a variety of types of tasks in different environments, and this conference manages to make a good cut of all this diversity - how to make unusual and fresh decisions in interfaces, promotional and marketing things, and the real world. Last year it was held in St. Petersburg, this time at the office of Mail.Ru Group. IDEO, AKQA, Joshua Davis, StinkDigital, MUCHO will arrive. On the second day, master classes from Burton Rast from IDEO and Joshua Davis will be held. By the way, Burton gave
interview for Look at Me. and participated in the AMA .
UX STRAT 2015
Presentations from the UXSTRAT 2015 conference , which took place on September 8-10 in Athens, Georgia (USA). It is dedicated to design strategies and gathers a powerful line-up of thematic speakers.
Fresh links can also be tracked in the same Facebook group . Thanks to everyone who also publishes links in it, especially Gennady Dragun, Pavel Skripkin, Dmitry Podluzhny, Anton Artemov, Denis Efremov, Alexei Kopylov, Taras Brizitsky and Evgeny Sokolov. More and more materials appear in reviews thanks to them.
Subscribe to Newsletter
A letter arrives once a month.