» » Nguyên tắc thiết kế chuyển động trong UI

Nguyên tắc thiết kế chuyển động trong UI

Thứ Năm, 11 tháng 9, 2014
Bài viết này là một quan sát về những nguyên tắc đơn giản trong việc tạo chuyển động trong thiết kế giao diện. Không có nhiều tài liệu về lĩnh vực này trong thiết kế giao diện mobile và những gì trong bài là những gì tôi cho là có giá trị dựa trên quan sát của mình.

Những nguyên tắc cơ bản mà tôi chú ý là việc nó là gì và tại sao hơn là làm cách nào để tạo ra chuyển động/hoạt hoạ. Với việc nhấn mạnh vào chuyển động (cám ơn rất nhiều vì sự thiết kế tinh vi của iOS7), điều quan trọng của nó là kết hợp với tương tác phù hợp và đúng mục đích như những khía cạnh khác của thiết kế UI.



Với việc từ bỏ kiểu thiết kế mô phỏng thực tế (skeuomorphic), sự tự do dành cho nội dung và không hạn chế việc sáng tạo. Những gì vụng về và đôi khi không theo quy luật vật lý vẫn tồn tại. Nhưng lúc này kỹ thuật đã giúp cho việc thiết kế chuyển động trong thiết kế UI mobile trở thành một phần của công việc.
1. Phong cách cá nhân

Nguyên tắc ưu tiên lớn nhất là bất cứ chuyển động (motion) hay hoạt hoạ (animation) cần phải ở tiêu chuẩn cao nhất nếu có thể.

Các ứng dụng nên có cái nhìn "out of the box – bên ngoài chiếc hộp" đối với các giải pháp chuyển động và tạo ra một thứ gì đó chưa từng nói tới và thật sự thu hút.

Trong các ứng dụng, các chuyển động cần truyền đạt một phong cách đa dạng, trong khi vãn giữ được sự thống nhất xuyên suốt. Hành xử xứng đáng sẽ giúp duy trì tình trạng ổn định với người dùng và nắm bắt sự liên kết của họ đi kèm với trải nghiệm.
2.Định hướng
Chuyển động nên giúp người dùng dễ dàng thông qua các trải nghiệm. Nó sẽ tạo ra các "không gian vật lý" của ứng dụng bằng cách mà các vật thể xuất hiện và mất đi hoặc bắt đầu được nhìn thấy.

Nó sẽ hỗ trợ luồng hành động, cung cấp hướng dẫn rõ ràng trước, trong và sau khi sử dụng. Nó nên phục vụ như một người hướng dẫn, giữ người dùng định hướng và ngăn ngừa họ mất hứng, giảm nhu cầu về các yếu tố đồ hoạ được thêm vào nhằm giải thích nơi họ đang đứng (trong app) hoặc họ đã ở đâu.
3. Bối cảnh
Chuyển động nên cung cấp bối cảnh phù hợp với nội dung trên màn hình bằng cách liệt kê chi tiết các trạng thái vật lý của những hình sử dụng và môi trường mà chúng được dùng. Do không sử dụng kiểu Skeuomorphism, thiết kế UI tự do để hành xử theo bất cứ kiểu gì mà nhìn có vẻ trái ngược với bối cảnh của nó.

Thêm một nét hay biến dạnh thành một đối tượng hoặc áp dụng tính quán tính cho một danh sách kéo đơn giản có thể khiến trải nghiện thú vị và gắn bó hơn.
4. Linh hoạt
Chuyển động nên linh hoạt và trực quan. Nó nên phản ánh theo một cách mà trấn an người dùng hơn là khiến họ ngạc nhiên và làm họ rối mắt. Các phản ứng của UI, với hành động người dùng nên dễ hiểu.
5. Cảm xúc
Chúng nên gợi lên một phản ứng tích cực, có thể là một cảm giác thoải mái từ một hành động roll mượt mà hay gây sự phấn khích vì sự chuyển trang xảy ra.
6. Kiềm chế
Có ý tưởng rõ ràng và tránh gây mất tập trung người dùng quá nhiều với các chuyển động, tinh tế là chìa khoá của vấn đề. Cần dùng nó để duy trì sự tập trung chứ không phải gây phiền nhiễu.

Theo Công Nghệ
Trường Arena Multimedia cung cấp chương trình đào tạo cập nhật và toàn diện, bao quát tất cả các lĩnh vực của Mỹ thuật Đa phương tiện, bám sát các ứng dụng thực tế và yêu cầu thiết yếu của ngành công nghiệp sáng tạo và giải trí.


Tags:
Chia sẻ:
Chia sẻ

Comments[ 0 ]


Đăng nhận xét