Давненько в нас не було добірок корисних плагінів, виправляємо ситуацію 😄

1. Table Creator.
Цей помічник допоможе швидко створити таблицю. Їх можна легко змінювати, редагувати та налаштовувати відповідно до вмісту.

2. EightShapes.
Дозволяє створювати детальну проєктну документацію безпосередньо у Figma, полегшуючи співпрацю з вашою командою. Прописує анатомію, леяути, спейсинг тощо.

3. Sticky Note Maker.
Плагін для створення нотаток як у FigJam, яким дуже зручно відмічати ідеї на етапі досліджень чи збору референсів, а також залишати думки та коментарі під час обговорення з командою. Активно його використовую в роботі 🔥

4. Annotate it!
З його допомогою ви можете легко додавати шари анотацій і керувати ними у своїх дизайнах. Ідеально підходить для простої співпраці та спрощення процесу зворотного зв’язку з робробниками.

#інструменти #плагіни_figma
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Українці створюють неймовірне 🔥

Харківська агенція Obys створила анімований лендинг про принципи типографії.

У першому блоці вони розкривають інформацію про шрифтові пари, базові принципи, інтерліньяж тощо. Другий блок містить матеріал про вирівнювання, а третій відповідає за ієрархію та контраст.
Подача інформації захоплює дух ✨

P.S. У них також є інтерактивний гайд про сітки, де розказано про їх види та способи використання. Для мене ці гайди — це окремий вид мистецтва. За такими матеріалами навчатися — одне задоволення 💜

#дизайн_ресурси #безкоштовні
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Новини дизайну: що відбувається на горизонті?

1. У Києві відбулася презетанція друкованого Telegraf.Magazine, присвяченого українській Волі.
На презетації обговорили унікальні аспекти української ідентичності та їх відображення в нашій культурі (до речі, я свій екземпляр вже придбала, покажу коли доїде).

2. Новий інструмент від Google для боротьби з недостовірною інформацією.
Google запустив нову функцію «About this image», яка дозволить дізнатись більше даних про фото, наприклад, історію зображення, метадані й контекст їх використання.

3. Онлайн-музей української діаспори.
Музей української діаспори розробив онлайн-простір, що включає відцифровані артефакти з власної колекції та від партнерів як із України, так і з-за кордону. Дуже тішить, що українська культура стає доступною в онлайн-форматі для тих, хто не знаходиться в Україні❤️‍🔥

4. Стали доступні нові твори у проєкті «Українська література у коміксах».
Український культурний фонд видав 15 нових коміксів за творами українських письменників. Обовʼязково перегляньте, я в захваті від них! Вважаю, сучасним школярам дуже пощастило. Та й дорослим теж).

5. Платформа для пошуку репетиторів «Preply» зробили цікавий ребрендинг.
Повторення стало ключовим компонентом візуальної ідентичності платформи - дуже цікава концепція та гарний приклад дизайну із сенсом.

#дайджест #новини
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Нещодавно натрапила на статтю про редизайн банківського застосунку Revolut.

Чим вона класна — описом всіх етапів розробки нового інтерфейсу: від аналізу існуючого застосунку, опитувань користувачів та перевірки гіпотез, до власне реалізації дизайну. Для новачків у UX буде корисно подивитись, як має відбуватись робота, адже сам дизайн у фігмі займає меншу частину часу в таких проєктах, ніж діскавері.

Проте, це ще й можливість застосувати критичне мислення. На багато рішень, які приймає автор,моя реакція була "чувааак, чому??" 😫 До прикладу, чому іконки банківського застосунку виглядають, ніби заблукали й випадково потрапили сюди з якогось розважального інтерфейсу? Для порівняння, Моно не виглядає дуже формальним та серйозним, але це зроблено більш елегантними способами, анід плейфул іконки.

А які у вас є зауваження щодо цього редизайну?
Діліться своїми думками у коментарях 👇

#навчання #статті
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Ловіть добірку з референсами для мобільних застосунків — помітила, що у нас тут таких майже не було 😱

1. Flowstep.
Бібліотека, яка надає доступ до скріншотів найкращих продуктів, таких як Airbnb, Klarna, Spotify та інші. У полі пошуку є навігація за категоріями, а також можливість сказати штучному інтелекту, що ви шукаєте, і він підбере для вас екрани.

2. Аppshots.
Його перевага полягає в тому, що на сторінці кожного додатка є окреме сортування «Flows», де ви можете знайти приклади екранів (пошуку, сповіщення, налаштування тощо) обраного вами застосунку. Проте, для перегляду флоу доведеться оформити підписку на преміум (12$/місяць).

3. Scrnshts.
Каталог, що вміщує скріншоти застосунку з App Store з посиланням на сам додаток. Сортування також за категоріями.

Тицькайте 🔥, якщо зберегли.

#дизайн_ресурси #безкоштовні #референси

__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Тиждень виявився насиченим цікавими подіями 🤩

