AtomicDesignに挑戦した所感 ~特定機能に対する個別スタイル指定~

AtomicDesignに挑戦した所感 ~特定機能に対する個別スタイル指定~

管理画面ベースのサイトを構築するにあたり、AtomicDesignを導入しデザイン・フロントトコーディングを進めている。
その中で出た疑問や、つまずきのメモになります。
————
サイトがある程度出来上がってきた為、数値のデータや文字列が動的に入った状態での表示の調整や、コンテンツ量を踏まえたデザインの変更を行っている。
予め用意したサイズや色を元にパーツを置いているが、「このページではこの色で」「このページではこの位置で」。
また、アイコンを共通指定にしているが、図柄のバランスから「このアイコンは少し大きく」という調整が発生してきた。

◆共通の指定ではhover時の処理は薄いグリーンに変更するが、特定の箇所に使用する場合はhover指定を変更したい
ボタン

こちらの記事で悩んでいた問題だが、デザイン性の向上や、ユーザーが使いやすい機能面から考えると正しいことだと言える。
今後、数をこなせば予めパターンとしてコンポーネントに組み込んでおくなど、「コンポーネント自体のブラッシュアップ」も出来ていくと思う。