Nhảy tới nội dung

Tải về

Cập nhật lần cuối vào

Phiên bản 3.1

31/08/2022

Chào mọi người, lần cập nhật này bọn mình cho ra mắt bộ document hoàn toàn mới. Chi tiết hơn so với phiên bản cũ, bao gồm những thông tin về component properties, cấu trúc của component và cách sử dụng component, v.v

Bên cạnh đó, Tini design library cũng có nhật cập nhật mới về component Rating và Input stepper. Cũng như là cập nhật thêm các icon mới vào trong page Icons hiện có trong file Figma của Tini Design library.

Đó là phần cập nhật của tháng này! Hẹn các bạn vào tháng sau.
Tải về

--

Phiên bản 3.0

27/07/2022

Hôm nay, bọn mình rất vui khi được giới thiệu với các bạn phiên bản 3.0 của Tini design library. Vậy đâu là những cải tiến đáng kể của tháng này?

  • Đầu tiên, bọn mình nâng cấp tất cả các component với tất cả các tính năng cập nhật mới nhất của Figma.
  • Thứ hai, cân chỉnh lại tất cả các property của các copmponent để đồng bộ hóa giữa bên thiết kế và bên developer.
  • Cuối cùng nhưng không kém phần quan trọng, bọn mình đã cập nhật thêm nhiều icon hơn cho thư viện icon của Tini.

Hẹn gặp lại các bạn vào tháng sau với cách trình bày document mới nhé!

--

Phiên bản 2.7

30/06/2022

Chào mọi người, bọn mình sẽ cập nhật nhanh về vài thay đổi ngoạn mục trong tháng này.

Đầu tiên là bọn mình thay đổi cách viết tài liệu và đã thử nghiệm ở phần Foundation (Màu sắc, Font, Icon...). Tháng sau bọn mình hy vọng sẽ áp dụng hết cho tất cả component.
Thứ hai, bọn mình đã cho ra mắt thêm một template mới - Đặt khách sạn. Click ở đây để xem thêm chi tiết.
Và điều xịn xò nhất của tháng này là...bọn mình đã cho ra mắt thư viện icon mà cho chính bọn mình thiết kế.

Đó là những cập nhật nhanh trong tháng này, hẹn mọi người vào tháng sau nhé!!!

--

Phiên bản 2.6

31/05/2022

Xin chào tất cả mọi người, tháng này sẽ xoay quanh tính năng mới của Figma là Auto layout. Nhờ các tính năng mới (như absolute position and individual strokes) Giờ đây, chúng ta có thể làm cho một số components dễ sử dụng hơn trước.
Có những component được cải thiện như sau:

  • Button bar
  • Text field
  • Date field
  • Textarea
  • Combo field
  • Slider
  • Navigation bar
  • Sidebar
  • Badge
  • Tabs
  • Bottom bar
  • Carousel
  • Bottom sheet

Tháng tới, bọn mình sẽ khám phá component properties để cải thiện hệ thống thiết kế Tini của chúng tôi.
Hẹn sớm gặp lại.


Phiên bản 2.5

30/04/2022

Tháng này bọn mình tập trung vào việc xây dựng các ứng dụng tiện ích cho đối tác, nhằm kiểm tra khả năng sử dụng của bộ Tini design system, đồng thời quan sát các bạn designer trong nội bộ Tiki sử dụng như thế nào. Cho nên bọn mình vừa ra mắt thêm một trang mới bên trong file Figma đó là trang Get Started - một trang hướng dẫn và giúp các bạn lần đầu làm quen với việc sử dụng các component của Tini design system. Hãy dùng thử và cho bọn mình những nhận xét của các bạn nhé.

Về thư viện component, bọn mình có một update nhỏ:

  • Thêm quy định về kích thước chiều ngang nhỏ nhất dành cho button.

Hẹn gặp lại các bạn vào tháng sau.


Phiên bản 2.4

31/03/2022

Hôm nay là ngày Tini design system tròn 1 tuổi. Bọn mình bắt đầu với 7 global style, 29 component và nay bọn mình đã có 30 text style, 62 màu global style, hơn 100 color token và 44 component. Cùng ăn mừng bằng những sự cải tiến mới:

  • Search & Date field: Đã đổi resizing của field wrapper thành fill container.
  • Carousel: Giờ chúng ta đã có thêm navigation button để dành cho phiên bản desktop. Chỉnh lại hành vi phóng to của component hình.
  • Alphabet: Tăng vùng touch zone
  • Step: Thêm token màu cho trạng thái lỗi
  • Section & Card: Cải thiện khoảng trống và vùng được customized Có gì mới?
  • Tab: Thêm phiên bản có thể cuộn ngang của Basic tab và Advance tab (Chủ yếu dùng cho bản desktop)
  • Sheet: Thêm phiên bản center sheet, một biến thể của bottom sheet, nhưng chỉ dành cho bản desktop.

Đúng, bạn đã thấy từ “Desktop” khá nhiều. Và bạn có thể đoán được điều gì sắp xảy ra nhỉ? Hẹn gặp các bạn vào tháng sau.


