[B! デザイン] planbplancのブックマーク

第一回プログラマ向けデザイン勉強会 #design4p に行ってきました - @thorikiriのてょりっき

第一回プログラマ向けデザイン勉強会 - connpass 第一回プログラマ向けデザイン勉強会 - Togetterまとめ面白かったです。以下、メモったことなどを。 Twitter Bootstrap のカスタマイズ例ちょっと遅れて行ったので、オープニングが聞けませんでした。そして、途中でメモってたものを消失させてしまいました。残念。資料→Rails エンジニアのためのTwitter Bootstrapカスタマイズ例 // Speaker Deck スライドではありませんが、Githubはこちら→machida/CustomizedTwitter Bootstrap · GitHub 色の話ベースカラーとメインカラーとアクセントカラー 70:25:5の割合くらいが調度良い。 3色決めたら、Sassでは変数定義をしてしまう。背景はテクスチャを貼るとかっこいい。参考になるもの → S

planbplanc 2012/10/29

参考に

デザイン

リンク

O'Reilly Japan - インタフェースデザインの心理学 : ウェブやアプリに新たな視点をもたらす100の指針

デザインは相手から反応を引き出すための大事な要素です。買ってほしい、読んでほしい、行動を取ってほしいなど、相手の反応を誘い出すためにデザインをします。人間の行動原理を理解していないデザインは相手を混乱させるだけで目的の結果を得ることができません。本書ではすべてのデザイナーが知るべき100の指針を実践例とともに紹介します。すべてが科学的な研究から導き出されたものです。これらの指針を理解してデザインすれば、人間の思考や行動、遊び方にマッチした直観的で人を引きつける製品――印刷物、ウェブサイト、アプリケーション、ゲーム――を作れるようになります。翻訳者によるサポートページ。サンプルPDF ● 「前付〜#008まで」（53MB）目次 1章　人はどう見るのか 001　目が受け取る情報と脳が私たちに伝える情報は微妙に違う 002　対象の「あらまし」をつかむのは中心視野より周辺視野の役目 003　

planbplanc 2012/07/02

リンク

Webデザインで使えるフリーシームレステクスチャ100枚 – poyosi.com

初めまして、@poyosiです、こんにちは。 Webデザインなどで壁紙を作る際に便利そうなテクスチャを100枚作りました。このブログの制作や、他Webサイト制作でノイズがかった背景や、ちょっと変わった背景が必要だったので自分用にちょっとした加工で簡単に背景が作れるテクスチャを色々用意しました。大きめの画像にしたので、Webサイトの背景などで繰り返し（リピート）使用しても繰り返し部分が目立たなくなるようになっています。個人利用可、商用利用可なので、もしよろしければWebサイトの背景やバナーの背景を作るときに自由に使ってみてください。テクスチャ一覧 Photoshopでテクスチャを使ってみよう 1：パターンを登録しましょう。パターンに登録したいテクスチャ画像をPhotoshopで開きます。「編集」 > 「パターンを定義」からパターンを登録します。 2：背景画像を作ってみましょう。新

planbplanc 2012/03/30

リンク

jQueryを使ったアニメーションと、ユーザビリティの話。それとCSS3。 - 甘味志向＠はてな

JavaScript Advent Calendar 2011 オレ標準コース、2日目のもろへいやです。とても遅れてすいません… 私は技術的な話は得意ではないので、デザイン面からJavaScript プログラマーに向けてのTipsを書きたいと思います。今回は、アニメーションの話を書いてみます。 jQueryは標準で、要素の表示・非表示を切り替えるときにフェードやスライドを使うことが出来ますよね。 $("#box").fadeIn("fast"); たった一行で、アニメーション効果を付加することができるので、プログラマーのみならずデザイナーの方でもjQueryを使っている人は多いんじゃないかと思います。しかし、簡単なおかげで何をするにアニメーション効果をかけまくってしまったり。あるいはアニメーション効果なんて無駄！ということで、全然使っていない人もいると思います。ですが、アニメーシ