Gradient Hero Cho Sketch App

Ngày sinh nhật được nghỉ ở nhà. Nhân tiện vừa phát hiện ra rằng có thể sử dụng Vuejs để phát triển plugin cho SketchApp. Thực sự khá là thú vị khi có thể kết hợp những cái mà mình yêu thích lại với nhau. Vậy là bắt tay làm plugin cho SketchApp. Plugin cung cấp một danh sách các gradient được chọn lọc, cho phép bạn áp dụng các gradient này và shape.

Kỹ thuật để hiện thực plugin này khá thú vị, có thể được áp dụng ở một số môi trường khác. Vì bạn không có cách nào để tương tác trực tiếp từ javascript đến code xử lý shape trong sketch. Phải có cách nào đó để liên kết chúng.

Sketch cung cấp api cho developer xử lý shape, Nhưng code đó phải xây dựng bằng cocoascript, rất khó cho mình để xây dựng UI, nhưng nó lại hỗ trợ một webview. Nên mình nảy ra ý định là làm một website, nhét vào webview. Nhưng code trong web không thể thao tác với shape. Nhưng trong plugin có thể biết được url hiện tại của webview, ah, giải pháp nằm ở đây. Mình đã dựa vào url của webview để xác định action cần thực hiện, data thì truyền vào object window. Như vậy là vấn đề được giải quyết. Đã có một kênh giao tiếp.

Cũng như vậy, trong nhiều môi trường khác, cũng có thể linh động dùng cách này để giao tiếp.

Bạn có thể tải plugin tại: Gradient Hero For Sketch

Source code mình đang giữ trên gitlab, vẫn chưa public cho các bạn, vì mình vẫn đang phát triển thêm các tính năng khác. Nếu chỉ đơn thuần là gradient như vậy thì không có gì thú vị nhỉ?