Дайджест продуктового дизайну, липень 2015

Вже п'ять років я публікую регулярні огляди свіжих статей з теми інтерфейсів, нових інструментів і колекцій патернів, цікавих кейсів і історичних оповідань. З стрічок кількох сотень тематичних підписок відбирається приблизно 5% стоять публікацій, якими цікаво поділитися. Попередні матеріали: квітень 2010-червень 2015. Ви можете отримувати свіжі огляди поштою.

Дайджест продуктового дизайну, липень 2015

Патерни і Best Practices
Spatial Interfaces
Дуже цікаві роздуми Pasquale D Silva тему того, як представити карту взаємодії з продуктом в вигляді багатовимірного простору. Цей простір може бути як простим, двомірним, так і більш складним. Якщо чітка модель є, то користувачу буде набагато простіше працювати з додатком. Він наводить вдалі приклади і повну кашу, якої чомусь славляться музичні сервіси.
Spatial Interfaces

Dropdowns Should be the UI of Last Resort
Luke Wroblewski рекомендує можливості відмовитися від випадаючих списків у мобільних формах. Вони вимагають більшої кількості натискань, а в випадку з сучасним iOS системний контрол («барабан») ще й вкрай незручний.
Dropdowns Should be the UI of Last Resort

Ad for Placement Mobile
Aurora Bedford з NN/g описує нюанси використання реклами на мобільних. У умови і без того обмеженого простору треба бути втричі акуратним і не дратувати користувачів, не зрушувати початок контенту зовсім вниз і не створювати відчуття кінця сторінки.

The ultimate guide to designing landing pages that convert
Відмінна шпаргалка по лендингам від WebDesignerDepot.

Листи розсилки


Витяги з звіту Baymard Institute


Web UI Design Techniques: Colors & Flat Design
Нова книга від UXPin: флет-дизайн, кольору, палітри і техніки. До речі, Krzysztof Stryjewski, автор книг цієї серії почав публікувати їх на Behance.

Дизайн охорону здоров'я


Гайдлайны платформ та шаблони дизайну для них
Material Design
Material Design Lite

Apple Watch
Redesigning the Apple Watch UI

Розуміння користувача
The Psychology of Pricing: A Gigantic List of Strategies
З'явився російський переклад потужного матеріалу про роботі з цінами, їх відображенням є важливою частиною дизайну для конверсії. Nick Kolenda підготував дуже і дуже крутий огляд психологічних стратегій і дизайнерських методів методів подання цін продуктів.

Проблеми методу персонажів


Схожий ваш червоний на мій червоний?
Альтернативні схеми кольорів або цветоаномалия. Колірна сліпота для чайників. Докладне пояснення механізму колірного сприйняття на російською. Поняття Квалиа і Теорія Розуму в додачу. У продовження теми:


Інформаційна архітектура, концептуальне проектування, контент-стратегія
Багатоканальне взаємодія


Проектування та дизайн екранів інтерфейсу
Pixate + Form = Google
Pixate + Google

Prototyping with iAd Producer
Linda Dong, яка працювала в Apple над інструментами для рекламної системи iAd, показує, як використовувати iAd Producer для прототипування інтерфейсів. Виявляється, він володіє несподівано сильними можливостями для інтерфейсних дизайнерів.



Principle — Visual Prototyping
&Nbsp;від новими інструментами для дизайнера затишшя, але от щодо свіжий   Principle. Деталей поки немає, але обіцяють все те ж, що роблять InVision-подібні інструменти. Один з творців   колишній інженер Apple.

Майбутнє інструментів дизайну


PageCloud
Сервіс PageCloud став одним з хітів недавно минулого TechCrunch Disrupt. Він дозволяє на льоту " редагувати сторінку сайту браузері і зберігати зміни на сервер. Крім того, легко імпортувати макет  ж Photoshop прямо в браузер. Все це непогано показано у відео.

Sketch


Marvel


UXPin


InVision


LucidChart


Інструменти паблишинга


Плагіни до Photoshop


Огляди інструментів прототипування


Користувальницькі дослідження і тестування, аналітика

