[Gulp][Sketch 3][hologram][SCSS][CSS]これからはじめるGulp（25）：Hologramとgulp-hologramでスタイルガイドを作る
はじめに この記事はGulp.js（全俺） Advent Calendar 2014です。 前回のこれからはじめるGulp（24）：gulp.spritesmithプラグインでSpriteイメージを作るでSpriteイメージを作りました。今回はgulp-hologramプラグインとスタイルガイドジェネレータのHologramを使ってスタイルガイドを作ってみたいと思います。 Hologramについて HologramはRuby環境で動くスタイルガイドジェネレータです。Hologramは独自のテンプレートを使ってスタイルガイドをカスタマイズすることができます。スタイルガイドジェネレータには他にもStyleDoccoやKnyle Style Sheetsがあります。 Ruby環境の準備 Gemfileにgem "hologram"を追記して$ bundle installを済ませます。 sour
![[Gulp][Sketch 3][hologram][SCSS][CSS]これからはじめるGulp（25）：Hologramとgulp-hologramでスタイルガイドを作る](https://cdn-ak-scissors.b.st-hatena.com/image/square/28ce70a4ba19573c729e61a380304d78f3fccffd/height=288;version=1;width=512/http%3A%2F%2Fwhiskers.nukos.kitchen%2Fassets%2Fimages%2Fogp.png)
デザイナーとエンジニアの共通言語を！開発スピードを上げるOSSスタイルガイド構築 | SELECK
今回のソリューション：【Living Style Guide/リビングスタイルガイド】 〜株式会社リッチメディアは、デザイナーとエンジニアのコミュニケーションの効率化に課題感をもっていた。その解決策として選んだLiving Style Guide（リビングスタイルガイド）の使い方〜 UI/UXデザインを作り上げていく過程で多くの場合課題になるのは、フロントエンジニアとデザイナーの意思疎通をいかに上手くやっていくかということだ。デザイナーのイメージするものをコーディングによってどれだけ正確に再現するか、互いに共通認識を持つことで開発のスピードアップにも繋がる。 ヘルスケア領域、ビューティー・サロン領域におけるメディア事業を展開する株式会社リッチメディアで現在新卒2年目のエンジニアを務める古沢 宏太さんは、デザイナーとエンジニアのコミュニケーションをもっと効率化できるのではと考えていた。そして
Hologram | Generate a Styleguide right in your CSS
Hologram is a Ruby gem that parses comments in your CSS and turns them into a beautiful styleguide. Quick start: gem install hologram And then: hologram init View on Github Why would I use it? Hologram makes building a styleguide as easy as maintaining your CSS. It is similar to Kneath Style Sheets and Styledocco. Your documentation is written in your production CSS using a combination of YAML and
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CSSを書く、設計する時に参考にしておきたいCSSのガイドライン・スタイルガイドのまとめ