Phiên bản 2.3

28/02/2022

Chào mọi người, tháng hai của mọi người thế nào? Với bọn mình tuy là tháng ngắn nhất năm nhưng lại có nhiều dự án thú vị cần tập trung ưu tiên để phát triển (hy vọng sẽ sớm chia sẻ những dự án này đến với mọi người), cho nên với Tini Design System bọn mình chỉ có một số cải tiến nho nhỏ.

Tooltips: Đã có những phiên bản mũi tên ở các hướng khác nhau cho component này.
Button: Có điều chỉnh một vài sắc độ xám ở button Neutral và Neutral Reverse nhằm tăng độ tương phản của những component này tốt hơn.

Hẹn gặp lại mọi người vào tháng sau nhé.
Make art, not war.


Phiên bản 2.2

28/01/2022

Chào mọi người, hôm nay là ngày làm việc cuối cùng trong năm "con Trâu" rồi. Chúc mọi người sức khỏe và nhiều sự may mắn trong năm "con Cọp" nhé. Tháng này, team bọn mình chỉ có một chút cải tiến cho Tini design library.

  • Navigation bar: Ở Transparent variant đã có các button của Neutral button và Neutral reverse button.
  • Snowflake components: Bọn mình di chuyển các component thuộc dạng Social & E-commerce vào một bộ library khác. Hy vọng sẽ chia sẻ được với mọi người sớm.

Đó là những gì của tháng vừa rồi! Hẹn mọi người vào năm sau nhé.
Year of the Tiger, best luck to the Fighter!


Phiên bản 2.1

31/12/2021

Năm 2021 của bạn như thế nào? Đối với team bọn mình là một năm khá "điên rồ" khi vừa tạo ra, publish lên cộng đồng cũng như là trùng tu và phát triển tiếp bộ Tini design system này, mệt thì có mệt nhưng mà rất hài lòng với thành quả như ngày hôm nay.
Tháng này bọn mình tập trung vào việc sử dụng library này để thiết kế những tiện ích chuẩn bị có mặt trên app Tiki, nên chỉ có vài bổ sung nho nhỏ.

Có gì mới?

  • Image component: Bọn mình mới ra mắt thêm một tỉ lệ hình mới là 5:1, chủ yếu dành để sử dụng cho banner quảng cáo
  • Button: Chào mừng Neutral Reverse button vào với đại gia đình button của Tini design
  • Color tokens: Bọn mình có thêm hai tokens mới cho trạng thái disabled.

Những cải thiện

  • Bọn mình có điểu chỉnh sắc độ opacity của vài token màu của Neutral Outline button để tăng tính dễ tiếp cận hơn.

Đó là những gì của tháng này bọn mình đã cập nhật cho Tini, hẹn gặp lại bạn năm sau với những cái tiến xịn hơn đến từ Tini design system của bọn mình nhé.

May the force be with you!!!


Phiên bản 2.0

30/11/2021

Design tokens là ngôn ngữ chung giữa designer và developer; chúng không chỉ giúp việc hợp tác giữa 2 bên dễ dàng hơn cũng như quản lý và phát triển, mà còn đảm bảo tính nhất quán giữa các nền tảng và các sản phẩm. Bọn mình đã thử nghiệm sử dụng design token vào Tini design system từ lúc bắt đầu, và đến hôm nay bọn mình rất phấn khởi khi ra mắt phiên bản Tini 2.0 với bộ design tokens chính thức. Bọn mình sẽ viết một vài bài viết về design tokens, mọi người kiên nhẫn chờ đợi nhé ;)

Bên cạnh đó bọn mình cũng có một vài cải tiến cho thư viện component

  • Thể loại button mới: the Over background button
  • Thay đổi giá trị màu/ kích thước/ cách đặt tên của một vài component để tăng tính dễ nhận dạng và sử dụng hơn như là Neutral button, trạng thái disabled của các components...v.v

Đó là những thay đổi của tháng mười một này. Hẹn gặp lại các bạn vào tháng sau!!! Giữ gìn sức khỏe nhé.


Phiên bản 1.4

29/10/2021

Sài Gòn đã nhộn nhịp và mọi người có thể được ăn uống bên ngoài lại rồi mọi người ơiiiii. Cập nhật tình hình nơi tụi mình sống là vậy còn về phần Tini design system của bọn mình thì:
Cải thiện:

  1. Chip:
  • Cải thiện khoảng cách của Icon suffix, prefix.
  • Giảm kích thước icon prefix của Chip từ 24px còn 20px.
  1. Dropdown:
  • Sửa lại icon và đổi token màu.

Những cái mới:

  1. Image: Đã có ratio mới là 4:3 và 3:4.
  2. Bottom sheet: Tách Overlay ra khỏi component Bottom sheet component để trở thành một component riêng.
  3. Avatar: Có một loại Avatar mới là Initials Avatar.
  4. Combo Field.

