タグ

atomicdesignに関するbittttttttttchのブックマーク (3)

  • Setup a design system

    Build a system that provides a unified set of UX, design rules and patterns. For the last years I have continued to build and design applications web and mobile, and i have learn how to deal with different departments and utilise their knowledge in order to make better products and build better design systems that scaled better and more efficient. There are obviously a whole lot more elements you

    Setup a design system
  • 進化するレスポンシブWebデザイン 「SGDD」とは何か? (2/2)

    アトミックデザインによるスタイルガイドの基設計 スタイルガイドの書き方にはさまざま方法がありますが、参考になるのが、米国のデザイナーであるブラッド・フロスト氏が提唱する「Atomic Design(アトミックデザイン)」というアプローチです。 http://bradfrostweb.com/blog/post/atomic-web-design/ アトミックデザインでは、スタイルガイドによるCSSの設計を「Atom(アトム)」「Molcules(モルキュール)」「Organism(オルガニズム)」「Template(テンプレート)」「Page(ページ)」という5つのステージに分けて考えます。 Atom(アトム) もっとも小さい粒度 Molcules(モルキュール) アトムが組み合わさってできたモジュール Organism(オルガニズム) 組織-モジュールが合わさったデザイン Templa

    進化するレスポンシブWebデザイン 「SGDD」とは何か? (2/2)
  • ui component evaluate and design — UIの設計・評価は、Atomic DesignやOOUXのようなコンポーネント指向

    アプリケーションのUI(主にGUI)の設計・評価をする際、ほとんどの場合は評価の範囲が画面(ページ)単位で行われることが多く、この設計・評価のフォーカスの粒度についてもっと考えたほうがいいのではないかと最近よく思います。 画面単位での評価をしていてよくあることは…画面 A 画面 B どちらにもリストがあり、そのリストは同じリストアイテムを表示していたりする場合でも、 「画面 Aとリストがー…」 「画面 Bのリストがー… 」 と同じリスト要素なのに画面単位で話をしてしまうことがよくあります。これはかなり無駄なことをしているように思えます。 もちろん、《そのデザイン要素はどういうコンテクストなのか》を議論する上で画面を持ち出すのは必要な事と思いますが、そもそもそのコンテクストは何に依存するものでしょうか? それはコンポーネントとして分解していくと実は画面そのものにあまり依存していない事が見えて

    ui component evaluate and design — UIの設計・評価は、Atomic DesignやOOUXのようなコンポーネント指向
  • 1