Thực đơn...

Bản địa, nhưng thống nhất: Xmind nghĩ về thiết kế đa nền tảng như thế nào

Loading...

Nếu sử dụng Xmind trên nhiều thiết bị, bạn có thể đã cảm nhận được điều này—một chút lấn cấn khi chuyển đổi nền tảng. Các nút bấm trông hơi khác. Một tương tác không hoạt động như mong đợi. Không có lỗi gì xảy ra, nhưng cảm giác có gì đó không thuộc về nơi này.

Chúng tôi cũng cảm thấy vậy. Vì thế chúng tôi đã quyết định: Xmind phải mang lại cảm giác bản địa trên mọi nền tảng—không chỉ là hoạt động tốt, mà thực sự như đang ở nhà trên macOS, Windows, iOS và Android. Cùng một cấu trúc cốt lõi, cùng một tư duy hệ thống và cùng một trải nghiệm sản phẩm quen thuộc—nhưng khoác lên mình bộ trang phục phù hợp với nơi nó đang chạy.

Đây là cách chúng tôi đã làm điều đó.

Feels native, stays Xmind.

Vấn đề của hầu hết các ứng dụng đa nền tảng

Cách tiếp cận điển hình là: xây dựng một giao diện (UI) và phân phối nó khắp mọi nơi. Cách này rẻ hơn, nhanh hơn và duy trì được tính nhất quán. Hầu hết các ứng dụng đều làm vậy—và thành thật mà nói, hầu hết người dùng đều chấp nhận nó.

Kết quả là một ứng dụng chạy được trên mọi nền tảng nhưng không mang lại cảm giác bản địa trên bất kỳ nền tảng nào:

  • Người dùng Mac nhận ra nó không giống các ứng dụng Mac khác.

  • Người dùng Android nhận ra nó rõ ràng là phiên bản chuyển hệ từ iOS.

  • Không ai phàn nàn lớn tiếng, nhưng sự lấn cấn đó cứ âm thầm tích tụ.

Lựa chọn thay thế—thiết kế riêng cho từng nền tảng—nghe có vẻ đúng đắn nhưng hầu như không bao giờ xảy ra. Chi phí quá cao, mất quá nhiều thời gian, và các đội ngũ khi phải duy trì bốn thiết kế khác nhau cuối cùng sẽ bị quá tải và lại quay về một hướng thống nhất.

Chúng tôi không hài lòng với cả hai lựa chọn đó. Vì vậy, chúng tôi đã tìm kiếm một cách tiếp cận khác.

Cùng một ứng dụng, trang phục khác nhau

Hãy nghĩ về cách một người ăn mặc. Mặc vest tại một cuộc họp trang trọng, giản dị vào cuối tuần, mặc đồ thể thao vào sáng thứ Bảy. Ba diện mạo khác nhau—nhưng bạn nhận ra họ ngay lập tức. Bởi vì bản sắc của họ không nằm ở quần áo. Nó nằm ở cách họ đi đứng, cách họ nói chuyện, cách họ đối xử với mọi người.

Xmind hoạt động theo cách tương tự. Không phải mọi thứ đều phải nhất quán trên các nền tảng—nhưng những thứ cốt lõi thì luôn luôn như vậy.

Những gì thay đổi: vẻ bề ngoài

Xmind for Android interface showcasing Material Design 3 components—pill-shaped buttons, toggle switch, list cards, and a properties panel, set against a warm coral gradient background.

Hình dáng nút bấm, chất liệu, hiệu ứng chuyển động, thậm chí cả văn phong—những thứ này tuân thủ hoàn toàn theo quy chuẩn riêng của từng nền tảng.

Nền tảng

Giao diện thực tế

macOS

Các nút dạng viên thuốc, bảng Liquid Glass lơ lửng trên màn hình, không gian hiển thị rộng rãi

Windows

Hình học, các góc bo tròn vừa phải, thanh tiêu đề bản địa, câu chữ trực diện ("Nâng cấp" thay vì "Nâng cấp ngay")

iOS & iPadOS

Được cập nhật đầy đủ ngay ngày đầu tiên của mỗi bản phát hành hệ điều hành lớn—khi bạn nâng cấp hệ điều hành, Xmind đã thuộc về hệ thống mới đó

Android

Được xây dựng lại dựa trên Material Design 3—các cử chỉ, hiệu ứng chuyển cảnh và hành vi của bảng điều khiển được căn chỉnh lại để phù hợp với cách người dùng Android thực tế di chuyển

Xmind for macOS displaying the Liquid Glass design language, with a translucent properties panel floating above a mind map canvas, surrounded by soft floral imagery.

Điều này nghe có vẻ tốn nhiều công sức hơn, và thực tế đúng là như vậy. Nhưng đó là cách duy nhất để Xmind mang lại cảm giác thuộc về từng nền tảng, chứ không chỉ đơn thuần là chạy trên đó.

Những gì giữ nguyên: cấu trúc

Nơi đặt các công cụ, cách sắp xếp tính năng, cách bạn di chuyển giữa các Sơ đồ—những thứ này hoàn toàn giống nhau, ở mọi nơi.

