interfaces.prjctr | vnotchenko week

🗒 Понеділковий порядок денний на каналі: • побажати продуктивного робочого тижня й нагадати, що у вас все вийде; • поділитися детальною статтею Віталія Фрідмана про те, чому варто дати шанс нескінченній прокрутці та як дизайнити її правильно; • дати знак, що на воркшопі Віталія Designing for Complex UI навчитеся працювати не лише з infinite scroll для складної сітки, а розв'язувати комплексні дизайн-завдання загалом.

Запланувати у п’ятницю те, що можна зробити вже у понеділок? Вміємо, практикуємо й вас заохочуємо. Добірка освітніх можливостей вже тут. Обирайте, з якою перейдете на новий рівень знань та навичок: 🔹Курси • Web Design Beginning 2 жовтня • Product Design 2 жовтня • Mobile Apps Design 2 жовтня • Web Design Junior 9 жовтня • UX Design Beginning 11 жовтня • UX Design Medium 17 жовтня • AI for Product Creation 17 жовтня • UX Writing 27 жовтня 🔹Інтенсиви • Mobile UI Design Workshop 4, 7 жовтня • Designing for Complex UI 4, 5, 6 жовтня • Animation in Figma Workshop 11, 14 жовтня • Test. Solutions Analysis 28, 29 жовтня 🔹Відеокурси • Figma • Webflow

Мистецько-прекрасний icebreaker З нього розпочинає навчання Юрій Грановський — куратор воркшопів Ideation. Co-Creation Sessions та Test. Solutions Analysis. На етапі знайомства студенти мають обрати «свого» персонажа зі всесвіту Марії Примаченко, який передасть їхній стан. 🔹Як з’явилась ідея? Юрій розповідає: «Загалом ідея використовувати візуальні образи для айсбрейкінгу не моя й вона далеко не нова. Та я часто нею користуюся, бо інколи так набагато легше пояснити свій внутрішній стан. Я люблю, коли на воркшопах весело, тому підбираю фанові образи або у яких є додатковий сенс. А нещодавно я був на виставці Марії Примаченко в Українському Домі й зрозумів, що це ідеальні образи для айсбрейкінгу. Вони милі, яскраві, різні, абстрактні та водночас передають конкретні емоції та додають активності сенсу. Тому я вирішив протестувати образи Примаченко в якості айсбрейкінгу на воркшопі. Студентам зайшло, вони навіть використовували їх на власних воркшопах з реальними стейкхолдерами, які проводили в межах нашого інтенсиву». ____ А хто ви в дивовижному всесвіті Марії Примаченко? Скидайте в коментарі скриншот образу, який на 100% передає ваш стан цієї п’ятниці.

Як щодо розмов про дизайн за коктейлем? Наші друзі з VVMD запускають «Дизайн-бар» — серію офлайн-подій для спілкування між дизайнерами, артдиректорами та власниками дизайн-студій. Перша зустріч стартує 5 жовтня. За планом: неформальний нетворкінг і розбір ребрендингу вебстудії Nextpage на Obriy Design Büro від Мар’яни Бучкович — lead-дизайнерки бюро та кураторки на курсі Web Design Junior. А ще буде благодійний аукціон від БО «Фундація Взаємодопомога». 🔹Команда VVMD також передала вам 5 промокодів Projector0510 на знижку 10%, які діють до 23:59 цього вечора (28.09). Квитки на перший івент  — за посиланням.

Коли змінюєте вектор руху, буває беруть сумніви, а чи правильне це рішення. Та не спробувавши, дізнатися важко. Довіритися процесу, собі й діяти — підхід, який обрала Крістіна Фрімова, студентка курсів Web Design Beginning і Web Design Junior. Ділимося її історією.

