第一回 プログラマ向けデザイン勉強会 #design4p で「ズルいデザインテクニック」発表させていただきました。 - 納豆には卵を入れる派です。

2012/11/15 699 users 納豆 ズルいデザインテクニック DESIGN 半月 スライド

design, Sass, 作ったものどうも。書くのが遅くなりすぎてもう半月ほども前のことになってすごく今更感があるのですが、書いておくべきことを書きそびれると、その後出てくる他の書きたい小ネタがどんどん書けなくなっていってドンづまるパターンになるので、やはり書いておきますね。。先日、第一回 プログラマ向けデザイン勉強会というイベントで下記のスライド発表させていただきました。少ない手間と知識でそれ... 続きを読む

TEST CORDING » Sass:共通のプロパティをまとめる様々な方法をCSSと比較してみた

2012/10/17 3087 users Orange font-size color プロパティ 共通

今回のエントリーでは、 Sass による共通のプロパティや設定をどうまとめるかについて書いてみます。結局どうやって書くのが安定しているのか？ ということを試行錯誤する際に参考にしてみてください。 CSS 元となるCSSソース div.container h1 { color: orange; font-size: 20px; } div.container ul { font-size: 20px... 続きを読む

ウェブ制作者に必ず役立つ！iOS, HTML5, CSS, jQuery, WordPress, .htaccessなどのチートシートのまとめ | コリス

2012/10/14 1148 users jQuery Git iOS コリス htaccess

ウェブ制作、主にフロントエンドの開発者に役立つチートシートを紹介します。 順番は、iOS, HTML5, CSS, jQuery, WordPress, .htaccess, Git です。 HTML5での美しいコードの書き方、Sass、Zen Coding、jQueryのパフォーマンス、Gitの使い方などもありますよ。 続きを読む

TEST CORDING » Sass：CSSで描く図形36種をたった一行で書けるようにしてみた

2012/10/04 3087 users 図形 CSS 一行 TEST CORDING アニメーション

Sass を使って一行で図形を書いてしまうというエントリーです。前回のエントリーである「Sass：CSSで描く図形13種をたった一行で書けるようにしてみた」に引き続き、少し複雑な図形21種類を追加しました。 どんな感じで実装しているのか、というのは前回のエントリーに任せて、今回は書けるようになった図形の一覧を見ていただこうと思います。また、基本図形とは違ってホバー時のアニメーションには対応していま... 続きを読む

クックパッド流UIの作り方 - takeshi nagayama's blog

2012/07/26 652 users takeshi nagayama GitHub Haml

なんか突然東京行きたくなったので、ひょひょいと行ってきた。 たまたま立ち寄ったクックパッドっていう会社でクックパッド流UIの作り方という勉強会してたので、偶然持ち合わせていたはてなステッカー渡したりおいしい料理いただいたりした。 UI/UXのためのSass 池田さん / サービスデザイン部 Sass / Haml (エンジニア・デザイナー問わずに) Github デザイナーもpull req 一つ... 続きを読む

ASCII.jp：CSSの記述が3倍速くなる「LESS」の使い方

2012/02/09 778 users less jQuery mootools Blueprint

最近のWebサイトは大規模傾向にあり、Webアプリケーションを構築する機会も増えてきました。jQueryやMooToolsなど、JavaScriptを手軽に利用できるようにするライブラリーが普及する一方、Webサイトの表示を担うCSSにも、「Blueprint」や「960 Grid System」に代表されるフレームワークが登場しています。 「LESS」や「Sass」のようなCSS拡張メタ言語は、... 続きを読む