Trang chủ » UI / UX » 20 phần mềm miễn phí tốt nhất dành cho các nhà thiết kế chuyển động UX đầy khao khát

    20 phần mềm miễn phí tốt nhất dành cho các nhà thiết kế chuyển động UX đầy khao khát

    Các nhà thiết kế giao diện đang quan tâm nhiều hơn đến thiết kế UX với các mô hình hoạt hình mô phỏng các hành động của người dùng. Những mockup UX dựa vào chuyển động với các hiệu ứng hoạt hình để xác định Giao diện sẽ phản hồi như thế nào với đầu vào của người dùng.

    Hầu hết các nhà thiết kế UX học cách sử dụng phần mềm để tạo ra những hình ảnh động này. Hai lựa chọn phổ biến nhất là Adobe After Effects và Nguyên tắc (chỉ dành cho OS X). Bạn có thể thiết kế giao diện mockups trong một chương trình như Photoshop và chuyển UI vào các chương trình này cho hoạt hình.

    Nếu bạn thích tìm hiểu hoạt hình UX, thì những thứ miễn phí sẽ là một tài sản to lớn. Bạn có thể nghiên cứu công việc của người khác và chơi với thiết kế của họ để xem tất cả hoạt động như thế nào.

    Dưới đây bạn sẽ tìm thấy những ưu đãi tốt nhất cho người dùng Nguyên tắc và AE nhận được vào thiết kế chuyển động UX. Họ chắc chắn sẽ giúp bạn hiểu hoạt hình UX hoạt động như thế nào, và làm thế nào để xây dựng của riêng bạn.

    1. Xóa hành động

    Vuốt là một hành động rất phổ biến trong các ứng dụng di động cho các mục đích khác nhau. Hành động vuốt mặc định của iOS được sử dụng để hiển thị các tùy chọn thay thế để chỉnh sửa / xóa các mục, và đó chính xác là những gì bạn nhận được trong phần mềm miễn phí này được tạo bởi Ramil Derogongun.

    Bạn có thể tải xuống tệp AEP miễn phí cho After Effects và tự mình dùng thử. Giao diện người dùng tuân theo sơ đồ khung dây rất cơ bản với đầu vào của người dùng được hiển thị dưới dạng một chấm màu xanh. Những loại hành vi người dùng là tốt nhất để được hiển thị thông qua hoạt hình bởi vì nó cho các nhà phát triển một cơ hội để xem giao diện nên hoạt động như thế nào.

    2. Vuốt widget

    Đây là một mockup hoạt hình vuốt khác tập trung trên các mục giỏ hàng trong một slideshow. Được thiết kế bởi Leon Wu, hoạt hình vuốt miễn phí này đi kèm với tệp PRD được tạo cho Nguyên tắc.

    Hoạt hình cực kỳ đơn giản và cho thấy các mục nên di chuyển trên màn hình khi áp suất được áp dụng. Bạn cũng có cảm giác về hiệu quả nới lỏng Bất cứ khi nào hành động vuốt được phát hành.

    3. Giao diện người dùng Dualshock

    Đây là một hiệu ứng hoạt hình UX cực kỳ năng động được chia sẻ bởi Alexander Boychenko. Bản mockup này dựa trên Bộ điều khiển PlayStation cho giao diện người dùng ứng dụng di động. Nó bao gồm tệp Phác thảo và Nguyên tắc mà bạn có thể tải xuống miễn phí.

    Freebie này chỉ ra cách tạo hiệu ứng chuyển tiếp vuốt giữa các màn hình. Nhưng bạn cũng có thể thấy các yếu tố trang hoạt hình như thế nào trên màn hình theo nhiều hướng khác nhau.

    4. Hamburger Menu Hoạt hình

    Biểu tượng Hamburger vẫn là tất cả các cơn thịnh nộ trong giao diện di động. Biểu tượng menu này freebie thể hiện cách làm động biểu tượng ba thanh thành biểu tượng "X".

    nó là một lặp lại hoạt hình, vì vậy "X" cũng hoạt hình trở lại thành biểu tượng menu hamburger. Đây là một phần mềm miễn phí tuyệt vời để tìm hiểu về thao tác véc tơ cho các yếu tố UI.

    5. Snapster

    Mockup miễn phí này dành cho một ứng dụng di động có tên Snapster. Nó tập trung trên màn hình chào mừng / lên máy bay nơi người dùng có thể xem các bản giới thiệu của ứng dụng và tìm hiểu cách thức hoạt động của ứng dụng.

    Đó là tệp PRD và thật không may, tệp này không hoạt động tốt với After Effects, vì vậy chỉ người dùng Nguyên tắc mới có thể hưởng lợi từ tệp này..

    6. Đang tải Spinners

    Đây là AEP After Effects miễn phí cho spinners tải di động. Các loại GIF hoạt hình này trở nên rất phổ biến khi Ajax bắt đầu phát triển web chính thống.

    Bây giờ những bộ tải di động này là một tá, và thậm chí chúng có thể tùy chỉnh rất nhiều để phù hợp với các giao diện nhất định. Freebie này đi kèm với tệp AEP và tệp Phác thảo để chỉnh sửa các vectơ nếu bạn muốn sửa đổi chúng.

    7. Chơi / tạm dừng chuyển đổi

    Hiệu ứng chuyển tiếp thường có vẻ rất đơn giản nhưng thực sự đòi hỏi một lượng công việc tốt. Hoạt hình phát / tạm dừng này được tạo bởi Alex Pronsky là một ví dụ tuyệt vời.

    Với phần mềm miễn phí này, bạn có thể kiểm tra cách làm động các biểu tượng đường mỏng khác nhau thành hình dạng và biểu tượng. Một khi bạn học chương trình, việc thực hiện loại công cụ này sẽ trở nên dễ dàng hơn rất nhiều, vì vậy nó giúp bạn có được sự tự do cho việc nghiên cứu.

    8. Mockup iPhone

    Mặc dù phần mềm miễn phí này không trực tiếp chứa hoạt hình, nhưng nó có nghĩa là được sử dụng cho công việc sản xuất trên các ứng dụng iPhone. Đó là tệp AEP iPhone 5S miễn phí để sử dụng trong After Effects dưới dạng mẫu iPhone.

    Chỉ cần nhập mockup giao diện của bạn và tạo hình động trong After Effects. Sau đó, bạn có thể cắm nó vào mockup iPhone này để chia sẻ với nhóm của bạn.

    9. Mẫu iPhone

    Đây là một mẫu After Effects tùy chỉnh với một thiết kế iPhone hiện đại hơn. Phần mềm miễn phí có sẵn từ trang này tại UX in Motion.

    Tất cả mọi thứ trong mẫu là siêu dễ dàng để tùy chỉnh. Trên trang tải xuống, bạn cũng sẽ tìm thấy một phần có nhãn "Hướng dẫn bằng video" nơi bạn có thể tìm hiểu cách làm động ứng dụng.

    10. Hoạt hình vi mô

    Ngay cả những hình ảnh động ứng dụng nhỏ nhất cũng có thể ảnh hưởng lớn đến trải nghiệm người dùng. Freebie này hiển thị một "Thích" hoạt hình vi mô Bất cứ khi nào người dùng "thích" một bài đăng.

    Biểu tượng trái tim có hoạt hình riêng của nó với ảnh hồ sơ của người dùng được thêm vào chồng lượt thích. Freebie này chỉ dành cho Nguyên tắc và bạn cũng có một .di chuyển tập tin để tải về nếu bạn muốn.

    11. Ứng dụng ví

    Ví kỹ thuật số đang trở nên phổ biến hơn nhiều, và phần mềm miễn phí này giúp thiết kế dễ dàng hơn. Bạn nhận được một tệp Phác thảo với tất cả các yếu tố vectơ thô, cộng với tệp PRD miễn phí cho hoạt hình Nguyên lý.

    Freebie này được thiết kế bởi Serge Bykov như một dự án phụ nhỏ thú vị. Nhưng nó có thể rất giáo dục nếu bạn tách nó ra và làm việc với hoạt hình từng bước.

    12. Chuyển đổi iOS

    Với iOS 7 của Apple, thế giới có một công tắc được thiết kế mới cho các nhãn bật / tắt. Điều này dẫn đến nhiều hiệu ứng khác nhau bao gồm một hình ảnh động miễn phí bắt chước công tắc bật / tắt gốc.

    Trong tập tin này, bạn có được một hiệu ứng hoạt hình rất đơn giản với việc nới lỏng cơ bản. Công tắc di chuyển qua và nền chuyển sang màu xanh lục, sau đó hoàn nguyên trở lại khi tắt công tắc.

    13. Ứng dụng Ritter

    Đây là một phần mềm miễn phí tuyệt vời khác được phát hành bởi Serge Bykov cho cái mà anh gọi là Ứng dụng Ritter. Điều này bao gồm tệp Phác thảo miễn phí cho giao diện vectơ, cùng với tệp PRD miễn phí cho hoạt hình Nguyên lý.

    Bạn sẽ nhận được rất nhiều hình ảnh động khác nhau trong phần mềm miễn phí này, vì vậy tôi nghĩ nó sẽ hữu ích hơn cho một nhà thiết kế từ trung cấp đến cao cấp. Người mới bắt đầu cũng có thể học được rất nhiều từ nó, nhưng có thể có một đường cong học tập dốc.

    14. Mời bạn bè

    Chúng ta đều biết và yêu thích menu bay ra biểu tượng cộng của Google. Chà, Jardson Almeida đã tạo ra một menu Mời bạn bè dựa trên khái niệm Thiết kế Vật liệu đơn giản.

    Mọi thứ được thiết kế trong Phác thảo và được nhập vào Nguyên tắc cho hoạt hình. Bạn nhận được cả hai tệp dưới dạng miễn phí để tải xuống và đồ chơi xung quanh với.

    15. Vuốt thẻ

    Đây là một phần mềm miễn phí khác được tạo ra chỉ dành cho người dùng Nguyên tắc. Đây là một giao diện quẹt thẻ được tạo cho trình chiếu mục đích chung hoặc giao diện người dùng ứng dụng gốc.

    Tôi nghĩ rằng đây là phần mềm miễn phí hoàn hảo cho người mới bắt đầu học Nguyên tắc. Nó không quá phức tạp đến nỗi bạn sẽ cảm thấy lạc lõng, nhưng nó không đơn giản đến mức bạn sẽ cảm thấy tầm thường.

    16. Trò chuyện trên bản đồ

    Nhiều nhà thiết kế vẫn sử dụng Photoshop cho các giao diện, và điều này cũng đúng với bản đồ trò chuyện miễn phí này. Bạn có thể tải xuống tệp PSD cho giao diện và tệp PRD cho hoạt hình Nguyên tắc.

    Đây là một hình ảnh động đáng ngạc nhiên cho phong cách, nhưng nó vẫn trông tuyệt vời và hoạt động chính xác như bạn mong đợi trong một ứng dụng bản đồ / định vị địa lý đơn giản.

    17. Đang tải ứng dụng

    Ứng dụng di động thường sử dụng tải màn hình để nói với khách truy cập rằng một cái gì đó đang xảy ra trong phần phụ trợ. Một trong những sở thích yêu thích của tôi trong bộ sưu tập này là hoạt hình tải này được tạo bởi Roman Wagner.

    Nó tải các yếu tố cá nhân lân lượt tưng ngươi một khi màn hình tải đã kết thúc. Hoạt hình này rất mượt mà và hoàn toàn đáng tin cậy trong lĩnh vực thiết kế ứng dụng di động.

    18. Thẻ lên máy bay

    Người dùng lên máy bay là một bước quan trọng cho mọi ứng dụng di động mới. Thật tuyệt khi bao gồm một số hình ảnh động ở giai đoạn này, đó là lý do tại sao những hình ảnh động trên thẻ này có thể rất hữu ích cho các nhà thiết kế ứng dụng.

    Điều này được tạo bởi Austin Baird và được phát hành miễn phí để sử dụng cho bất kỳ dự án UI / UX nào.

    19. Trình diễn nguyên tắc

    Khi bạn đi sâu hơn vào Nguyên tắc, bạn sẽ học được rất nhiều kỹ thuật quy trình làm việc nâng cao. Một trong những điều miễn phí tốt nhất để tiến xa hơn là điều này được tạo ra cho nhóm sáng tạo Yalantis.

    Đây là một tài nguyên hoàn toàn miễn phí cho người dùng Nguyên tắc tải xuống và chơi cùng. Nó bao gồm một vài thủ thuật cho thấy làm thế nào để trở thành một chuyên gia trong hoạt hình Nguyên lý.

    20. Menu thả xuống

    Menu thả xuống thường sử dụng hình ảnh động điên rồ để thu hút sự chú ý của chúng tôi. Freebie này sử dụng miễn phí thả xuống cầu thang hoạt hình trên menu cho các yếu tố riêng lẻ để làm cho chúng thả như cầu thang.

    Điều này có thể không hữu ích cho tất cả mọi người nhưng chắc chắn đây là một cách tuyệt vời để tìm hiểu về hoạt hình giao diện After Effects.

    Từ cuối cùng

    Tất cả các tài nguyên này là hoàn toàn miễn phí để tải về và đồ chơi trong các dự án của riêng bạn. Nếu bạn là người hoàn toàn mới với hoạt hình UX, tôi đảm bảo bạn sẽ học được nhiều thứ bằng cách nghiên cứu những thứ miễn phí này. Nếu bạn biết bất kỳ tài nguyên tuyệt vời nào khác, vui lòng thả liên kết trong các nhận xét.