- 2010
Інструменти побудови прототипів і каркасів сайтів
10.10.2011
Каркас сайту є одним з основних ескізних проектів, які розробляються перед виготовленням оригінал-макету сайту, і використовується при розробці дизайну сайтів, щоб показати структуру сайту, що настроюється користувачем, найважливіші елементи інтерфейсу користувача, їхнє становище і взаємозв’язок між сторінками сайту.
Каркаси сторінок сайту відображають в чорно-білому кольорі найбільш важливі елементи інтерфейсу, такі як заголовок і нижній колонтитул сайту, форма контактів, навігація і т.п.
Каркасне моделювання — це процес, який може значно скоротити час, необхідний для проектування та розробки, усуваючи потенційні візуальні відволікаючі фактори і фокусуючи увагу розробників проекту на базовій функціональності і стратегічних чинниках маркетингу.
Ось декілька ключових причин, що визначають, чому перед створенням сайту бажано спочатку зробити його прототип:
- Це дозволить отримати чітку картину того, яка саме інформація буде необхідна на кожній сторінці сайту до розробки його дизайну.
- Це дозволить раціонально витрачати час і зосереджуватися саме на тому, для чого призначена кожна сторінка. Ретельне планування має першорядне значення
- Це дозволить вам підстрахувати себе, у разі необізнаних клієнтів, які схильні змінювати свою думку на стадії розробки проекту. Якщо сайт належним чином планується на етапі каркасного моделювання, то функціональність окремих сторінок не повинна сильно змінитися.
- Це дозволить встановити точку відновлення. Коли клієнт підписує каркасну модель, це означає, що він погоджується з тим, що буде перебувати на цій сторінці.
- Проінформованість клієнта також відіграє тут важливу роль, і він повинен знати, що зміна вже підписаних елементів на каркасній моделі може (з дуже великою ймовірністю) збільшити бюджет.
- Це дозволить отримати чітке уявлення про те, як будуть реагувати відвідувачі на сайт без колірної схеми або елементів дизайну
- Це дозволить видалити зайві елементи, які можуть виявитися непотрібними для майбутнього сайту.
- Прототип досить легко створити, дозволяючи плавно і ефективно здійснювати процес планування.
- Цей процес знижує ймовірність збільшення обсягу роботи з розробки дизайну.
- Це дає дизайнеру чітке уявлення про те, що потрібно зробити.
- Це дозволяє інтенсивно залучити клієнта в процес планування на ранньому етапі розробки сайту, а також активно узгоджувати весь процес планування між обома сторонами.
У цій статті ми розглянемо декілька нових рішень з розробки прототипів і каркасного моделювання.
1. Omnigraffle
OmniGraffle допоможе Вам швидко створити чудові графічні документи шляхом з’єднання ліній з фігурами навіть, якщо вони переміщуються, і передбачає інструменти моделювання, файли імпорту та експорту Microsoft Visio, а також найпростіша побудова діаграм всього одним кліком миші.
2. ConceptDraw Pro
ConceptDraw PRO — це повнофункціональна платформа діаграмного зображення, яка дозволяє відображати, передавати і динамічно подавати інформацію.
3. Pidoco
Pidoco — це об’єднаний інструмент каркасного зображення і створення прототипу графічного інтерфейсу користувача в реальному часі, який використовується для поліпшення програмних проектів, оскільки він економить час і знижує ймовірність доопрацювання. Picodo також збільшує розмір прибутку фірм внаслідок того, що знижує витрати і підвищує практичність.
4. Balsamiq Mockups
Balsamiq Mockups — це інструмент побудови каркаса, розроблений спеціально для відтворення проектів, намальованих від руки, дозволяючи швидко і легко оновити властивості програм, таких як Microsoft Word.
5. Mockingbird
Mockingbird — це інструмент в режимі онлайн, що дозволяє легко створювати, зв’язувати, попередньо переглядати і передавати моделі Вашого веб-сайту або програми.
6. Pencil
Проект Pencil призначений для побудови вільного і відкритого інструменту створення діаграм і прототипів графічного інтерфейсу користувача, який може використовувати кожен.
7. iPlotz
За допомогою iPlotz можна створювати керовані (активуються кнопкою) каркаси для створення образу веб-сайту або програмного забезпечення. Ви також зможете отримувати коментарі від інших осіб з приводу проектів, і як тільки все буде готово, керувати завданнями по побудові проекту для розробників та проектувальників.
8. ProtoShare
ProtoShare — це об’єднаний інструмент в режимі онлайн для побудови каркасів веб-сайтів та динамічних, керованих прототипів веб-сайтів , які потім члени команди можуть переглядати, а також коментувати в режимі реального часу.
9. HotGloo
Hot Gloo — це додаток для створення каркаса в режимі онлайн, який в даний час також є безкоштовною бета-версією. Ви можете перетягувати і вставляти елементи, масштабувати, об’єднувати, називати і перейменовувати їх. Також Ви зможете редагувати, коментувати і передавати будь-який елемент процесу розробки колегам і клієнтам.
10. MockFlow
Проектні, об’єднані (в реальному часі) моделі інтерфейсів користувача для Вашого програмного забезпечення та веб-сайтів.
11. Gliffy
Безкоштовне програмне забезпечення для побудови каркасу Gliffy дає можливість простого створення каркасів веб-сайтів та передачі веб-моделей . Ви можете також експортувати свій каркас для майбутнього використання в інших програмах.
12. Cacoo
Cacoo — це зручний для користування онлайн-інструмент для малювання, який дозволяє створювати безліч діаграм, таких як карти сайту, каркаси та мережеві діаграми.
13. Creately
Потужний і простий для використання діаграмний онлайн-інструмент, який працює прямо у Вашому веб-браузері . Завдяки інтуїтивному інтерфейсу користувача та вбудованим властивостями спільної роботи, Creately полегшує роботу з командами.
14. Lovely Charts
Lovely Charts — це додаток для створення діаграм, що дозволяє створювати професійні діаграми всіх видів, такі як блок-схеми, карти сайтів, бізнес-процеси, організаційні структури, каркаси та багато іншого...
15. Mockup Builder
MockupBuilder — це новий погляд на рішення старої проблеми створення прототипів і надання начерків клієнтам.
16. Lucid Chart
Створюйте діаграми і креслення, такі як блок-схема, діаграма ідей, мережева діаграма, діаграма UML, каркас, проект інтерфейсу користувача та інші креслення в режимі онлайн за допомогою безкоштовного програмного забезпечення, призначеного для створення блок-схем.
Джерело: 14 Prototyping and Wireframing Tools for Designers
Мітки: технічне завдання, проектування, прототипування
Сюди
Туди
