20 công cụ wireframing tốt nhất - phần 1

20 công cụ wireframing tốt nhất - phần 1
      Accelerated Mobile Pages

Để giúp việc tạo ra ứng dụng hay trang web một cách hiệu quả và đơn giản hơn, tạp chí web hôm nay xin giới thiệu đến bạn đọc 20 công cụ wireframing tốt nhất hỗ trợ bạn trong quá trình thiết kế web.

Để giúp việc tạo ra ứng dụng hay trang web một cách hiệu quả và đơn giản hơn, tạp chí web hôm nay xin giới thiệu đến bạn đọc 20 công cụ wireframing tốt nhất hỗ trợ bạn trong quá trình thiết kế web.


1. Balsamiq Mockups


Balsamiq Mockups

Công cụ Wireframing Balsamiq Mockups là một công cụ thiết kế web yêu thích trong cộng đồng thiết kế web


  Hệ điều hành: Mac, Linux, Windows và web - based

  Giá: $ 79


Balsamiq Mockups bao gồm các yếu tố kéo - thả, từ các nút bấm cho đến dạng list, mỗi kiểu đều giống như được vẽ bằng tay. Một điều cơ bản của công cụ này là gây khó khăn khi tạo các mock-ups và chúng có độ trung thực thấp, điều này nhằm khuyến khích càng nhiều những thông tin phản hổi càng tốt.


2. Axure


Axure

Axure cho phép bạn tạo ra mock-ups HTML tương tác cho cả các trang web và các ứng dụng


  Hệ điều hành: Mac & Windows

  Giá: 289 $ - 589 $


Cũng như tạo ra các mock-up, Axure cho phép bạn thêm chức năng cho việc sắp xếp và tạo Prototype tương tác. Các tính năng của công cụ wireframing này bao gồm sitemap và ‘widgets’ đa dạng trong các form của nhiều giao diện người dùng khác nhau. Mock-ups HTML tương tác có thể được tạo ra cho cả website và apps, bạn thậm chí có thể xem thiết kế ứng dụng của mình trên điện thoại với việc tích hợp sẵn một chức năng chia sẻ.


3. Pidoco


Pidoco

Pidoco bao gồm một thư viện tiện dụng của các yếu tố giao diện kéo-và-thả


  Nền tảng: Web-based

  Giá: $ 9 $ 59 mỗi tháng


Pidoco tương tự như Axure, công cụ bao gồm các thư viện của các yếu tố giao diện kéo-thả khác nhau, cũng như chúng có khả năng thêm nhiều trang và lớp. Mẫu của bạn có thể được chia trực tiếp với khách hàng, có chức năng phản hồi và thảo luận. Xem mẫu của bạn trên điện thoại để dễ dàng tải ứng dụng Pidoco.


4. Viseo


Viseo

Giao diện Viseo sẽ quen thuộc nếu bạn đang sử dụng Microsoft Word hoặc Excel


  Nền tảng: Windows

  Giá: $ 599.95- $ 999


Sức mạnh thực sự của Viseo nằm trong sơ đồ kỹ thuật hơn là wireframing. Tuy nhiên, những người đã quen với các ứng dụng của Microsoft như word hoặc excel, giao diện này sẽ rất quen thuộc. Nó khá phiền phức, Viseo không phục vụ nhiều công cụ như Swipr, mà chúng cho phép bạn tạo và xuất ra các mẫu [HTML] hữu ích.


5. InDesign


InDesign

InDesign cho phép bạn sử dụng hình ảnh động và video trong wireframes của bạn


  Hệ điều hành: Mac, Windows

  Giá: £ 660,51


Bằng cách đưa hình ảnh động, video và trạng thái của đối tượng, nó dễ dàng tạo ra một mock-up cho website hoặc app trong các form của PDF với Indesign. Phần mềm này cũng bao gồm khả năng tạo các thư viện của các yếu tố trang, vì vậy bạn có thể tạo ra bộ sưu tập các biểu mẫu giao diện khác nhau.


6. iPlotz


iPlotz

Tạo wireframes Flash-powered với iPlotz


  Nền tảng: Web-based (Flash)

  Giá: miễn phí $ 79


iPlotz - công cụ wireframing dựa trên Flash cho phép bạn tạo wireframes có thể click với thành phần kéo - thả. Ngoài ra chức năng chính của nó bao gồm khả năng thêm các nhiệm vụ và ghi chú cho các nhà quản lý và lập trình.


7. Photoshop


Photoshop

Photoshop là môt công cụ wireframing


  Hệ điều hành: Mac, Windows

  Giá: £ 660,51 hoặc một phần của Adobe Creative Cloud


Photoshop không cung cấp các thư viện của yếu tố về giao diện, nhưng để thỏa mãn yêu cầu, wireframing nhanh, nó là một lựa chọn dễ dàng cho các nhà thiết kế. Ngay cả khi bạn không quen thuộc với các sản phẩm Adobe, việc phác thảo ra những ý tưởng nhanh chóng, nhóm gọp các yếu tố khác nhau và các lớp đủ khả năng thực hiện quy trình một cách rất nhanh chóng.


8. Fireworks


Fireworks

Với Fireworks, thật dễ dàng để sao chép phong cách thực hiện trong wireframe trong lần xây dựng cuối cùng


  Hệ điều hành: Mac, Windows

  Giá: £ 282,90    


Fireworks cho phép bạn thiết kế wireframes và prototypes cho web, cũng như các ứng dụng mobile và tablet. [CSS] bao gồm cả màu sắc, fonts và corner radius có thể được truy xuất, vì thế cách thức thực hiện trong suốt quá trình này có thể lặp lại trong lần triển khai cuối cùng. Các mẫu và biểu tượng khác nhau có thể gồm có fast wireframing .


9. Protoshare


Protoshare

Protoshare nhấn mạnh vào sự hợp tác trực tuyến


    Nền tảng: Web-based

    Giá: $ 290- $ 590


Protoshare là một công cụ trực tuyến, với việc tập trung vào sự cộng tác và chia sẻ. Nó bao gồm một thư viện các yếu tố kéo - thả, một sitemap và có khả năng sử dụng các tùy chỉnh CSS và chèn các phần tử mà bạn sở hữu. Do nhấn mạnh vào cách thức hợp tác trực tuyến, chúng không giống với các công cụ khác, nó không thể truy xuất ra file PDF, tuy nhiên nó được cân nhắc về các tính năng tạo mẫu của mình.


10. Penultimate


Penultimate

Wireframing cho một ứng dụng iPad? Sau đó sử dụng như một công cụ iPad!


    Platform: iPad

    Giá: 69p


Nếu bạn đang triển khai thiết kế trên ipad, phác thảo ra ý tưởng trực tiếp bên trong thiết bị là cách hoàn hảo để đảm bảo công việc bạn đang làm đúng với tỷ lệ và kích thước của khu vực hoạt động. Phác thảo và tạo ra ý tưởng có thể dễ dàng được lưu lại và được gửi cho khách hàng một cách chính thức.


Xem tiếp : Phần 2 - 20 công cụ wireframing tốt nhất.