Сервіс-дизайн, як кіновсесвіт Marvel — один рівень роботи над продуктом тісно пов’язаний з іншими. Адже сервіс  — це про велику кількість точок дотику користувачів з бізнесом — від сайту, застосунку, телефонного дзвінка, до виписки з рахунку, сповіщення про доставлення тощо. Тому, щоб бути «в курсі подій» та впливати на успіх застосунку, дизайнерам важливо працювати на мультирівнях і вміти перемикатися між загальною картиною та деталями й навпаки. Відповідно, вони повинні мати можливість брати участь у стратегічних обговореннях і плануванні, щоб сформувати ефективні умови для тачпоінтів клієнтів із послугою. • У матеріалі авторка розбирає основні рівні масштабування та підходи, застосовані на кожному з них — від юзабіліті та користувацького досвіду до стратегій самого сервісу та бізнесу загалом. Детальніше з поясненнями — тут.

Про таблиці та їх (ефективне) створення Комбо, щоб почитати й прокачатись: 🔹Cтаття про основні UX/UI-патерни в дизайні таблиць, аби розуміти, як візуалізувати дані, а як не варто. 🔹Воркшоп Data Tables in Figma, щоб вміти створювати таблиці у редакторі та застосовувати просунуті прийоми автолейаутів.

Рубрика «Тернистий шлях UX» — виходить за межі інтерфейсів Адже створювати речі, які наче йдуть назустріч потребам користувачів, але різко повертають на вулицю «Хто це взагалі вигадав?», було притаманно людям десятки років тому. Сьогодні розглядаємо та дивуємося з винаходів минулого століття. 🔹Творці сіамських туфель схоже мали дві мети: допомогти людям танцювати синхронно, а ще приколотись з них. Фото взуття опублікували в пародійному «Better Living Catalogue» як жартівливий спосіб допомогти парам підтримувати такт у танці. 🔹Є вірогідність, що винахідник занурювача для пончиків розв'язував проблему, якою мало хто переймався. Та відомо одне — занурити випічку у чашку кави, не намочивши пальців, стало реальністю. 🔹Ніяких makeup туторіалів на YouTube. У 1930-х винахідники запропонували аудиторії б’юті-мікрометр. Це пристрій, який дозволяв визначати, де потрібно наносити макіяж, щоб досягнути «ідеальних» пропорцій рис обличчя. 🔹Дінасфера — це не перша спроба людства спроєктувати моноколісний транспорт, на якому, окрім водійських прав, треба ще здобути фантастичний скіл балансу. І точно не остання. Концепція одноколісних засобів пересування перекочувала в сучасні електричні моноколеса, які ще й світяться в темряві. 🔹Радіокапелюх — тут уся суть в назві. Капелюх + антени, які ловлять станції в радіусі 32 км = бути в курсі подій або підтанцьовувати під улюблений трек дорогою на роботу. Що це, як не предок плеєра Walkman чи iPod? ❓Питання до вас: який з цих винаходів перемагає в рубриці? Ми думаємо, сіамські туфлі та б’юті-мікрометр — головні претенденти.

+1 інструмент для створення дизайн-елементів — Haikei Застосунок побудований навколо генераторів. Кожен з них має набір функцій, з якими можна кастомізувати візуали під ваше бачення та експортувати у форматі SVG або PNG. Протестувати.

UX-проблема рішення, від якого тіпається око Ось ви наводите курсор на пункт в меню, з якого відкривається ще один список і як тільки намагаєтеся навести курсор на це вкладене меню, все закривається. Як то кажуть, має бути кращий спосіб. В автора статті він є — «безпечні трикутники» (safe triangles). Це інтерактивна зона, яка дозволяє вкладеному меню залишатися відкритим. Хоча сама ідея не нова, у матеріалі автор розібрав сучасні приклади застосування цього підходу. А конвертувати проблеми на дизайн-рішення, підкріплені дослідженнями, навчитеся на курсі UX Design Medium. Відточувати нові скіли будемо на реальних проєктах з реальними запитами.