1. Стартував Літеропад — челендж, спрямований на віртуальне відродження шрифтової спадщини.
Чудова ініціатива для популяризації шрифтових майстрів. Завдання учасників — знайти старвинні зразки літер, перетворити їх в векторну графіку та оприлюднити із вказівкою на першоджерело.

2. Презентація Weblium AІ.
Українські розробники представили й запустили його тестову версію з інтегрованим Chat GPT для текстів і DALL-E для фото. Тепер можна створити сайт за назвою бізнесу та його коротким описом.

3. Україна підписала міжнародну декларацію про безпеку використання ШІ на AI Safety Summit у Британії.
Тепер країни співпрацюватимуть для розробки заходів, спрямованих на запобігання можливим негативним наслідкам ШІ.

У той же час, акторка Скарлетт Йоганссон подала до суду на розробника програми з ШІ через використання її голосу без згоди в рекламному ролику. І це при тому, що уряд США ще давніше підписав декларацію. Цікавий збіг, правда? 😆

4. Креативна спільнота анонсувала створення фахового словника «Тлумач дизайн».
Випуск планується в друкованому та онлайн форматах. Платформа вже перебуває в розробці, а повноцінний запуск заплановано на перший квартал 2024 року.

5. CASES надав безкоштовний доступ до запису дизайн-конференції «Дизаріум».
Включено понад 10 доповідей від українських та іноземних фахівців з обговоренням різних аспектів дизайну.

6. Фантазії про можливості Figma чи натяк на нові функції?
Продуктовий лідер Figma заінтригував цікавим дописом «А що, якби…», в якому роздумував над новими можливостями інструменту, серед яких пов'язані активи Adobe та Figma, багатокористувацький режим в Adobe, можливість безперешкодної співраці Firefly з проєктування у Figma та інші. Тримаємо схрещені пальчики на круті нововведення 🔥

#дайджест #новини
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

4 нові класні плагіни для Figma у вашу колекцію.

1. Brandfetch.
Миттєвий доступ до мільйонів логотипів із варіаціями, кодами кольорів, описом грифтів та банерами відомих брендів.

2. Relume Ipsum.
Інструмент для копірайтингу з ШІ. Достатньо просто коротко описати проєкт, виділити фрейм й натиснути кнопку "Generate", він заповнить усі текстові поля потрібною інформацією. Але-але, безкоштовне обмеження — 2000 символів, далі від 9$ на місяць за дві тисячі символів.

3. Breakpoints.
Справжній чарівник адаптації для зручної перевірки прототипів на різних екранах. А ще він працює без відкритого вікна плагіна, тому будь-хто у вашій команді зможе змінити розмір макету.

4. Figma GPT.
ChatGPT безпосередньо в Figma, нарешті не потрібно перемикатись між вкладками під час роботи ❤️‍🔥

#інструменти #плагіни_figma
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Не уявляю своєї роботи без Notion. Я зберігаю там усі знахідки дизайн-ресурсів, референси, документацію по проєктах, нотатки з колів з командою, плани сесій юзер-тестування… Якщо правильно налаштувати роботу у Notion, він стає незамінним помічником.

Проте, зробити це власноруч може бути дуже складно та довго, особливо якщо у вас ще немає досвіду роботи з ним. На щастя, багато вже зроблено за нас, а отже — можна скористатися готовими шаблонами 😏

За цим посиланням знайдете чудову добірку шаблонів Notion, серед яких:

🟣 Роадмап для організації роботи над проєктом
🟣 Шаблони для User Research
🟣 Заготовка сторінки портфоліо дизайнера
🟣 Шаблон для збереження нотаток з мітингів

та деякі інші.

Чи користуєтесь Notion? Чи зберігаєте все по-старому, в документах? Або знаєте альтернативи? Діліться в коментарях 👇

#дизайн_ресурси #безкоштовні
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Ловіть сайт із велетенською кількістю різноманітних анімованих прелоадерів.

Ресурс пропонує анімацію завантаження в різних стилях: як стандартних, так і доволі незвичайних. А ще їх можна з легкістю редагувати — змінювати колір, швидкість, розмір.

Наче й дрібничка, а приємно 😌

#дизайн_ресурси #безкоштовні
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Привіт, дизайнери! Ловіть новини тижня:

1. Музей Майдану представив проєкт «Територія Гідності у доповненій реальності: музеєфікація пам’яток Майдану».
Відтепер кожний охочий у просторі Києва зможе відтворити 10 найвідоміших об’єктів Революції Гідності за допомогою QR-коду.

2. Monobank отримав стильний редизайн – перший за останні шість років!
Співзасновник Олег Гороховський анонсував редизайн додатку: відтепер головний екран вміщуватиме інформацію про стан рахунку, картку, поточні транзакції та сповіщення, а перемикатися між картками можна буде свайпом, який супроводжуватиметься 3D-анімацією.

3. Тестування нової кнопки «Відтвори щось» від YouTube.
Кнопка направлятиме користувача на випадкове відео у випадку, коли він не може визначити, що саме хоче подивитися. Як на мене, цікава ідея, однак поки невідомо чи враховуватиме він історію переглядів й за якими алгоритмами пропонуватиме контент 🤔

