Atomic Designの考え方と利点・欠点 – wkr.
Atomic Design はデザインシステムを作る方法論となります。 デザインシステムというのはスタイルガイドやブランドのガイドラインなどを指すようです。 日本だとAbemaTV（アベマ TV）で使われています。 （Atomic Design を実案件に導入 - UI コンポーネントの粒度を明確化した結果と副産物 | ygoto3.comより） Atomic Design は今までのページ単位と違いコンポーネント単位でデザインカンプを作る考え方です。 作ったコンポーネント同士の組み合わせでページを作ります。 Atomic Design はコンポーネントの単位を 5 つに分けています。 その 5 つの単位は Atoms（原子）・Molecules（分子）・Organisms（有機体）・Templates（テンプレート）・Pages（ページ）です。 各コンポーネントの詳細は次のとおりです。
私のソースコードの書き方 - @kyanny's blog
note.mu なるほど自分も同じような感じでやっているなぁ、と思った。もうちょっと詳しく書くと、 まず変更しようと思っている部分の周辺のコードを読んで、「ここらへんをいじればよさそう」と当たりをつける（当たりのつけかたにもいろいろあるのだが後述） 土地勘を養ったところで具体的な変更の仕方を考える。必要に応じて紙に下手くそな図を書いたり、考えを箇条書きにしたり、実際にコードを試しに変更してみたりする この方針でいけそう、と道筋が見えたらいよいよコードを書き始める。細かい単位でコミットするかどうかは場合によるが、少なくとも git add はこまめに行う（エディタの undo でせっかく書いたコードを失わないため） 道筋が見えなかったり、プロトタイプ的に書いたコードが望み薄そうだったら潔く諦める。煮詰まっていることを自覚して、コーヒーを買いにいったり、オフィスの外を散歩したりして頭をリフレッ
WebデザイナーがフォローすべきTumblrアカウント10選 | UX MILK
TumblrでWebデザイナーがフォローすべきアカウントを10個厳選してご紹介します。 Tumblrは画像や動画、文章など、様々なメディア形態で投稿できることから、グラフィックだけに留まらず様々な方法でデザインのインスピレーションを得ることができます。英語・日本語アカウントを織り交ぜて取り上げていますので気になるアカウントはぜひフォローしてみてください。※括弧内にアカウント名を表示しています。 １. All The Style Guides（allthestyleguides） 様々なサイトのスタイルガイドとパターンライブラリを紹介している、非常に勉強になるアカウントです。どうしても自分が知っているスタイルガイドばかりを参考にしてしまいがちですが、こうやってまとめてあると新たなスタイルガイド、パターンライブラリに出会うことができてとてもありがたいですね。 ２. House of Butto
awsm.css - 標準タグのみを使った綺麗なデザインフレームワーク MOONGIFT
HTMLタグにはそれぞれに意味があります。その意味を活かしたデザインを行うことで、SEOのようにコンピュータはもちろんスクリーンリーダーなどでも使いやすいコンテンツに仕上がります。 しかし多くの場合、デザイン上の理由で全く関係のないタグが使われることがあります。そこで使ってみたいのがawsm.cssです。 awsm.cssの使い方 awsm.cssはクラスの指定もない、準ず否HTMLタグだけをデザインするフレームワークです。 まずはトップページ。 リスト。 テーブル。 インラインの装飾。 メディア。 フォーム。 awsm.cssはタグに余計な設定はいりませんので、プロトタイプなどを作る際に重宝しそうです。デフォルトのタグに設定が追加されてしまうので、細かいカスタマイズをしようとすると予定していなかった設定が入ってきてしまうかも知れません。 awsm.cssはCSS製のオープンソース・ソフト
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