Analysis isn't Cool
Більшість публікацій і виступів на тему користувальницьких досліджень багато говорять про те, як проводиться робота з користувачами, але не дуже активно розповідає про одному з ключових етапів   аналізу отриманих знань. Jim Ross скаржиться на  описує свій підхід.

5 Things to Know about Likert Scales
Невелика шпаргалка по шкалою Лайкерта від Jeff Sauro.

How To Moderate Effectively In Usability Research
Colleen Roller дає поради модераторам користувальницьких досліджень з тим, щоб мінімально впливати на  результати.

Measuring & Modeling Customer Expectations
Jeff Sauro пропонує метод відстеження і прогнозування користувальницьких очікувань від продукту. Для цього користувачам показується стандартний опитувальник 7-бальною шкалою до і після роботи з інтерфейсом, при цьому краще ділити їх на дві групи, щоб перша оцінка не впливала на другу.

How to statistically test preference data
Jeff Sauro дає рекомендації на тему опитувань щодо кількох варіантів дизайну. Як зрозуміти, що найбільш популярний абсолютним значенням варіант статистично коректно вибирати переможцем.

Візуальне програмування і дизайн у браузері
Живі гайдлайны і компонентні системи
SalesForce Theo

QuartzCode
Додаток QuartzCode допомагає дизайнерам створювати нативний код в Objective C або Swift для анімації в iOS — і Mac-додатках. Вона імпортує графіком SVG, хоча можна створювати векторні зображення та прямо в інструменті.
QuartzCode

Weld — From idea to website in minutes
Інструмент Weld дозволяє створювати адаптивні сайти браузері. Є готовий набір елементів, можна робити анімацію, полегшується хостинг.
Weld — From idea to website in minutes

Framer


Pure UI
Цікаві роздуми Guillermo Rauch про те, що якщо б інтерфейс проектувався як функція, а не конкретне візуальне рішення. Це дозволить дизайнеру і розробнику працювати більш щільно.
PureUI

Protein


Нові скрипти


Робота з SVG


Робота з Flexbox


Робота кольором


Веб-типографіка


Smarter Grids With Sass And Susy
Michelle Barker написав невелике покрокове керівництво по створення адаптивних сіток з допомогою фреймворку Susy на базі Sass. У цій гілці будуть збиратися рішення роботі з сітками в CSS.
Smarter Grids With Sass And Susy

Bootstrap і Foundation


JavaScript для дизайнерів


The W3C Mobile Checker
Альфа-версія інструменту для перевірки мобільних і планшетних сайтів від W3C. Поки що перевірка триває довго, якщо взагалі відпрацьовує, але видає поради щодо поліпшенню дизайну і верстки.

Метрики і ROI
Нові медіа і онлайн-журналістика


Управління інтерфейсними проектами, процесами і командами
Branding and#DesignInTech
Цікава дискусія на тему провязки бренду в інтерфейсі і інших аспектах продукту, яку вели John Maeda, Robert Padbury і Tim McCoy.

Zeplin


Tactical Design Critique
Marcin Wichary розповідає про формалізованому процесі критики дизайну, який використовується у команді Medium. Це невеличкий воркшоп, чимось схожий на добре відомий peer reviews, що дозволяє знайти і описати безліч проблем в інтерфейсі.

Побудова дизайн-культури
  •  те, як працює дизайн-команда GoPro. Цікаво, що щотижня всі співробітники повинні походити пару годин з камерою компанії, щоб краще розуміти як її використовують споживачі.


Кейси
Product Design Unification Case Study, Part 2: «Burger-Driven» Framework
На Smashing Magazine вийшла моя друга стаття про уніфікації дизайну в Mail.Ru Group — ми приводимо до єдиного увазі лінійку контент-проектів з допомогою дизайнерсько-технологічного рішення і бургерного підходу. Це продовження історії з мобільним вебом, яка вийшла навесні.

Уніфікація через «бургерный дизайн»: Фреймворк Mail.Ru Group для контент-проектівЯ вже розповідав про  восени вигляді презентації. Тепер все це вигляді статті, з купою повноформатних ілюстрацій і додаткових деталей. Версія статті на російською.