4. Верифікація акаунта у застосунку «Укрзалізниці» через «Дія. Підпис».
Міністр цифрової трансформації Михайло Федоров зазначив, що така інтеграція допоможе в боротьбі з перекупами, бо акаунти, які масово скуповують квитки, будуть блокуватися.

5. Ребрендинг музичного стрімінг-сервісу Deezer.
Тепер дизайн в темно-фіолетовій гамі, а логотип викликає асоціацію музичної хвилі. А ще появилась нова функція Shaker, яка дозволяє обмінюватись піснями з друзями на інших стрімінгових платформах, таких як Apple Music, Spotify і Tidal.

6. Picsart вражає – 20 нових інструментів на штучному інтелекті Ignite!
З ними користувачі можуть легко створювати рекламу, соціальні медіа-публікації, логотипи тощо. Також інструменти дають можливість створювати відео, зображення, GIF-файли, логотипи, фони, QR-коди та наліпки.

#дайджест #новини
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

В проєкті, на якому я працюю зараз, велика увага приділяється дизайну таблиць з різноманітними та складними даними. Таблиці самі по собі досить болючі для дизайнерів та викликають купу питань (як порахувати ширину стовпців? Як побудувати на автолейяутах, щоб можна було легко редагувати? В якому порядку розташовувати дані? По якому краю вирівнювати?…). А коли ми маєму справу ще й великою кількостю різноманітних даних, то проблем стає ще більше: як показати багато стовпців в обмеженій ширині контейнеру? Як і коли використовувати горизонтальний скрол? Яка оптимальна кількість рядків? Як організувати сортування? Як зробити таблицю такою, яку легко читати?

Щодо багатьох питань ресерчу просто зараз, тому в реальному часі поділюсь з вами своїми знахідками. Якщо не дуже товаришуєте з таблицями та хочете зробити їх зручними для користувачів (на що я дуже сподіваюся), зберігайте:

🟣 Велика стаття про UX патерни в таблицях з прикладами добре/погано

🟣 Також приклади UX рішень для таблиць

🟣 І ще приклади, до того ж анімовані

А я пішла ресерчити сортування та фільтрацію 🤔

#статті #референси
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Безкоштовні для комерційного використання гарнітури з підтримкою кирилиці 👍

➰ «3270»
Моноширинний шрифт від Рікардо Банфі, натхненний гарнітурою із теміналу серії IBM 3270. Дуже цікавий та характерний. Існує у двох накресленнях: regular та medium.

➰ «Hibana»
Гротескний із особливими деталями та захопливою історією створення. Його назва перекладається як «іскра». До завантаження доступне одне накреслення.

➰ «Binchōtan»
Моноширинний шрифт, що вдало поєднує елементи систем письма C.J.K. (китайської, японської та корейської) із «західними» (латинськими) алфавітами. Доступний у одному накресленні.

#дизайн_ресурси #шрифти #безкоштовні
______

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Як розібратись із розширеним пошуком — елементом, що вимагає детально продуманого UX через великий обсяг даних?

Створення UX для інтернет-магазину, платформи чи іншого складного інтерфейсу може стати великим головним болем, якщо ви не вмієте проєктувати пошук.

Тож пропоную вам насичену прекрасною інформацією статтю, де описуються способи покращення UX розширеного пошуку. Тут запропоновано різні його методи, а також проаналізовано плюси та мінуси кожного.

Зокрема ви дізнаєтесь:
🟣 як обрати формат для різних параметрів пошуку (чекбокс, слайдер, радіокнопки..);
🟣 скільки параметрів потрібно відображати та як правильно ховати, якщо їх забагато;
🟣 як та в якому лейауті відображати результат пошуку;
🟣 як впропаджувати фільтри

та інші.

Чи були у вас проєкти зі складним просунутим пошуком? З якими проблемами ви тоді зіткнулися? Діліться у коментарях 👇

#навчання #статті
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram

Продовжуємо рубрику "працюємо над проєктом разом з Лєрою" 🙌

У нашої дизайн-команди виникли затики в роботі з дизайн системою. Вона росте, компонентів стає все більше, все більше їх станів, варіацій та безладу. Ще й ідея змінити шрифт, оновити стилі та покращити в плані зручності використання.

Як прихильник автолейяутів, компонентів та головоломок, я взяла на себе саме організацію бібліотеки компонентів. Швидкі візуальні рішення - не мій сильний скіл і грати зі шрифтами я не люблю, а от нафігачити компонентів - це залюбки.

Є бажання зробити все like a pro. Щоб один компонент на всі варіації і швидкі налаштування пропертіс, як на гіфці (яка, доречі, звідси).

Оцим сьогодні і займаюсь. І знайшла епічне відео, яке показує як то все зробити, не могла не поділитися з вами. Чувак показав цю магію буквально за 15 хвилин.

Але то ще не все, бо я досі з Variables не розібралася.. 🤯 Схоже, час прийшов.

#навчання #відео #figma
__

Підписуйся на Marus Design:
Telegram | YouTube | Instagram