2013年3月19日のブックマーク (5件)

  • 初めてSassとCompassを使った際に参考にした記事まとめ

    しばらく前から気になっていたCSSを書く時に便利だという「Sass」と「Compass」を自分のサイトを作る時に使ってみました。 順番に導入の手順を追ってもいいのですが、検索すると多くのサイトが紹介していますので、私が見て参考にしたページをまとめておきたいと思います。 Sassとは まずSassとは何かと言うと、CSSを生成するためのメタ言語で、これを利用することでCSSを早く書けたり、記述が楽になったりします。 Sassの公式サイトは以下から。 Sass – Syntactically Awesome Stylesheets Compassとは Sassを拡張して、便利な機能を追加してくれるものです。ベンダープレフィックスを自動でつけてくれたり、リセットCSSを呼び出してくれたり、CSSスプライトを使えたりします。 Compassのドキュメントは以下から確認できます。 Compass H

    初めてSassとCompassを使った際に参考にした記事まとめ
    caramelyce
    caramelyce 2013/03/19
    Sass&Compass
  • ズルいデザイン(2):SassやCompassを使って、ズルいデザインテクニック (1/2) - @IT

    SassやCompassを使って、ズルいデザインテクニック:ズルいデザイン(2)(1/2 ページ) SassやCompassを使って、少ない手間でちょっといい感じに見せる小ズルいTipsを紹介。グラデーション、角丸のお手軽かつ効果的な使い方とは? シリーズ第2回、前回に続き、今回もSassやCompassを使って、少ない手間でちょっといい感じに見せる小ズルいTipsを紹介します。 今回は、グラデーション、角丸のお手軽かつ効果的な使い方について解説します。 (注)このページでは、個々のデザイン要素を分かりやすく説明するために、実寸サイズより画像を拡大して使用しています。 1: ズルいグラデーション CSS3ではグラデーションを扱えるようになったことから、画像を使わずに自在にグラデーションを描画して、CSSだけでよりリッチなビジュアル表現が可能になりましたが、一口にグラデーションといっても、う

    ズルいデザイン(2):SassやCompassを使って、ズルいデザインテクニック (1/2) - @IT
    caramelyce
    caramelyce 2013/03/19
    とてもステキ
  • 少ない手間と知識でそれなりに見せる、ズルいデザインテクニック

    少ない手間と知識でそれなりに見せる、ズルいデザインテクニック:ズルいデザイン(1)(1/2 ページ) デザインが自分でイイ感じに作れたらいいなあというプログラマのみなさん。少ない手間で簡単に、ちょっといい感じのデザインに見せるための、ちょっとした小ズルいTipsを紹介します Webプログラマ、Webエンジニアの皆さんが、個人で作るWebサービスやハッカソンなどで、短期間に集中してサービス開発してローンチしたいときに、もうちょっと自分でイイ感じにデザインできるといいなあという声をよく聞きます。 この企画は、そんなプログラマが、少ない手間で簡単に、ちょっといい感じのデザインに見せるための、ちょっとした小ズルいTipsを紹介します。 (注)このページでは、個々のデザイン要素を分かりやすく説明するために、実寸サイズより画像を拡大して使用しています。 ズルいデザインはSassとCompassを利用し

    少ない手間と知識でそれなりに見せる、ズルいデザインテクニック
    caramelyce
    caramelyce 2013/03/19
    めちゃ使えます
  • UIデザインの参考になるサイトまとめ | ナナメウエblog

    毎日仕事中と寝る前にチェックしてるUIの参考になるサイトをまとめました。 もう、見ているだけで涎が出ますね。 Dribbble – Following もはや知らない人はいないでしょう。世界中からハイレベルなデザインが集まるこのサイト。3時間に1回は見てます。 JAYPEG 日版Dribbbleというとわかりやすいかもしれません。昨年末にできたばかりですが、すごく好きです。投稿しまくってます。自分で作ったUIを素材として公開してたりします。1時間に1回は見てます。 Inspired UI – mobile ui patterns カテゴリーが細かく分かれていて非常に嬉しいです。数も豊富で見やすいサイトです。 iOS Mobile Patterns カテゴリーがわかりやすく、マウスが拡大鏡になるので細部まで見ることができます。 iPad and iPhone Design Ins

    caramelyce
    caramelyce 2013/03/19
    UI
  • タッチでHTML5アプリが作れるTouchDevelop超入門

    タッチ操作でアプリ開発ができる!「TouchDevelop」とは TouchDevelopはMicrosoft Researchが提供しているタッチデバイス向け開発環境です。発表当初はWindows Phone上で動作するアプリでWindows Phoneアプリを開発するものでした。 しかし、現在はWebブラウザ上で開発ができるツールになったので、非常に多くのデバイスで開発ができます。また、開発できるプラットフォームとして、Windowsストアアプリ、Windows Phoneの2種類がありますが、Webブラウザで開発・実行できるため、HTML5アプリとしても動作可能です。いずれにせよ、タッチ対応のアプリをタッチ環境で開発できます。 Microsoft ResearchのNikolai氏のブログによると、以下のデバイスに対応しているようです。おそらく、いまこの記事を読んでいるそのデバイスで

    タッチでHTML5アプリが作れるTouchDevelop超入門
    caramelyce
    caramelyce 2013/03/19
    iPadで仕事できるなんてステキー