Зручний та водночас красивий інтерфейс — більше не вавилонська вежа для замовників і дизайнерів. Домовитись, усе поєднати та спроєктувати — реально. Для цього вам знадобиться відчуття балансу в дизайні, надивленість та вміння презентувати свою роботу. Якщо хочете навчитися працювати з цією трійцею, вам на дводенний Mobile UI Design Workshop. Ваш гід у цій подорожі — Вадим Грін, Lead Product Designer в Adjust. Разом із куратором ви: 🔹розберетеся з набором інструментів для створення UI та як і коли застосовувати кожен; 🔹зрозумієте, як розвивати естетичний смак, щоб генерувати ідеї; 🔹навчитесь ефективно презентувати власні UI-рішення; 🔹відточите свіженькі скіли на практиці й створите дизайн кількох екранів. • Деталі та реєстрація.

Трохи статистики: у світі є близько 350 мільйонів людей з дальтонізмом. Зустрічається він приблизно в 1 з 12 чоловіків і 1 з 200 жінок. • На зображеннях побачите, як люди з і без дальтонізму можуть сприймати календар для бронювання квитків на літак. Чи могла б ситуація бути іншою? Так. Змінити її — завдання дизайнерів, які розробляють інклюзивні інтерфейси. Так ви створюєте емпатичний користувацький досвід, що залучає і людей, які бачать світ по-іншому. У цьому випадку —  буквально. Зібрали ресурси, які допоможуть зрозуміти, як люди з порушенням сприйняття кольорів бачать дизайн і як зробити його доступним для них. 🔷 Гайд з дизайну для людей з дальтонізмом: як доносити візуальні сенси до кожного. Переглянути. 🔷 First-hand досвід: автор з дальтонізмом розповідає, як бачить світ та інтерфейси. Читати. 🔷 Інструменти-симулятори, з яким побачите, як виглядає зображення з певними типами дефіциту кольорового сприйняття. Інструмент 1. Інструмент 2. • Якщо хочете зануритися глибше в тему доступного дизайну загалом, вам на безоплатний курс Inclusive Web Design.

Дослідженням місце за великим столом, де приймаються великі рішення Сьогодні наша #подкаст_рекомендація саме про це. Послухаєте про те, чому можна й варто доносити результати дослідження не лише до команд дизайну чи продукту, а й до стейкхолдерів на вищих рівнях організації. Як такий підхід допоможе налагодити стосунки з останніми та впливатиме на кінцеві рішення. • Apple • Spotify • Google

Працювати дизайнером в продукті = бути продуктовим дизайнером А це точно? Не зовсім. Останній охоплює весь життєвий цикл продукту. Це якщо коротко. Більш детально розрізнити обидва взялися наші куратори — Олександр Іванічкін, Head of Design у robota.ua та Арсен Колиба, Product Designer у WIX. 🔷 Що робить продуктового дизайнера продуктовим? Олександр каже: • «Продуктове мислення» або гра в довгу. Продуктові дизайнери — стратеги, які змінюють процеси своєї роботи для більш глибинних досліджень і приділяють додатковий час на організаційні питання. • Більша ітеративність в роботі. Продуктові дизайнери радше запустять MVP та інші демоверсії, бо розуміють, якщо ідея спрацює, вони зможуть її допрацьовувати хоч роками. • Постійна оцінка результатів своєї роботи. Продуктові дизайнери не просто віддають проєкт і забувають про нього, а відстежують дані по ньому, щоб ітеративно покращувати продукт далі. 🔷 Які три скіли окрім досвіду потрібні щоб UI/UX-дизайнеру перейти у продуктовий дизайн? Думка Арсена: • Вміти брати відповідальність й приймати рішення; не чекати поки скажуть, що і як робити. • Самостійно знаходити проблемні точки — взаємодіяти з історичними даними, спілкуватися з користувачами, бути в курсі свого ринку й суміжних сфер. • Вміти й любити ітерувати — рухатися швидко, викочувати фічі й покращувати їх поступово, не зупинятись на першому підході. 🔷 Набір на курс Product Design триває. Раптом ви чекали на знак, це він. Чого навчитеся і як, дізнайтеся тут.

