Balsamiq Mockups - Giới thiệu

Cài đặt Balsamiq

Để cài đặt Balsamiq, hãy đảm bảo rằng bạn có các yêu cầu sau.

Để chạy Balsamiq trên máy tính của bạn, cần chạy Adobe Air 2.6. Nó hoạt động tốt trên hầu hết các máy tính và hệ điều hành. Các yêu cầu hệ thống tối thiểu cho Adobe Air 2.6 được đưa ra dưới đây:

Cho cửa sổ

Bộ xử lý tương thích x86 2,33GHz hoặc nhanh hơn hoặc bộ xử lý Intel Atom ^TM 1,6GHz trở lên cho các thiết bị netbook.
Microsoft® Windows Server 2008, Windows 7, Windows 8 Classic hoặc Windows 10.
RAM tối thiểu 512MB (khuyến nghị 1GB).
AIR SDK Development Hỗ trợ Microsoft® Windows 7 trở lên, chỉ 64-bit.

Đối với Mac

Bộ xử lý Intel® Core ^TM Duo 1.83GHz hoặc nhanh hơn.
Mac OS X v10.7 trở lên.
RAM tối thiểu 512MB (khuyến nghị 1GB).
AIR SDK Development hỗ trợ Mac OS 10.9 trở lên, chỉ 64bit.

Liên kết tham khảo - Yêu cầu hệ thống Balsamiq

Tải xuống Balsamiq

Chúng ta có thể tải xuống Balsamiq từ liên kết sau - Balsamiq Mockups cho Máy tính để bàn Balsamiq có sẵn trên Windows và Mac OS.

Giao diện người dùng

Sau khi quá trình cài đặt hoàn tất, chúng ta có thể mở Balsamiq từ máy tính của mình. Chúng ta sẽ thấy màn hình sau đây lần đầu tiên khi chúng ta chạy Balsamiq.

Như thể hiện trong ảnh chụp màn hình ở trên, giao diện người dùng cho Balsamiq được chia thành bốn phần sau.

Navigator
Thư viện giao diện người dùng
Inspector
Không gian khung dây / Diện tích

Trong ảnh chụp màn hình, phần được đánh dấu màu đỏ là nút chuyển đổi cho các phần Thanh tra / Thông tin dự án. Dựa trên sự lựa chọn, chúng ta sẽ có thể thấy Thanh tra / phần thông tin dự án (3).

Thư viện giao diện người dùng

Như thể hiện trong ảnh chụp màn hình sau, Thư viện giao diện người dùng được phân loại theo các phần tử màn hình khác nhau. Bạn có thể cuộn theo chiều ngang trên phần “Tất cả” và tìm hiểu về các thành phần màn hình có sẵn trong Balsamiq.

Hãy để chúng tôi làm quen với các danh mục yếu tố màn hình cơ bản khác nhau có sẵn trong Balsamiq.

All- Điều này bao gồm tất cả các yếu tố giao diện người dùng có trong Balsamiq. Bạn có thể cuộn theo chiều ngang để xem / sử dụng chúng.
Assets - Với mục đích giới thiệu, đây là những nội dung tùy chỉnh do người dùng tải lên.
Big- Danh mục này bao gồm các phần tử màn hình, có kích thước / hình thức cao hợp lý. Bạn có thể thấy các phần tử như trình giữ chỗ, cửa sổ trình duyệt, iPad, iPhone trong danh mục này.
Buttons- Nó bao gồm tất cả các nút điều khiển được sử dụng trong wireframe di động / web. Ví dụ điển hình sẽ là nút hành động, hộp kiểm, v.v.
Common - Đây là các hình dạng / điều khiển khác nhau được sử dụng để biểu thị các tương tác phổ biến nhất.
Containers - Như tên cho thấy, nó bao gồm Cửa sổ, Tập hợp Trường, Trình duyệt, v.v.
Forms - Tất cả các điều khiển giao diện người dùng liên quan đến biểu mẫu đều có trong danh mục này.
Icons- Tại bất kỳ thời điểm nào, bạn có thể cần biểu thị một thao tác cụ thể bằng một biểu tượng. Ví dụ, trước đây, chúng ta có biểu tượng đĩa mềm với nút Lưu. Danh mục điều khiển này sẽ cung cấp cho bạn các biểu tượng cần thiết cho hoạt động này. Balsamiq có một bộ sưu tập khổng lồ các biểu tượng; hãy kiểm tra chúng!
iOS - Các điều khiển giao diện người dùng, dành riêng cho hệ điều hành di động Apple iOS, có sẵn trong danh mục này.
Layout- Khi đại diện cho một trang / tính năng cơ bản, điều quan trọng là phải đại diện cho bố cục cơ bản. Bố cục danh mục bao gồm hầu hết chúng, chẳng hạn như Tab Accordian, Ngang / Dọc, v.v.
Markup- Giả sử bạn muốn thêm nhận xét về một điều khiển cụ thể trong wireframe. Hộp nhận xét có sẵn trong đánh dấu. Ngoài ra, chú thích được sử dụng để hiển thị liên kết trong nhiều trường hợp. Nó có sẵn trong Danh mục Đánh dấu.
Media - Khi nói đến hiển thị hình ảnh / âm thanh trong wireframe của chúng tôi, các điều khiển giao diện người dùng liên quan có sẵn trong danh mục Phương tiện.
Symbols - Các ký hiệu là các thành phần có thể tái sử dụng, có thể giảm thời gian tạo ra các phần tử chung nhất.
Text - Như tên gọi, tất cả các điều khiển giao diện người dùng liên quan đến văn bản hoặc đoạn văn, chẳng hạn như Thanh liên kết, Khối văn bản, Hộp tổ hợp đều có sẵn trong danh mục này.

Trong chương tiếp theo, chúng tôi sẽ thực hiện dự án đầu tiên ở Balsamiq.