[Thông báo] Framer đã được tổ chức lại thành [Framer-Site] vào ngày 24/5 và chúng tôi đã xác nhận rằng một số mã trong bài giảng không hoạt động. Điều này có thể bất tiện, nhưng nếu bạn đang tham gia bài giảng, vui lòng tạo một dự án mới thông qua http://framer.com/projects/new .

🤔 Nguyên mẫu ? Tại sao?

Từ việc tham gia các cuộc họp lập kế hoạch đến bàn giao và quản lý tài sản thiết kế... Tôi nghĩ tất cả các nhà thiết kế sản phẩm đều đồng ý rằng có rất nhiều điều mà các nhà thiết kế cần chú ý đến ngoài thiết kế. “Chắc hẳn rất khó để xác định các vấn đề của người dùng và chọn ra một thiết kế tốt, nhưng còn một nguyên mẫu thì sao?” Nếu bạn nghĩ vậy thì tôi hoàn toàn hiểu được cảm giác của bạn… … . Nhưng, sao bạn không xem bài giảng này và suy nghĩ lại?

👨‍💻 Đây có phải là cách bạn làm nó không?

Trừ khi nhà phát triển tạo ra một dịch vụ một mình, giao tiếp là điều cần thiết. Dịch vụ càng lớn thì chi phí liên lạc càng lớn. Hầu hết các vấn đề có thể được xử lý thông qua tin nhắn Slack. Đối với các vấn đề phức tạp hơn một chút, cuộc họp Zoom có ​​thể là đủ. Tuy nhiên, nếu bạn đang xoay vòng hoàn toàn sản phẩm của mình, thực hiện các thay đổi đối với các chi tiết rất chi tiết và không thể mô tả vấn đề bằng lời thì việc tạo nguyên mẫu có thể là cách nhanh nhất để giải quyết vấn đề.

❗️Có lý do gì khiến bạn phải sử dụng máy đóng khung không?

Chương 3: Nhập code - Video site tham khảo

Protopie, Envision, Oven, Balsamic, v.v... Chúng ta đang sống trong thời đại có nhiều công cụ tạo mẫu hơn bao giờ hết. Ngay cả khi các công cụ thiết kế như Figma và Sketch cạnh tranh để thêm các tính năng tạo mẫu, các luồng người dùng đơn giản giờ đây có thể được triển khai trong các công cụ thiết kế như những công cụ ở trên. Tuy nhiên, những công cụ này là những công cụ dựa trên GUI và là những mô hình mô phỏng sản phẩm trước khi sản xuất sản phẩm cuối cùng. Nhà phát triển sẽ cần phải trải qua quá trình diễn giải lại mô hình này, xem màn hình đã hoàn thiện và lời giải thích của người thiết kế. Tuy nhiên, Framer là một công cụ tạo mẫu dựa trên React. Sản phẩm bạn tạo thông qua Framer là sản phẩm thực sự hoạt động. Các sản phẩm đã hoàn thiện có thể được phân phối thông qua PaaS như netlify và các nhà phát triển thậm chí có thể mở mã nguồn . Điều này có nghĩa là bạn có thể tạo các sản phẩm web được sửa đổi theo thời gian thực , mọi lúc, mọi nơi !

Tôi giới thiệu nó cho những người này

• Những người muốn kiểm tra xem thiết kế của họ có thể được phát triển hay không
• Những người muốn sửa đổi nguyên mẫu trong thời gian thực và phản hồi phản hồi
• Những người muốn thực hiện thiết kế thông qua mã

Bạn làm gì với Framer ?

ㄱㅈㅇ!

Framer có thể tạo bất kỳ màn hình nào có thể triển khai bằng React ! (Tất nhiên càng phức tạp thì càng khó... 😂) Trong bài học này, chúng ta sẽ tạo ra một dịch vụ liên quan đến chứng khoán gần đây đã thu hút rất nhiều sự quan tâm từ khắp nơi trên thế giới. Chúng tôi dự định dành thời gian để đưa ra các ý tưởng từ quan điểm của nhà phát triển, vẽ màn hình và thực hiện một chút 🤗 viết mã . Chúng tôi cũng sẽ thực hiện quá trình cải tiến sản phẩm theo thời gian thực thông qua thử nghiệm của người dùng .

Framer , có phải là rất khó khăn không...?

Video giới thiệu chính thức của Framer Web

Framer là một công cụ tạo mẫu dựa trên mã, nhưng bạn có thể sử dụng nó ngay cả khi bạn không biết gì về mã hóa ! Trong bài giảng này, chúng tôi sẽ tăng dần mức độ khó để hiểu và tìm hiểu các công cụ. Có câu nói bắt đầu tốt là xong một nửa phải không? Mục tiêu của bài giảng này là giúp bạn tạo ra nguyên mẫu mà bạn muốn một cách dễ dàng và đơn giản. Nếu bạn quan tâm và không từ bỏ, nó sẽ trở thành kỹ năng của riêng bạn mà bạn có thể tận dụng triệt để trong lĩnh vực của mình.

Đây là một ví dụ bài giảng .

Bài giảng này được tạo bằng Figma và Framer Web. Web Framer cá nhân là MIỄN PHÍ ! Nếu bạn kiểm tra trước các ví dụ bên dưới và xem bài giảng, bạn sẽ thấy việc này dễ dàng hơn nhiều . 😉

Hình tượng: https://www.figma.com/file/YKbkOiYWBVSNfUZXQY6ENP/jonbeo
Người lập khung: https://framer.com/projects/xFiRc8OAux01S6z56OMj-ephJU