Tháng này vỏn vẹn chỉ có vậy.
Tháng sau, bọn mình sẽ ra mắt phiên bản 2.0 với cấu trúc mới của color token nhé.


Phiên bản 1.3

30/09/2021
Xin chào, tháng 9 của bạn như thế nào? Sài Gòn thì vẫn đang hồi phục và chuẩn bị quay lại để lợi hại hơn xưa.
Tháng này, team Tini tập trung vào việc phát triển template mới dành cho lĩnh vực Ăn uống, vì vậy về Design system chỉ có một vài nâng vấp về cấp trúc bên trong của các component như Table, Date field, và List view. Một số thay đổi nhỏ ở component Social post, và thay đổi tên token màu của Error, Success thành Negative và Positive để có khả năng sử dụng rộng hơn.
Đó là mọi cập nhật cho tháng 9 này. Hẹn gặp lại các bạn vào tháng sau nhé!!!


Phiên bản 1.2

31/08/2021
Như bọn mình nói tháng trước, một thành viên mới đã gia nhập, và anh ấy đã tạo ra những component mới một cách tuyệt vời cũng như cải thiện quy trình và cấu trúc trong hệ thống thiết kế của Tini
Vậy có gì mới?

  • Button: Bọn mình đã có thêm một hệ màu mới cho button là Neutral button.
  • Uploader: Component này dùng cho các trường hợp tải lên các file hình ảnh, giấy tờ.
  • Rating component
  • Image: Có những tỉ lệ hình mới và được phóng to theo chiều dọc và cao nhưng giữ nguyên được tỉ lệ.
  • Dialog, Tab: Bọn mình đã cải thiện cách dùng những components một cách linh hoạt hơn, hãy dùng thử và chia sẻ cảm nghĩ của bạn nhé ;).
    Và hoành tráng nhất là bọn mình đã cho ra mắt thêm 2 theme mới về component: E-commerce components
  • Section
  • Card
  • Product item Social components
  • Social post
  • Profile
  • Comment
    “One more thing!”, Dựa vào những component của Tini, bọn mình còn xây dựng một bộ template dành cho ứng dụng thể loại mua sắm ở đây và sẽ được cập nhật hàng tháng, cũng như là cho ra mắt thêm những template khác dành cho những mô hình kinh doánh khác. Hãy đón chờ nhé ;) Wake me up when September ends!!!

Phiên bản 1.1

30/07/2021
Mọi người vẫn ổn chứ? Tháng 7 này, Sài Gòn bận rộn với việc phòng chống Cô-Vy thì bọn mình cũng tối mặt với những công việc đột xuất ồ ạt tới...Cũng vì vậy nên với Tini Design System, lần cập nhật này team design chỉ có cải thiện cho những components đã có. Cụ thể là:

  • Hình ảnh: Giờ đây đã có thêm hình tỉ lệ 3:2, và khi bạn dùng autolayout hình sẽ tự động phóng ra theo tỉ lệ.
  • Button: Team biết là mọi người đã chờ đợi giây phút này quá lâu rồi 😂 và lần này button đã có thêm Leading icon và Trailing icon nhé.
  • Text field: Đã được bổ sung thêm prefix và suffix trong field (cụ thể là label và button nằm bên trong field)
  • Dropdown: Nay đã có dropdown menu dành cho desktop.
  • List & Grid view: Bạn đã có thể chọn kích thước hình và icon cho List và Grid view.
  • Toast bar: Đã được cập nhật những quy định về vị trí xuất hiện

Tháng tới, team sẽ chào đón một thành viên mới gia nhập. Hãy cùng đón chờ xem người anh ấy sẽ nâng tầm Tini design system như thế nào nhé. May the force be with you.


Phiên bản 1.0

02/07/2021
Làm việc ở nhà có vẻ giúp cho team design làm hiệu quả hơn đó mọi người 😂. Lần này Tini trình làng thêm các components sau:

  • Dropdown
  • Search field
  • Date field
  • PIN
  • Chips
  • Calendar
  • Table
    Về phần Template, cũng có thêm một template mới đó là Order management. Tiếp theo sẽ là gì? Team Tini đang suy nghĩ với phần Responsive layout... Đang ở đâu thì ở yên đó nha mọi người.🖖

Phiên bản thử nghiệm 0.2

01/06/2021
Thay đổi lớn nhất của lần này là cách Tini viết tài liệu về các components 🎉 Thay đổi thứ hai là về cách sắp xếp cấu trúc của các components như Text field, Textarea, List, Bottom sheet, và cùng chào đón các thành viên mới gia nhập vào gia đình của Tini:

  • Grid view
  • Inform
  • Audio player
    "One more thing" 1 bộ template mới cũng đã được ra mắt: Giỏ hàng. Quẩy thôi 🎉

Phiên bản thử nghiệm 0.1

30/03/2021
Phiên bản đầu tiên của hệ thống thiết kế Tini bao gồm 7 thiết kế chung với 29 thành phần thiết kế. Cheers 🎉