基準を設定するために必要な色の数、これらの色を何と呼ぶべきか、そしてそれらをどのように使用するか?

DSで使用されている小さなカラーフレームワークについて話しています。まず、いつものように、ベストプラクティスの簡単なレビュー、次に私のバイク。順番に行きましょう。





花はいくつ必要ですか

私たちの色の「顧客」は、製品デザイナー、マーケティング、開発です。





シンプルなデザイナーが幸せになるために必要なものは何ですか?





マーケティングには何が必要ですか?





開発には何が必要ですか?





さて、あなたは各色のいくつの色合いが必要ですか?ちなみに、最も簡単な質問ではありません。





方法1





一度それを行うにはそれで十分です、彼らは通常これを行います:





/ - ( ), . - , .





- , — :





2





, , . .





— , 49 , , , , , , , .





, :





, , , ?





,

- . , , . - .





3





. Default, hover, pressed, .. . , , — - .





-
Color name / Default
Color name / Hover
Color name / Disabled
      
      



. .





. , . , , - .





2 :





— . .





  • Base — ;





  • BG — ;





  • Functional — .





— . .





  • Brand — , ;





  • Promo — -.





, -, . . , .





. — , — , - . , .





.





.





, , .





.





- - , : , . .





, . , , , .





— .





, , .





, , . , .





, - . , , - . , , , . "" .





, , . "" .





, " ", . , .





:





  /  / _  / 
Tea / Solid / Base / Primary_Inverted / Default 
Sugar / Gradient / Brand / Secondary / Up
      
      



トークンはfigmaとコードで同じ名前を持つべきであるという意見があります。しかし、すべてがそれほど単純なわけではありません。figmaとレイアウトのカラーパターンが異なります。すべてを同じにすることで、デザイナーを曲げて、彼が作業するのが難しいフィグマの色のグループの曲線を取得します。したがって、色については、figmaで色に名前を付ける原則と、この名前をコードに転送する方法を説明する命名規則を説明する価値があります。結果として、誰もが大丈夫なはずです。






シフトのアイデアは、Opium.Fillの配色でスパイされました








All Articles