Для тих, хто ще не іменує леєри, але дуже хоче почати Ділимося збіркою гайдлайнів, як це робити ефективно, а ще організовувати компоненти та документацію. Щоб і ви, і команда були on the same page, як то кажуть.

«Менеджери з найму не читають портфоліо, вони сканують їх» Каже Слава Шестопалов. У своїй колонці він проведе вас крок за кроком 10 просунутими порадами, як оформити портфоліо, щоб вигідно підкреслити ваші досягнення. У матеріалі дізнаєтесь, що робити, якщо бракує end-to-end проєктів, як створювати об’ємні кейс-стаді, які не відлякують команду найму тощо. Є деталі, приклади й, звісно, меми від Слави. До читання.

Поєднуємо красиве з корисним й, можливо, дещо незвичайним Зібрали добірку ресурсів, де зможете: • надихнутись естетичними вебдизайнами; https://minimal.gallery/ • роздивитися шляхи користувачів (ті, що user flows) у мобільних застосунках; https://uxarchive.com/ • дослідити світ UI в іграх (це те незвичайне, що ми згадували вище). https://www.gameuidatabase.com/

Факт 1: у серпні в App Store додалося 39 770 застосунків після липневих майже 37К релізів. Факт 2: ми не знаємо, скільки це у гігабайтах. А от з чого складається дизайн мобільних застосунків — знаємо. Розібрали професію на основні молекули. 🔷 Хто може стати дизайнером апок? • Вебдизайнери Дизайнять і лендинги, і складні сайти, які вміло адаптовують до мобільних версій. З цією базою готові працювати над продуктами для менших девайсів, але не з меншою кількістю завдань і челенджів. • UI/UX дизайнери-початківці Знайомі з дизайн-процесом. Та відчувають, що їх навички на повну втіляться в нішевому напрямі дизайну застосунків. Або навпаки готові перейти на мультифункціональний рівень й додати до скілсету проєктування апок. 🔷 Що для цього потрібно? Окрім бажання, у пригоді стануть скіли: • створювати прототипи, працювати з гайдлайнами та UI-кітами; • вміти в анімацію, типографію, дослідження; • мислити у напрямку “problem solving” — знаходити проблему та її розв’язання; • співпрацювати зі стейкхолдерами й розуміти бізнес-складову застосунку. 🔷 Хто йде пліч-о-пліч з дизайнером застосунків? • Продуктові менеджери, щоб узгодити дизайн з цілями продукту й потребами юзерів. • Розробники, щоб правильно втілити дизайн в код реальність. • QA-спеціалісти, щоб виявити й побороти проблеми з юзабіліті застосунку. • UX-дослідники, щоб відшукати потреби юзерів і перетворити їх на дизайн-задачі. • Data scientists, щоб аналізувати поведінку юзерів й використовувати ці дані для покращення застосунку. 🔷 Якщо бажаєте рухатися в бік дизайну застосунків, навчальна база для цього — Mobile Apps Design Course. Нові знання тут.

UX-дослідники ігор читають по очах. Несподівано? Насправді все більш приземлено — юзерам під час дослідження буває важко пояснити, чому вони зробили певну дію. Оскільки читати думки не те щоб можливо, залишається спостерігати за рухом очей гравців. Такий підхід є досить ефективним, адже цей же рух очей і розподіл уваги тісно пов’язані. Відповідно UX-дослідники можуть відстежувати причини, чому гравці не зробили дію вчасно, наприклад. А така інформація допоможе покращити користувацький досвід гри. У матеріалі автор розписав, як технологія eye-tracking працює в UX-дослідженнях для геймдеву, які індикатори руху очей зазвичай використовуються та як інтерпретувати ці дані.

Відкладайте свої таски, бо у нас тут залипальний контент У пошуковику Google з’явилась функція Emoji Kitchen — можливість комбінувати емодзі. Принцип такий: оберіть перший квадратик та емодзі, а потім — другий квадратик. Далі натисніть на готову комбінацію й вона скопіюється у буфер обміну. Креативте на здоров’я. А в коментарях закидуйте ті комбінації, які ідеально описують ваш день.