Sketch Tips / Tricks / Tutorials: How to Design a colorful progress bar on Sketch

[Video] [Sketch Tricks/Tips] Hướng dẫn làm Round Progress Bar trên Sketch 3. (How to design a Round Progress Bar on Sketch) by‪#‎UXHacker‬

Và đây là link Sketch file thành phẩm cho bạn nào cần:http://bit.ly/1WH0kzv
—
Sau đây UX Hacker sẽ giới thiệu cho các bạn 1 trick để thiết kế “Round Progress Bar” rất nhanh vào tiện lợi, chỉ 1 vài bước đơn giản như dưới đây:

➡ Ở đây mình chuẩn bị vòng tròn: 200 x 200 (W x H) (con số này có thể thay đổi tùy theo ý bạn)
➡ Tắt Fill của vòng tròn và chọn Border size tùy theo ý bạn muốn.
➡ Bấm vào nút Setting (Cog Icon) ở góc phải của Border area.
➡ Để làm trick này các bạn sẽ cần tới dãy số ‪#‎Pi‬: 3.14159265359. Hãy Copy sẵn dãy số này.
➡ Công thức để điền vào Gap: 200 * Pi (Trong đó 200 là W và H của vòng tròn)
➡ Thay đổi chỉ số trong Dash để tạo ra vòng Progress của bạn.
➡ Tô màu cho Border theo màu sắc mà bạn muốn và thỏa sức sáng tạo tiếp nhé.

Vậy là xong rồi đấy.

Nếu các bạn thấy thích và hữu ích, hãy chia sẽ cho nhiều người khác cũng biết. ‪#‎GrowthTogether‬

source