interfaces.prjctr | vnotchenko week

Скевоморфізм або «все, як у житті» Це дизайн-концепція, яка полягає в тому, щоб створювати елементи інтерфейсу схожими на їх аналоги в реальному світі. Згадайте сміттєвий кошик на робочому столі ПК. Та цей приклад не єдиний. Зібрали добірку скевоморфічного дизайну. Хвилинка історії. Скевоморфізм з’явився ще у далеких 1980-х, коли дизайнери Apple та Microsoft почали створювати візуальні метафори для цифрового функціоналу. Ідея була в тому, що коли користувачі бачать щось рідне з реального світу, їм легше взаємодіяти з диджитал-продуктами. Та у 2007, скевоморфізм почав поступатися новій формі дизайну, що має назву «плаский дизайн». Хоча відгомін першого досі можна помітити в інтерфейсах. __ Більше прикладів дизайну переглядайте тут і тут.

Раптом ви пропустили — у Figma оновлення Напередодні компанія випустила нову функцію. До стандартного колірного профілю sRGB тепер приєднався Display P3. Якщо ви не знайомі з останнім, то цей профіль надає насиченіші й на 49% візуально чіткіші кольори у порівнянні з sRGB. У Figma кажуть, що вирішувати, який саме простір варто використовувати, дизайнери мають лише спираючись на кінцевий користувацький досвід. Адже деякі монітори та мобільні пристрої підтримують кольори Display P3, тоді як певні веббраузери працюють лише з sRGB. Більше про функцію й те, як налаштувати Display P3 у Figma ось тут. Хто вже встиг протестувати оновлення — як вам?

Вашому портфоліо потрібен особливий соус У цьому переконаний Джадд Антін — у минулому Head of Design в Airbnb і Head of Research y Meta. Він вважає, що більше недостатньо мати просто професійне портфоліо. Адже такі вже є у 1000 кандидатів, яких рекрутер переглядає щотижня. Що робити, аби привернути увагу? На думку Джадда — додати особливий соус. Те, що вас вирізнить серед інших. Який цей особливий соус і як його подати у портфоліо? Читайте у матеріалі.

Хто тут користується Sketch? Знайшли короткий гайд від самого редактора, як приводити до ладу документацію. Якщо коротко, ви можете це зробити за допомогою розділів Projects та Collections. Якщо детальніше, у гайді знайдете три способи використовувати обидва, щоб розкласти документи по цифрових поличках. Маєте власні прийоми, як приборкувати хаос у файлах? Сміливо діліться в коментарях.

Прийшли до вас з рекомендацією, щоб таке корисне прочитати Цього разу матеріал про моушн. А правильний моушн — це той, який і підтримує увагу користувача, і фідбек дає та й загалом підсилює юзабіліті продукту. Але будувати motion design рідко стоїть першим пунктом у списку пріоритетів. Брак часу й команди — одні з причин. Тому автор статті радить систематизувати його одразу, як починаєте працювати над загальною дизайн-системою. Також він розписав покроково, як це робити ефективно — від планування та аудиту до документації для розробки. Тут усе, як має бути: чітко, детально й на реальних прикладах. До читання.

Ранок в Кривому Розі видався страшним. Люди просто збиралися на роботу чи по своїх справах. Але армія окупантів вкотре довела, що хоче знищити все на своєму шляху. Ракета потрапила в звичайний житловий будинок. Вже є інформація від ДСНС про чотирьох загиблих та понад сорок поранених, серед яких четверо дітей. Відчуваємо лють і злість, які спрямовуємо на донати для армії, аби швидше перемогти ворога. Наші співчуття сім'ям постраждалих і загиблих. Рятувальні роботи та розбір завалів тривають. Автор ілюстрації — Михайло Скоп

Диджитал-варіант швейцарського ножа потрібен? Ділимося знахідкою. Це набір базових інстурментів, які так часто розкидані по різних вкладках. А тут все в одному місці. Взяти й користуватися.

Коли ви востаннє оновлювали своє портфоліо? А коли збирали тисячі лайків під своїми роботами від незнайомих людей? А коли були впевнені в абсолютно усіх кейсах для самопрезентації? Не поспішайте казати, що не пам’ятаєте. Краще відправляйтесь у Web Design Portfolio Camp. За планом — 4 дні інтенсиву й такої ж інтенсивної практики. У процесі ви: 🔷 навчитеся правильно структурувати дані, швидко візуалізувати ідеї та оформлювати блоки; 🔷 дізнаєтеся, на що звертають увагу в компаніях, коли оцінюють портфоліо; 🔷 розробите власний кейс, який дружить з усіма вимогами й стандартами. Цей шлях допоможе вам пройти куратор — Олександр Кім, Senior Product Designer / Product Design Team Lead Welltech, куратор на курсі Web Design Junior. Деталі та реєстрація

У середньому, користувачі готові чекати 22.6 секунди поки вантажиться вебсторінка. Та є умова — вони мають бачити панель прогресу. А коли такої немає, люди залишать інтерфейс вже за 9 секунд. Бо хто ж любить невідомість? Такі результати дослідження наводить автор статті про індикатори завантаження та прогресу. А ще він ділиться best practices, як їх дизайнити, щоб користувачам чекати було не так стресово. Поради ось тут.

Друзі, ділимося благодійним збором, що, як і решта, потребує нашої з вами підтримки. Студенти Київської школи економіки (KSE) за підтримки UKRAINIAN DEFENSE DEVELOPMENT CHARITY FUND та KSE Foundation запустили ініціативу Donate To Evacuate. Мета проєкту — зібрати $1 000 000 на два гелікоптери-медеваки для ГУР МО України. Можна ще й закарбувати свій внесок. Ім’я кожного, хто задонатить від $100, перетворять на камуфляж і нанесуть на гелікоптер у колаборації з українськими каліграфинями — сестрами Лопухіними. Дізнатися деталі ініціативи й підтримати її благодійним внеском можете тут — лінк на добру справу. ____ Відео Donate To Evacuate

