Storybook+AtomicDesignでデザイナーが開発に参加した話 | Nagisaのすゝめ

はじめに こんにちは、デザイナーの浜田です。 マンガZEROのWebリニューアルを担当することになり、AtomicDesignに則ってSketchでデザイン制作をしました。 そして今回デザイナーがAtomicDesignで言うAtoms/Molecules/OrganismsあたりのHTML/CSSを書いてみようという話になり、Storybookが導入されることになりました。 本記事ではデザイナーがStorybook+AtomicDesignを使って開発に参加してみてどうだったか、どのように活用ができたか、について紹介したいと思います。 デザイナー＆エンジニア間でStorybookが有用に使えそうかどうかの参考になればと思います。 ※本記事では、Storybookの環境構築やコードについての解説などは行いません。 AtomicDesignについては以前に弊社デザイナーが記事にしているので紹

[karauma]

(De)デザイン制作→(En)実装→(De)確認→(De)修正依頼→(En)修正→(De)確認のフローを (De)デザイン制作→(De)実装/修正(→(En)コードレビュー)にできるため、修正のやりとりが大幅に減る

[rinoside]

]

[kitokitoki]

“Storybook+AtomicDesignでデザイナーが開発に参加した話”

[efcl]

Storybook+AtomicDesignの開発環境について

[sho_yamane]

自分コンポーネント化する基準これだわ / “処理が必要なもの、複数回使用するものをコンポーネント化するというルールが決めてありました。”

[shinki0121]

“ ”

[kyotaweb]

Storybookいつか試してみよう