У минулого року ми перезапустили п'ять сервісів в бургерном дизайні (Афіша, Авто, Здоров'я, Погода, Гороскопи), в цьому вже чотири (Нерухомість, ТБ, Леді, Hi-Tech). Це дичайше цікава і складне завдання, хоча ми поки пройшли тільки перший її етап   належить розвивати платформу продуктово, систематизувати технологічно і чистити візуально.

My Two Years as an Anthropologist on the Photoshop Team
Charles Pearson працює користувальницьким дослідником в команді Photoshop розповідає про своїй роботі.
My Two Years as an Anthropologist on the Photoshop Team

Facebook Design
Facebook Design
Дизайн-команда Facebook ще більш міцно взялася за Medium і запустила відразу два блогу: загальний і присвячений спеціалізованим інструментів. Потік статей на старті потужний, є багато цікавого:


Кейси редизайну


Непрохані редизайны


Редизайн BBC


Історія пригод Healthcare.gov


Історія
History of Icons — A visual brief on icon history by FUTURAMO
Шикарний матеріал історії іконок від 80х до цього часу. Компанія Futuramo розбирає еволюцію підходів і наводить приклади усіх більш-менш значущих платформ. Оглядова версія на російською.
History of Icons — A visual brief icon on history by FUTURAMO

Тренди
Design Machines
Один з найкращих матеріалів місяця від Travis Gertz. Він говорить про те, що сучасний дизайн вебі перетворився в сумне одноманітність і розбирає причини цього засилля клонів. А після пропонує вихід   куди дивитися і куди рухатися, щоб вийти з глухого кута. Дуже надихає, так і оформлено здорово. Все те   форматі презентації. У продовження теми:
Design Machines

Ідеологія No UI


Автомобільні інтерфейси


Віртуальна реальність


Розумні годинник і браслети


Для загального і професійного розвитку
Tilda Education
Десь у початку місяця команда Tilda Publishing запустила свою школу дизайну. Микита Обухів останнім часом приділяє багато часу вихованню ринку і ці матеріали   частина загальної ініціативи. А в жовтні запускаються два онлайн-курсу в доповнення до статтями   веб-дизайну і веб-паблишингу.
Tilda Education

Readymag Design School
Творці Readymag запустили свою онлайн-школу дизайну. &Nbsp;суті це скоріше набір добротних навчальних статей, присвячених основам дизайну   шрифти, сітка, колір, композиція.
Readymag Design School

So you want to be an IA?
Відмінна мотивуюча стаття Abby Covert для тих, хто хоче стати інформаційним архітектором, так і взагалі вирости професійно UX. У тому числі про помилкових і правильних цілях розвитку.
So you want to be an IA?

How to become an awesome designer in 365 days
Marko Stupić розповідає про власному проекті, де він робив іконці-ілюстрації кожен день в протягом року. Це дозволило йому професійно прокачатися, отримати купу корисних контактів, так і продати багато з цих робіт. Формат «100 робіт в протягом 100 днів» популярний в останні роки, у чому завдяки Michael Beirut з Pentagram — це відмінний спосіб прокачати свої професійні навички.
How to become an awesome designer in 365 days

The Guide to Interactive Wireframing
Нова книга від UXPin про створення інтерактивних wireframes.

Всі випуски розсилки Главреда. Експеримент
Максим Ильяхов виклав всі випуски розсилки Главреда на своєму сайті.
Всі випуски розсилки Главреда. Експеримент

Анонси тренінгів та семінарів


Жарти про дизайнерів за 400


Продуктовий дизайнер


Sketchnotes




Уривки з книги Mike Monteiro «You're My Favorite Client»


Люди і в галузі
Дизайн-партнери венчурних компаній


Купівля дизайн-студій великими компаніями


Susan Kare


Свіжі посилання можна також відслідковувати в однойменної Facebook-групі або отримувати раз на місяць поштою. Спасибі всім, хто також публікує посилання в ній, особливо Геннадію Драгуну, Павлу Скрипкину, Дмитру Подлужному, Антону Артемову, Денису Єфремову, Олексію Копилову і Євгену Соколову. Все більше матеріалів оглядах з'являється завдяки їм.

Джерело: Хабрахабр

0 коментарів

Тільки зареєстровані та авторизовані користувачі можуть залишати коментарі.