Design Token တစ်ခုကိုမြင်လိုက်တာနဲ့ ဒီ token က ဘာအတွက်သုံးတာလဲဆိုတဲ့ decision ကို သူ့ကိုအသုံးပြုမယ့်သူတိုင်းအတွက် သိသာနေဖို့လိုအပ်ပါတယ်။ ဒီအတွက်ကြောင့် naming system ကောင်းကောင်းနဲ့ နာမည်ပေးဖို့လိုပါတယ်။

နာမည်ဘယ်လိုပေးရမလဲဆိုတာ မလေ့လာခင် Design tokens ဆိုတာဘာလဲ အသေးစိတ်ရှင်းပြထားတဲ့ အရင် note ကို အရင်ဖတ်လို့ရပါတယ်။

Tokens တွေရဲ့ concept က ဘယ်ကစသလဲ

Design System တစ်ခုမှာ color, font, shadow, radius အစရှိသဖြင့် style တွေရှိသလို အဲ့ style တစ်ခုစီတိုင်းအတွက် option တွေများစွာရှိပါတယ်။

ဥပမာ - red-50 ~ 1000, font-size-sm ~ xl, etc.

Design System ကောင်းတစ်ခုဖြစ်ဖို့ဆိုရင် ဒီ ရွေးခြယ်ထားတဲ့ design option တွေကို ဘယ်နေရာမှာသုံးမှာလဲဆိုတဲ့ decision အနေနဲ့ မြင်ရဖို့လိုပါတယ်။ ဘာကြောင့်လဲ။ Design System တစ်ခုမှာ component ပေါင်းများစွာရှိသလို ဒီ component တွေကို styling လုပ်တဲ့အခါ option တွေများစွာထဲကနေ ထပ်ခါထပ်ခါ apply လုပ်နေရတာက ရေရှည်မှာ အဆင်မပြေနိုင်တဲ့အရာပဲဖြစ်ပါတယ်။ အရင်က author ဆိုရင် ရံဖန်ရံခါတိုင်း primary text ကို neutral-500 ပေးရမယ့်အစား မေ့ပြီး neutral-600 ဆိုပြီး ပေးမိတဲ့အခြေအနေမျိုးတွေများစွာကြုံတွေ့ရပါတယ်။ ဘာလို့ဆို option တွေသာရှိပြီး ဘယ် option ကိုတော့ ဘယ်နေရာမှာ သုံးမယ်ဆိုတာမျိုး decision မှ မမြင်ရတာ။ မှန်းပြီးတော့ apply လုပ်နေတာကြောင့် ဖြစ်ပါတယ်။

ဆိုတော့ $red-500 လိုမျိုး color option တစ်ခုကို hand-off လုပ်လိုက်တဲ့အခါမှာ Developer တွေက Sass လို preprocessor တစ်ခုခုမှာ

$red-500: #fd404d;
$font-size-m: 16px;
$border-radius-sm: 4px;

ဆိုပြီး variable အနေနဲ့ သိမ်းပါတယ်။ ဒီ variable တွေကို system ရဲ့ လိုအပ်တဲ့ နေရာတိုင်းအတွက် reusable လုပ်နိုင်ပါတယ်။ ဒါပေမယ့် ဒီ variable တွေက option တွေကို naming သီးသန့်ပေးပြီးသိမ်းထားတာသာ ဖြစ်ပြီး ဘယ်လိုအသုံးပြုမှာလဲဆိုတာမပါဝင်ပါဘူး။ အကယ်၍ ဒီ option တစ်ခုစီတိုင်းမှာတိုင်းသာ use of context ပါဝင်မယ်ဆိုရင် ဒီ variable တွေရဲ့ power ဟာပိုပြီး strong ဖြစ်လာမှာဖြစ်ပါတယ်။

ဥပမာ -

$color-bg-primary: $red-500;
$font-size-subtitle: $font-size-m;
$border-inset-default: $border-radius-sm;

ဒီလို variable တွေမှာဆိုရင် ဘယ်နေရာမှာ သုံးမယ်ဆိုတဲ့ decision မျိုးကို တွေ့နိုင်ပါတယ်။ နောက်ပြီးတော့ ဒီလို decision မျိုးတွေကို သက်ဆိုင်ရာ product ရဲ့ repository တွေမှာတင် မသိမ်းထားတော့ပဲ designer တွေပါ မြင်တွေ့နိုင်တဲ့နေရာကို ခေါ်လာပြီး အခြားသော product တွေပါ reusable ဖြစ်နိုင်မယ့် centralized living system တစ်ခုအနေနဲ့ထားမယ်ဆိုရင် designer ရော dev ရော လူတိုင်းအတွက် ပိုပြီး အသုံးဝင်ပါတယ်။