Повернімося до розвитку надивленості Раніше ми ділилися, де її прокачувати. Сьогодні розповідаємо, як це робити. Вадим Грін, Lead Product Designer в Adjust, каже, що надивленість — візуальний досвід дизайнера. А тому його можна й треба системно збагачувати. Ось, що Вадим радить: 🔷 Перетворіть перегляд галерей на Dribbble, Behance та інших ресурсах на рутину. За чашкою кави, наприклад. Ваші очі та дизайнерський дух має наповнюватися естетикою, трендами, вічними патернами. 🔷 Створюйте колекції. Наприклад, у Pinterest. Збирайте цікаві та яскраві рішення на окремі полиці. В одній зберігайте застосунки, в яких не більше двох кольорів, в іншій інтер’єри в стилі hi-tech чи вікторіанську архітектуру. Це спонукатиме вас вдивлятися у зображення, розбирати їх на деталі, порівнювати з іншими й тренуватиме відчуття смаку. 🔷 Копіюйте (з розумом). Побачили щось красиве в роботах інших дизайнерів? Спробуйте відтворити це. Але пам’ятаємо про повагу до авторського права. 🔷 Просіть фідбек. Маєте друзів дизайнерів? Чудово! Скиньте їм свій макет, щоб вони поділилися враженнями. Поради, як розвивати надивленість є. І місце, щоб почати дизайнити зручні + візуально привабливі інтерфейси теж — дводенний Mobile UI Design Workshop від Вадима. Будемо робити красиво й ефективно вже 27 липня.

У студії «Тернистий шлях UX» Тут про UX-рішення, від яких інколи сіпається око або які показують еволюцію дизайну та ідей. Або одразу те й інше. Сьогодні ділимося з вами добіркою введення номеру телефону. Схоже, тут хотіли додати інтерактиву, але зручний користувацький досвід вийшов вибіг з чату 🙃 Якщо що, створювати інтерфейси, де обидва живуть у злагоді, навчитеся на курсі UX Design Beginning. Стартуємо 2 серпня.

Полетіла пташка. «Х» Ілона Маска замінив логотип Twitter у веб версії, очікується, що після оновлення те саме станеться і з мобільним додатком. Новий логотип описується як «мінімалістичний арт-деко». «Х» з’являється у всьому, чого торкається Маск. X.com була першою назвою для Paypal, далі SpaceX, позашляховик Tesla Model X, син X Æ A-12. І тепер «X, додаток усього». Що думаєте? Куди тепер шукати інвайт?

Ну що, Ілон все зробив це

Щось правда в око потрапила 🥲 «Оппенгеймер» — фото Universal Pictures. «Барбі» — фото Warner Bros. Picture.

Щось правда в око потрапила :smiling_face_with_tear:

Як працюють метафори в інтерактивному дизайні? Чому горизонтальний свайп = навігація між вебсторінками? Відповідь на обидва запитання криється в інтуїтивних «налаштуваннях», які закладені в кожному з нас. Горизонтальний свайп на смартфоні чи планшеті нагадує те, як ми гортаємо сторінки книжки. У своєму есе дизайнер Рауно Фрайберґ розібрав очевидні й не дуже деталі інтерактивного дизайну, які сам використовує в роботі. Інколи навіть підсвідомо. Ми вже прочитали й вас запрошуємо.

Щоб краще залучати користувачів на етапі досліджень, потрібно просто краще залучати користувачів на етапі досліджень. Все просто. А якщо серйозно, то за прискореним опануванням підходу participative action research йдіть на Design Research Workshop. Там за два дні сплануєте та проведете власні воркшопи у проєктах реальних замовників. Для цього навчимося: 🔹досліджувати користувацький досвід, залучаючи користувачів до співтворення знань та рішень; 🔹планувати та організовувати дослідницькі воркшопи; 🔹адаптувати дослідницькі інструменти під формат воркшопу та розробляти власні дослідницькі активності; 🔹створювати дизайн робочих канвасів у Miro для активної взаємодії з респондентами. Куратор: Юрій Грановський, співзасновник «Агентів змін» і «Публічної платформи». • Деталі та реєстрація

Де дизайнерам інтерфейсів прокачувати свою надивленість? 🔹Варіанти відповідей від куратора на курсі UX Design Beginning — Сергія Ревви: • щоб дивитися, які UI/UX патерни використовуються в інших продуктах – Webframe • щоб стежити за сучасними UI дизайнами — Godly та ridne.design (*тут куровані добірки від людей, чиї вподобання в дизайні імпонують Сергію) • щоб ознайомлюватись з плюсами та мінусами UX дизайну реальних продуктів — growth.design 🔹Варіанти відповідей від куратора на курсах UX Design Beginning та UX Design Medium — Євгена Олексюка: • для UX дизайнерів — Interaction Design Foundation • для дизайнерів, які працюють з E-Commerce — Baymard Institute • для дизайнерів, які планують не тільки «тягати пікселі», а й приносити користь бізнесу — Strategyzer Зберігайте, діліться з колегами та все таке інше.

Відповідь на запитання «де прокачати дизайн скіли?» — в добірці. Відповідь на запитання «які саме?» — за вами: 🔹Курси • Web Design Beginning 10 липня • Web Design Junior 10 липня • UX Design Beginning 12 липня • Mobile Apps Design 31 липня 🔹Інтенсиви • Design Research Workshop 29-30 липня • Mobile UI Design Workshop 27 липня, 3 серпня 🔹Відеокурси • Figma • WebFlow