[Thông báo] Chúng tôi đã xác nhận rằng một số mã trong các bài giảng không còn hoạt động do việc tổ chức lại Framer vào ngày 24 tháng 5 tại [Framer-Site]. Mặc dù điều này có thể gây bất tiện, chúng tôi yêu cầu những người tham dự các bài giảng tạo một dự án mới tại http://framer.com/projects/new .

🤔 Nguyên mẫu ư ? Tại sao phải bận tâm?

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 họ có rất nhiều thứ phải lo lắng ngoài thiết kế. Nếu bạn đang nghĩ , "Xác định các vấn đề của người dùng và tạo ra một thiết kế tuyệt vời đã là một thử thách, giờ lại còn là một nguyên mẫu ?" Tôi hoàn toàn hiểu... Nhưng tại sao không thử xem xét lại?

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

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

❗️Có lý do gì khiến tôi nhất định phải sử dụng kem lót không?

Chương 3: Thử nghiệm mã - Video trang web tham khảo

ProtoPie, InVision, Oven, Balsamic, v.v... Chúng ta đang sống trong thời đại mà các công cụ tạo mẫu phổ biến hơn bao giờ hết. Ngay cả các công cụ thiết kế như Figma và Sketch cũng đang cạnh tranh để bổ sung các tính năng tạo mẫu, giúp có thể triển khai các luồng người dùng đơn giản trong các công cụ này. Tuy nhiên, các công cụ này dựa trên GUI, nghĩa là chúng là bản mô phỏng của sản phẩm cuối cùng trước khi nó được xây dựng. Các nhà phát triển cần diễn giải các bản mô phỏng này dựa trên các màn hình đã hoàn thành và các giải thích của nhà thiết kế. Tuy nhiên, Framer là một công cụ tạo mẫu dựa trên React. Các sản phẩm bạn tạo ra bằng Framer thực sự có chức năng . Sản phẩm hoàn thiện có thể được triển khai trên các nền tảng PaaS như Netlify và các nhà phát triển thậm chí có thể kiểm tra 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ó thể được sửa đổi theo thời gian thực , mọi lúc, mọi nơi !

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

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

Bạn làm gì với lớp sơn lót ?

Được rồi!

Framer có thể tạo ra 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 đã nhận được rất nhiều sự chú ý trên toàn thế giới. Từ góc nhìn của một nhà phát triển, chúng ta sẽ cùng nhau lên ý tưởng, vẽ màn hình và viết mã một chút . Chúng ta cũng sẽ trải qua quá trình cải tiến sản phẩm theo thời gian thực thông qua thử nghiệm người dùng .

Primer , có phải là quá khó không...?

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

Mặc dù Primer là một công cụ tạo mẫu dựa trên mã, nhưng nó hoàn toàn có thể sử dụng được ngay cả khi bạn không có bất kỳ kinh nghiệm lập trình nào ! Khóa học này sẽ tăng dần độ khó, giúp bạn hiểu và thành thạo công cụ. Như người ta vẫn nói, bắt đầu là đã thành công một nửa. Mục tiêu của khóa học này là giúp bạn dễ dàng và đơn giản tạo ra các mẫu bạn mong muốn. Nếu bạn đam mê và không bỏ cuộc, nó sẽ trở thành một kỹ năng độc đáo mà bạn có thể tận dụng triệt để trong sự nghiệp của mình.

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

Khóa học này được tạo bằng Figma và Framer Web. Framer Web dành cho mục đích cá nhân hoàn toàn miễn phí ! Bạn sẽ thấy việc theo dõi khóa học dễ dàng hơn nhiều nếu xem trước các ví dụ bên dưới. 😉

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