Thanh điều hướng ở trên cùng. Vùng làm việc ở trung tâm. Bảng thuộc tính ở bên cạnh trên máy tính để bàn, vuốt lên từ dưới cùng trên thiết bị di động. Các tab Sơ đồ nằm dọc phía dưới.

Chuyển từ Mac sang iPad và bạn không cần phải học lại điều gì. Ứng dụng trông có vẻ khác, nhưng nó hoạt động đúng như phiên bản Xmind bạn đã biết. Sự nhất quán vô hình đó là thứ giúp vẻ bề ngoài thay đổi tự do mà không bao giờ khiến người dùng cảm thấy bỡ ngỡ.

Những gì không bao giờ thay đổi: giá trị cốt lõi

Bên dưới mọi thứ, có một vài nguyên tắc luôn được giữ cố định bất kể nền tảng hay ngôn ngữ thiết kế mới nào mà Apple hay Google sẽ phát minh tiếp theo:

  • Vùng làm việc luôn là nhân vật chính. Giao diện (UI) lùi lại phía sau.

  • Các tính năng phức tạp sẽ xuất hiện khi bạn cần và ẩn đi khi bạn không cần.

  • Hoàn tác (Undo) là vô hạn—sáng tạo cần có sự tự do để thử nghiệm mà không lo làm hỏng mọi thứ.

  • Tốc độ luôn đi trước vẻ đẹp, trong mọi trường hợp. Không có hiệu ứng chuyển động hay chi tiết hình ảnh nào đáng để làm ứng dụng chạy chậm đi.

Đây không chỉ là các quyết định thiết kế. Chúng gần như là những lời hứa.

Lý do chúng tôi có thể duy trì tất cả những điều này

Sau khi đọc hết những điều này, một câu hỏi hợp lý là: bốn nền tảng, bốn ngôn ngữ hình ảnh, các quy chuẩn khác nhau ở khắp mọi nơi—làm thế nào bạn thực sự quản lý được điều đó mà không để mọi thứ rối tung lên?

Hai năm trước, chúng tôi đã đưa ra một quyết định mà lúc đó có vẻ chưa quá cấp bách: xây dựng một hệ thống thiết kế (Design System) bài bản cho Xmind.

Vấn đề cốt lõi mà nó giải quyết rất dễ giải thích nhưng lại cực kỳ khó thực hiện: xử lý mọi sự khác biệt của các nền tảng tại một nơi duy nhất, để phần còn lại của sản phẩm không cần bận tâm đến. Cùng một nút bấm chỉ tồn tại một lần trong hệ thống của chúng tôi. Trên macOS, nó biến thành dạng viên thuốc. Trên Windows, nó biến thành hình chữ nhật bo góc. Một thay đổi, áp dụng ở mọi nơi—không cần lục tìm trong các tệp tin, không cần sửa một lỗi bốn lần, không lo bị lệch pha.

Không có nền tảng đó, không có gì chúng tôi vừa mô tả ở trên có thể duy trì lâu dài. Mỗi bản cập nhật sẽ trở thành một cuộc tranh luận về việc nền tảng nào sẽ được sửa lỗi trong chu kỳ này. Mỗi tính năng mới sẽ tạo ra bốn phiên bản hơi khác nhau và dần mất đi cảm giác của cùng một sản phẩm. Cuối cùng, mọi người sẽ ngầm đồng ý rằng chi phí duy trì là quá đắt—và tất cả lại quay về một giao diện duy nhất dùng chung cho mọi nơi.

Hệ thống thiết kế là thứ giúp việc làm đúng không chỉ khả thi, mà còn có thể lặp lại liên tục.

Bạn sẽ không bao giờ nhận thấy nó một cách trực tiếp. Đó chính là mục đích của nó.

Kết luận

Một phiên bản Xmind mới sắp ra mắt.

Nó trông đẹp hơn. Nhưng mô tả trung thực hơn là: chúng là kết quả của hai năm làm việc mà không phải lúc nào cũng dễ nhận thấy từ bên ngoài—tìm hiểu kỹ lưỡng từng nền tảng, xây dựng nền tảng để duy trì nó và cam kết với ý tưởng rằng bạn không cần phải thỏa hiệp chỉ vì bạn sử dụng nhiều hơn một thiết bị.

Chúng tôi sử dụng Xmind mỗi ngày, trên các thiết bị khác nhau. Chúng tôi không chấp nhận những trải nghiệm chỉ ở mức "tạm được". Vì vậy, chúng tôi cũng không muốn bạn phải chấp nhận điều đó.

Hãy tự mình trải nghiệm.

Cách tốt nhất để hiểu cảm giác như ứng dụng gốc là mở Xmind trên thiết bị bạn đang dùng ngay bây giờ.

Hãy tự mình trải nghiệm.

Cách tốt nhất để hiểu cảm giác như ứng dụng gốc là mở Xmind trên thiết bị bạn đang dùng ngay bây giờ.

Bài viết khác