Hãy cùng phân tích một ví dụ.
Sau vài năm đi làm tiết kiệm được một số tiền nhỏ, mình quyết định xây một căn nhà cho riêng mình.
Để xây dựng một cách chuyên nghiệp bài bản, mình thuê kiến trúc sư về, thảo luận với họ những mong muốn của mình khi xây căn nhà ấy, từ chung chung nhất đến cụ thể chi tiết nhất, kiểu như yêu cầu số tầng số phòng, các khu vực sinh hoạt chung và riêng, khu vực dành cho làm việc và học tập hay giải trí, các thiết kế và tone màu cho mỗi khu vực đi kèm với các thiết bị nội thất v.v…
Qua nhiều lần trao đổi, khi hai bên đã hoàn toàn hiểu rõ ý nhau, các kiến trúc sư ra về và khoảng một tháng sau gửi lại cho mình bản vẽ thiết kế căn nhà trong mơ.
Bản thiết kế ấy được xem như xương sống của căn nhà vậy.
Trên thực tế, việc xây dựng một sản phẩm online cũng gần tương tự như việc xây nhà trong ví dụ giả định phía trên này.
Sản phẩm online để thành hình cũng cần một “xương sống”, rồi từ đó sẽ thêm da thêm thịt và nhiều thứ khác nữa để trở thành một sản phẩm hoàn chỉnh.
Xương sống ấy chính là wireframe.
Có rất nhiều công cụ có thể sử dụng để vẽ wireframe, nhiều lắm. Tuy nhiên, ba công cụ quen thuộc với mình bao gồm UXPin, Mockflow và Axure.
Với UXPin, mặc dù đây không phải công cụ mình dùng nhưng lại là chỗ mình thường xuyên để mắt (có cả follow và add vào Favorites List trên Facebook), vì đơn giản team UXPin rất chăm chia sẻ những thông tin hay trong ngành. Ngoài ra, trên trang của UXPin còn có cả một thư viện về UX Design miễn phí. Châm ngôn của UXPin là: Knowledge wants to be free. (Yay!!!). Các bạn có thể vào thư viện tại đây.
Khác với UXPin, Mockflow và Axure mình đều đã từng dùng qua và hiện vẫn đang dùng. Mockflow mình sử dụng hồi còn làm ở Link Circle, nhưng chỉ dùng để vẽ wireframe các landing page đơn giản, và công việc lúc ấy cũng không yêu cầu phải sử dụng nhiều. Mockflow cho phép tạo wireframe online, tuy nhiên bộ công cụ bên trong không được đa dạng lắm.
Trái lại, Axure là công cụ mình sử dụng thường xuyên từ khi vào làm ở Fpt Online và mình đánh giá nó khá cao, a powerful tool.
Sau một khoảng thời gian gắn bó như thế, mình quyết định ghi lại một vài điều hay ho khi làm việc cùng Axure. Bài viết sẽ không phải dạng hướng dẫn sử dụng hay các kiến thức căn bản (cái này bạn có thể vào trang training của Axure để đọc).
I-Thư viện widgets:
Khi mới vào Axure lần đầu, bạn sẽ thấy bộ widget đã được tích hợp sẵn (thường là bên trái màn hình), sẵn sàng đợi bạn khởi tạo những thành phần đầu tiên trên trang.
Tuy nhiên, bộ widget này chỉ bao gồm các package cơ bản nhất, được chia thành các nhóm Common, Forms, Menus and Table, Flow với những element căn bản biểu thị Image, Header, Box, Button, Text Area, Shape v.v… như hình dưới.
Về cơ bản, bộ widget này đã đủ đáp ứng khoảng 70% những gì bạn cần khi vẽ wireframe. Nhưng trong nhiều trường hợp, bạn cần nhiều hơn thế, giả sử như khi cần biểu thị thành phần của các sản phẩm là app, hoặc cần biểu thị các trường dữ liệu liên quan đến Social Plug-in chẳng hạn.
Những lúc này, vẽ thủ công hoặc đi tìm icon trên mạng copy paste cũng là một lựa chọn, nhưng rất mất thời gian và lại không đem về kết quả đẹp mắt.
Thay vì làm như thế, bạn có một lựa chọn hoàn toàn khác, giúp công việc của bạn nhanh và dễ dàng hơn rất nhiều. Đó chính là Widget Library của Axure.
Chỉ với vài bước đơn giản, bạn có thể chiếm lĩnh hoàn toàn thư viện khổng lồ ấy như mình hướng dẫn dưới đây:
- Truy cập vào thư viện widgets của Axure tại đây.
- Download bộ widget mà bạn cần về máy.
- Vào phần Widgets trên Axure, chọn Load Library rồi chọn bộ widget mà bạn đã download phía trên (tập tin có đuôi .rplip)
- Lúc này, bộ widget đã được tích hợp vào thư viện riêng trên Axure của bạn. Để sử dụng, bạn vào Select Library. Lúc này, các bộ widget sẽ được hiển thị dạng listing cho bạn tùy ý chọn bộ cần dùng. Bạn cũng có thể chọn All Libraries để hiển thị cùng lúc tất cả.
Hình dưới đây minh họa cho bộ widget Social Media mà mình đã down về và load trên thư viện Axure.
![\"\\"axure\"](\"\\"https://phuongproduct.files.wordpress.com/2016/05/axure-31.png\\"\")
Sau khi đã chọn xong, bộ widget hiển thị sẵn sàng trong Select Library… ![\"\\"axure\"](\"\\"https://phuongproduct.files.wordpress.com/2016/05/axure-4.png?w=680\\"\")
… Bấm chọn xong thì hiển thị như thế này.
Thế là xong. Giờ đây bạn có thể sử dụng thoải mái các widget, icon chỉ với động tác kéo, thả. Chưa kể, nhiều bộ widget còn tích hợp sẵn dynamic panel cho bạn đỡ mất công khởi tạo, tuy nhiên việc này cũng đem lại hạn chế, là trong nhiều trường hợp, interactions được tích hợp sẵn trên đó không phải interactions mà bạn mong muốn và bạn phải tự mình sửa lại. Chỉ thế thôi. Còn lại thì rất tiện và tiết kiệm được nhiều thời gian.
Lưu ý: các bộ widget có biểu tượng ($) bên cạnh thì bạn phải trả phí mới download được. Các bộ widget không có biểu tượng đó thì free, nhưng trong vài trường hợp, nó bắt bạn chọn một trong hai option khi download: một là trả phí, hai là thực hiện một Social Media Interactions nào đó như share lên Facebook, hay follow trên Twitter rồi bạn sẽ được download free.
II-Cộng đồng Axure:
Axure có một forum dành cho cộng đồng user lên đó hỏi đáp, ý kiến các kiểu. Theo kinh nghiệm bản thân, ở Việt Nam mấy forum dạng này thường chả ai thèm lên, đìu hiu vô cùng, một phần vì người dùng ít gắn kết sâu với sản phẩm, hoặc họ thường chọn kênh khác để liên hệ như Facebook, gửi mail hoặc direct call. Một phần cũng vì ít công ty nào bỏ tiền đầu tư cho kênh forum kèm thêm một đội quản lý forum ấy.
Trái lại, forum của Axure vẫn hoạt động đều, mọi người rất hay hỏi và còn thích trả lời giùm câu hỏi của người khác nữa.
Đặc biệt, đội ngũ admin và mod của Axure rất đông, phản ứng rất nhanh. Không có câu hỏi nào đưa ra mà không có câu trả lời đầy đủ. Các bạn admin và mod thường có tên gắn thêm đuôi Axure (ví dụ mình mà là admin thì mình sẽ là Phương_Axure). Yên tâm là nếu một vấn đề nào đó mà admin Axure đã trả lời thì câu trả lời ấy là câu trả lời cuối cùng và đảm bảo được update thông tin theo những gì mới nhất đang chạy trên production.
Một khu vực có thể hữu ích cho các bạn từ level đang làm quen đến level master khi làm với Axure, đó là khu vực Tips, Tricks and Examples. Khu vực này chủ yếu gồm những threads được tạo bởi đội admin của Axure, với mục đích thông báo những nâng cấp, tính năng, thủ thuật, bộ tài liệu mới từ Axure official.
Nếu không muốn xem những thông tin này trên forum, bạn cũng có thể xem tại phần blog của Axure. Ở đây cũng cập nhật thông tin đầy đủ y chang vậy mà hình thức thể hiện chuyên nghiệp hơn, bắt mắt hơn. Vào đây để xem.
—
Ngoài ra, còn nhiều thủ thuật nhỏ nhỏ khác nữa. Mình sẽ tiếp tục update vào một ngày không xa.
—
Đọc thêm bài khác trên Mockplus – một trang khá hay về UX:
The Best Mockup & Wireframing Design Tools & Apps for UI/UX Designers
Xem thêm: Khóa học Product Management – Quản lý sản phẩm cho người mới bắt đầu
1 thought on “Review tool vẽ wireframe Axure”
Bạn có thể vui lòng liên hệ mình hỗ trợ mình 1 chút về những vấn đề liên quan đến phần mềm AXURE RP9 được không bạn? Mình chân thành cảm ơn và hậu tạ.
Số điện thoại của mình: 0984656677 (gặp Trí)
Comments are closed.