it-swarm-vi.tech

Làm thế nào để hình dung khả năng của drag'n'drop?

Ứng dụng web của tôi chứa danh sách các thành phần, có thể được sắp xếp theo drag'n'drop. Làm thế nào tính năng này nên được đại diện trực quan cho người dùng?

56
Witek

Tôi đã sử dụng một ít họa tiết "có thể kẹp" trên các công cụ để cho thấy rằng nó có thể kéo được. Đây là kết cấu của Gmail:

enter image description here

37
Ken Mohnkern

Tôi đã xem một bài thuyết trình của Sean Kane từ Netflix vài năm trước, trong đó anh ấy mô tả cách hoạt động của hàng đợi DVD. Bạn nên nghiên cứu nó nếu bạn có thể (nếu bạn có tài khoản hoặc biết ai đó làm như vậy).

Một vài điểm cần lưu ý:

  • Ông cho biết con trỏ di chuyển mặc định không kiểm tra rất tốt, vì vậy họ đã chuyển sang con trỏ lấy , như được đề xuất bởi GoodEnough .

  • Kéo và thả là một cải tiến lũy tiến. Bạn vẫn có thể sắp xếp bằng cách điền vào các hộp văn bản trong cột thứ tự danh sách. Nhiều người dùng không bao giờ nhận thấy tính năng kéo và thả có sẵn.

  • Không có tay cầm kéo. Bạn có thể bắt đầu kéo với mousedown ở bất kỳ đâu trong hàng (trừ trường hợp một đối tượng khác, chẳng hạn như liên kết, nằm ở phía trước) .

27
Patrick McElhaney

Có một biểu tượng tiêu chuẩn gồm ba đường kẻ ngang chồng lên nhau, ngụ ý các mục có thể được kéo và thả.

Nó ngụ ý "ma sát" hoặc "xử lý" và hơi giống với các đường chéo ở góc dưới bên phải của cửa sổ hoặc hộp văn bản cho phép thay đổi kích thước chúng.

14
Dan Barak

Con trỏ di chuyển thường được sử dụng với các mục có thể kéo trong các ứng dụng web.

css:

cursor:move;
11
Sruly

Tôi đề nghị bạn sử dụng bàn tay kẹp nhỏ (mở khi di chuột, đóng trong khi kéo). Có một số loại biểu tượng kẹp (một tay cầm) trông giống như một cái gì đó có thể lấy được (trong Gmail, đó là một cặp cột chấm (4 chấm trên mỗi cột).

Tôi cũng đề nghị bạn nên thêm một hoạt hình nhỏ thể hiện hành vi cho người dùng mới (hoặc người dùng hiện tại nếu đó là một tính năng mới), đừng liên tục hiển thị hoạt hình mỗi khi có người dùng trong ứng dụng của bạn.

6
mbillard

Kéo là một kéo. Sau khi hoàn thành việc cải tiến một vài UI kéo và thả, tôi thực sự đi đến kết luận rằng lần sau tôi sẽ thay đổi chúng thành một loại nhấp chuột và thả ra. Có một widget trên mỗi mục mà bạn nhấp để chọn nó để di chuyển. Sau đó, bạn nhấp vào nơi bạn muốn nó đi. Điều này dường như sẽ tốt trong thử nghiệm cho đến nay.

5
Robert Fisher

Khi di chuyển con trỏ qua các đối tượng có thể kéo, cần thay đổi nó thành một bàn tay mở. Khi một đối tượng bị nắm lấy, nó nên được thay đổi thành một bàn tay nắm lấy. Trong khi lấy một đối tượng, các vùng thả được phép có thể được nhấn mạnh từ nền khác (tức là thông qua tô bóng hoặc tô màu).

1
txwikinger

Biểu tượng xoáy nước phổ quát có thể là ?.

Ứng dụng máy tính để bàn tôi làm việc với cho phép các tệp bên ngoài ứng dụng có thể được kéo vào. Một số ứng dụng cho phép kéo thả thường có khu vực thả hoặc ngăn nội dung; giống như một danh sách nhạc trong một máy nghe nhạc. Khả năng sử dụng kéo-thả là một tiết lộ tiến bộ nhưng một số người dùng sẽ không bao giờ có được nó bằng trực giác. Trong những trường hợp như vậy, điều tốt nhất tôi có thể nghĩ đến khi quảng cáo khu vực thả là bằng cách có nền biểu tượng xoáy nước.

0
Vishnu Prasanth

Tôi đang tự mình giải quyết vấn đề này bằng một ứng dụng máy tính để bàn. Giải pháp tốt nhất tôi có thể đưa ra vào lúc này là có một mũi tên khi di chuột, chỉ đơn giản là chỉ vào nơi mà đối tượng có thể được kéo đến, với một số văn bản có nội dung kéo và thả, hoặc tương tự.

0
James Ludlow