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

Axure – універсальний комбайн

За допомогою програмного забезпечення Axure, єдиного в своєму роді, можна повністю відтворити функціонал сервісу/сайту/продукту. Прототип, отриманий у результаті, повністю клікабельний, дозволяє зробити адаптивку, вводити глобальні змінні, спроектувати і перевірити на ділі різні user flow для зареєстрованого і не зареєстрованого користувача.

Axure

Дане ПО дозволяє створити прототипи різних продуктів, навіть онлайн-калькулятора на сайті. У нього також є додаткові переваги:

  • можливість створити анотації для багатьох елементів інтерфейсу;
  • можливість створити прототипи в форматах HTML і .chm;
  • можливість створювати проекти для одночасної роботи над одним прототипом кількох учасників;
  • можливість швидко створювати прототипи і швидко вносити в них зміни, а також безліч інших переваг.

Однак у системи є також і недоліки:

  • застарілий інтерфейс і невелика кількість віджетів;
  • середньо-високий рівень входу (щоб повноцінно користуватися продуктом, необхідно вивчити багато функцій);
  • трата часу на перенесення з акшур в іншу програму для дизайну (тому для нескладних проектів на кшталт корпоративних сайтів ми використовуємо інструмент Figma);
  • Axure – платний продукт, і його вартість відчутно вища, ніж у програм-аналогів на ринку.

InVision – потужна система

У порівнянні з Axure InVision – простий сервіс, що дозволяє завантажити вже намальовані в іншій програмі екрани та розставити необхідні лінки. Сервіс працює на основі інтерфейсу типу drag-n-drop, а також пакету інструментів для швидкої обробки й роботи в самому браузері.

InVision

Найчастіше ми використовуємо InVision для прототипування мобільних додатків, в зв'язці з Adobe Illustrator. Серед головних переваг системи – інтуїтивний сучасний дизайн сервісу, можливість робити прості анімації-переходи екранів, а також багато інших:

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

У програми також є відчутні недоліки:

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

Figma – сервис, яким ми користумося найчастіше

Відмінний сервіс, яким ми користуємося майже постійно. Він складається з трьох основних функцій: дизайн, прототипування, перегляд css коду і дає можливість робити клікабельні прототипи, на які можна давати посилання клієнтам, розробникам. Також в Figma є можливість організувати спільну роботу всіх фахівців у режимі реального часу.

Figma

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

Ключові переваги Figma:

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

Щоб бути повністю чесними, вкажемо також деякі недоліки продукту:

  • немає можливості створювати прототипи для складних сервісів і продуктів – банально не вистачає функціоналу;
  • робота можлива тільки за наявності інтернету;
  • зміна розміру тексту може зміщувати його межі;
  • імпортовані файли не завжди відповідають оригіналу, розвалюються. Макет на Figma краще створювати з нуля.

Такі основні UX prototiping tools, якими користуємося ми в Evergreen, разом із їх перевагами і недоліками, з якими ми навчилися справлятися, щоб досягати кращого результату при проектуванні вашого продукту.

Потрібно створити дизайн стартапу, невеликого проекту, повноцінного SaaS-порталу, мобільного додатку або будь-якого іншого онлайн-продукту? Звертайтеся до нас, створимо продукт вашої мрії. І почнемо з UX прототипу, якому позаздрять конкуренти.

12.06.2019
Рейтинг: 5 / 5 (1)