Більше результатів...

Загальні селектори
Тільки точні збіги
Шукати у заголовках
Шукати у контенті
Вибір типів постів
Фільтрувати за категоріями
FAQ
Hostenko
Натхнення
Відео уроки
Новини
Плагіни
теми
Уроки
Хакі

Веб-каркас (мокап) — це, насправді, схематичний план веб-сторінки для UI/UX дизайнера. Основу можна намалювати навіть від руки на аркуші паперу, але значно ефективніше використовувати інструменти для створення каркасів, оскільки вони дозволять вам застосувати інструменти Drag and Drop, співпрацювати з іншими дизайнерами і показати клієнтам свої ідеї, перш ніж ви почнете їх втілювати. Дизайнер створює каркас у чорно-білому кольорі, щоб намітити розташування основних елементів таких як логотип, меню навігації, контент та багато іншого.

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!

Розробка прототипу це наступний крок після створення каркаса. На цьому етапі дизайнер вибирає кольори та стилі для сайту. Він заглиблюється в UI дизайн і закінчує планування сайту або програми, не забуваючи про потреби та побажання користувачів.

Дивіться також:

У цьому списку ви знайдете 11 найкращих інструментів для створення каркасу та прототипу нових сайтів, тем оформлення та додатків. Почнемо!

1.InVision

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $0 за 1 прототип
  • Підтримка платформ: Browser-Based; All Browsers

InVision є одним із найпопулярніших інструментів для розробки прототипів. Його використовую такі бренди як Twitter, Nike та Sony. Програмне забезпечення складається з простих drag-and-drop інструментів, які спрощують планування UX дизайну. Ви можете перевірити свій прототип у браузері, смартфоні та навіть у режимі реального часу. InVision також створений для взаємодії та з підтримкою таких хмарних сховищ як Dropbox, Google Drive та Slack.

2.UXPin

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • UXPin має безкоштовний тариф.
  • Настільний додаток, інструмент «Перо», «Змінні та умовні взаємодії», «Локальні шрифти» та запити API.
  • Підтримка платформ: Browser-Based; All Browsers

UXPin - це багатофункціональний інструмент, який дозволяє будувати каркаси та макети до створення прототипів UX дизайну. Це ще один чудовий інструмент у режимі онлайн для команди розробників. У ньому можна представляти ваш дизайн іншим членам команди, замовникам та вносити зміни в режимі реального часу. Його використовують Microsoft, NBC та USA Today.

3.Додаток Marvel

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $0 для базових функцій
  • Підтримка платформ: Safari; Chrome; Firefox

Marvel App — інструмент, який дозволяє проектувати структуру веб-сайту до розробки UX дизайну для сайтів і додатків з адаптивним дизайном. Ви можете вигадати власні заставки або використовувати зображення, створені за допомогою Photoshop або Sketch. Цей інструмент також працює в режимі реального часу, що дозволяє членам команди та клієнтам залишати відгуки або створювати нотатки.

4.Гліффі

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $0 за 5 діаграм
  • Підтримка платформ: Browser-Based; All Browsers

Gliffy – це багатоцільовий інструмент для створення каркасів та блок-схем для нових сайтів. Компаніям можуть сподобатися інструменти блок-схем, а веб-дизайнери оцінять можливість створення простих дизайнів веб-сторінок.

5.Омніграффл.

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $49.99
  • Підтримка платформ: Mac та iOS

Цей багатоцільовий інструмент OmniGroup призначений не тільки для створення каркасів веб-сайтів. OmniGraffle дозволяє створювати основний каркас вашого сайту різними способами, у тому числі за допомогою iPad та Apple Pencil. Він має функцію розпізнавання форми для тих, хто воліє намалювати свій дизайн, а не використовувати інструмент drag-and-drop.

6.Мокери

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $0 за 1 проект
  • Підтримка платформ: Browser-Based; All Browsers, Chrome App Available

Moqups – це інструмент для створення каркасів та прототипів, що дозволяє створювати прості макети для сайтів до стадії UX дизайну. Ви можете підключити посилання, додати свої власні зображення, експортувати до файлів PDF/PNG та багато іншого. Це дуже зручний інструмент для того, щоб представити свої ідеї клієнтам та членам команди. Його використовують Opera, Intel та ВВС.

7.Заспокою

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $289 за одну ліцензію
  • Підтримка платформ: ОС Windows та Mac

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

8.JustInMind

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $19 на місяць
  • Підтримка платформ: ОС Windows та Mac

Цей популярний інструмент для створення каркасів та прототипів сайтів використовують Google, Adobe та Oracle. Він дозволяє не тільки повністю запланувати, як виглядатиме, відчуватиметься і функціонуватиме ваш сайт, але й розроблятиме мобільні та веб-додатки. Дизайнери можуть скористатися можливістю інтеграції інструментів для кращої роботи. Сюди входить Adobe Illustrator для плавного перенесення файлів SVG з Illustrator Justinmind.

9.Пересмішник

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $12 на місяць за 3 проекти
  • Підтримка платформ: Browser-Based; All Browsers

Mockingbird — це додаток для створення каркасу з простими функціями розробки прототипу UX дизайну. Для швидкого створення каркаса використовуйте інструмент drag-and-drop, за допомогою UI елементів можна зв'язати сторінки, а все це разом дасть вам можливість створити основу, стиль та карту сайту в одному інструменті.

10.HotGloo

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $14 на місяць за 2 проекти
  • Підтримка платформ: Browser-Based; All Browsers

HotGloo – це інструмент для створення каркасів та прототипів, його використовують такі компанії як NBCUniversal, Disney та Sky. Він відрізняється адаптивним створенням каркасів, повним списком UI елементів та готових UI трафаретів. Також відмінно підходить для використання командою розробників та погодження із замовником усіх етапів роботи.

11.Mockplus

11 інструментів для створення мокапів та прототипів ваших сайтів та веб-додатків

  • Ціни починаються від $10 на місяць
  • Підтримка платформ: ОС Windows та Mac

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

Джерело: wplift.com
inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!
Олексій Шевченко
редактор wpcafe
Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, який спеціалізується на створенні сайтів на WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/

Коментарі до запису: 2

Їжак в тумані:

Я б розглянув Adobe Fireworks як інструмент для прототипування.
Багато дизайнерів малюють прототипи просто у Photoshop за звичкою.

Артем:

7. Сокира

На день вийшла з бети 8-я версія. $289 вже не актуальна ціна. Зараз це $495)
Приєднуюсь до коментаря поряд. Adobe Fireworks також варто розглянути.

Додати коментар або відгук