どめ のすべての投稿

マッスルハウス9

後楽園ホールでマッスル9見てきた。
久々のマッスルは面白かった。

写真は怒られる坂井とくじで当たったトーナメント表。

Error: Suspended

じい散歩 砧

みなさんお散歩してますか?歩いているといろんな発見、ありますよね。こんな道あったのか、ここは庭の手入れが素晴らしい、なんてお屋敷なんだ!!とかとか。
私は最近良くあるのが、コレは!と思って近寄った物件が実は老人ホームでした、と言うの。ここでは、そうした体験をつづってみたいと思います。

白いヤツが現れた

今回は、小田急線の祖師ヶ谷大蔵から砧公園まで歩いてみようと思い、ろくに地図も見ずに適当に散策していた時のこと。そうなんです、いつも出会いは突然やって来ます。

これは随分とカッコいいスマートで少し無機質な印象の大きな白いビルが目に入ってきました。こうしていつも目的地まで迂回ルートで行くハメになるのです。さすがに今度ばかりはあまりにデザイン物件だったので、まさかこれは違うだろうと思いつつも近寄って見ました…が、そのまさかでした。

今度のヤツはただ者ではないっ!!

そして驚いたことに、この物件には中央にカフェのようなものが見えます。一般の方も利用可能みたいで、これは交流が出来るし人目もあるから治安も良くなる良いアイデアと思って近づいてみました。

中にはなんとカフェ以外に無印良品と薬局、スーパーまでもが!!
思わぬところで公園で食べるための食事を買って、その場をあとにしました。

うーん、普通に自分らが住みたい…

Error: Suspended

もしドラ読み終わった

とても読みやすかったので、あいた時間に残りを一気に読んだ。
ストーリーはよくある感じなのだけど、これがビジネス書というのが新しいのかも。

なんとなく小難しい印象があったものの間口を開けて、新規ユーザの開拓に貢献したんじゃない?この手法は流行るんじゃね?

少しわかった気にさせてくれるので、次のステップに踏み出そうという気分になった。
活字アレルギーあるけど、あんまり戻ることなかったのは情報量が少なかったというだけではないと思われ。

まあ、でも、それなりの内容を求めている人には不向きなのかな。
あくまで躊躇していた人たちには良いのでは。

Error: Suspended

2010.04.15 URB COLOR MEETING

URBのロゴ・カラーを決めようぜという事で、みんなでよってたかって話し合い。カラーチップとか使うとか、プログラマではなかなかできない経験だったので新鮮。

とりあえず、近しい人達からの意見でオマエラ紫でいいんじゃね?って言われていたので、メンバーでこれはと言う紫をいくつかチョイス。

んで、写真みたく白い紙に全部貼って蛍光灯の下で確認、この中で最も目に入る色を3つくらい選んで最終選考した。
へー、デザイナさんってこんなプロセスを経て色決めるのね。あらゆるところでこの色を使うことになると思われるので、こういうやり取りは大事なのかも。

しかし、意外とみんな裏方の仕事を続けてきたせいか、最後の決定はお互いにドウゾドウゾのダチョウさん状態にw
最終的には赤とも青ともつかないニュートラルな紫に決定っっ!!\ワー/

印刷用とWEB用にそれぞれ色を決めました。紙って大変なのね、勉強になるわ〜
最後に決まったデータは何だったっけな?とにかく、RGBとCMYKで準備したとよ。
DIC: 189s
C: 60% M: 95%
RGB: 7F2287

で、まずは色とロゴ決まったんでお茶。こういうの大事にして行きたい所存であります。

もしドラ読んでる

もし高校野球の女子マネージャーがドラッカーの『マネジメント』を読んだら
略して「もしドラ」読んでます。そう、まだ半分位w

ドラッカー気にはなってるけど、なんか今更感が往年の後藤真希ばりにあふれちゃうので躊躇してたけど、少し話題になってたので勢いでゲット。

設定とは言え他人の読書感を読書するという変な感じだが、読みやすいス。
特に自分、読書嫌いなので仕事の専門書以外あまり読まんのね。
きっと小説に対するラノベのような、ライト・ビジネス書の幕開けですよ、ラノベ読んだ事ないけど。

半分読んだくらいで、ドラッカーのエッセンスはちょっぴりです。
多分、これ読んだらエッセンシャル版→完全版と大人の階段のぼって行けばイイんでしょうか?
しかし、読んでるとイヤイヤそんなにうまく行かんだろとか、メンバーが意外と最初から優秀じゃね?とか、なんか違うところばかり印象に残ってしまうんだけど、これはこれでイイのかな?

Error: Suspended

HTML5 / 05. Form input

Formについて。なんだか色々追加されている模様。
詳しくはコチラを見て頂くとして、つまみ食いで見て行きます。

ブラウザはfirefox 3.6, Chrome 5.0.342.7 beta, Safari 4.0.5,  Opera 10.10, OSはMac OS X 10.6.2 です。簡単ですが、こちらから確認できます。

追加属性について

まずは、追加された属性から。今まで、Javascript で対応していた様な事が標準で出来るようになるみたいです。

autofocus

ページ見たときに最初からフォーカスが合うようになります。(文字カーソルが設定され、すぐにテキスト打てる)
複数つけるとあとに記述した方にフォーカスされます。

firefox ×
chrome
safari
opera ×

autocomplete / datalist

選択候補が補完されます。<datalist>で選択候補の一覧も作れます。本格的なものを作る場合はこれまで通りJavascriptとか組み合わせなきゃだけど、簡単なものならこれでも。
プルダウンとテキストフィールドの組み合わせでやってたような、タグ付けみたいなところで使えるかも。

firefox ×
chrome ×
safari ×
opera

placeholder

テキストフィールドにうっすら情報を表示してくれるアレですね。
autofocus設定しちゃうと消えちゃいますね。結局入力するときに見えないので個人的にはテキストフィールド下に補足テキストでいい気もしますが、Webアプリとか常用するものはあるとイイのかな。

firefox ×
chrome
safari
opera ×

required

必須かどうかチェックしてくれます。name属性の指定が必要なので、軽くチェックだけと思って省くと動作確認できませんでした。
すべてに言えることだけど、サーバ側のチェックをしなくてもよくなる訳じゃないので、あくまでユーザの利便性向上って範囲で。

firefox ×
chrome ×
safari ×
opera

他にも入力値に正規表現を使える pattern、数値の上限/下限を指定できる max/min とかあります。

追加要素について

次に追加されたInput要素。上記の属性と組み合わせるとイロイロ便利になるのかな。

search / tel / url / email

フォームの見た目を調整しつつ、場合によっては入力値のチェックも。operaだとメールアドレスもチェックしてくれますが、この辺は微妙な気も…

旧jphoneで/+?とか使えたんですが、これは通りますね。連続した … とか @直前の . とかピリオド関連もdocomoで使えたのですが、これはエラーに。今はこちらにあるように使えないようですが、昔から使っている人は引き続き使えている模様。
メールに関しては日本の携帯がアレなので、使わない方が無難な気もします。

全角を半角にしたり、ひらがなとカタカナの相互変換とかあるといいのですが、まあ日本だけの問題ですからね…

search tel url email
firefox × × × ×
chrome × × ×
safari × × ×
opera ×

date / time / datetime / datetime-local / month / week

カレンダー入力ができるようになります。min / max / step といった属性の設定が可能。
これデフォルトで出来ると助かりますが、使い勝手が悪いとみんな使わなそうな気も。今のところoperaだけですが、もう一声な感じです。

firefox ×
chrome ×
safari ×
opera

number

数値入力のみ受け付けます。こちらも min / max / step が設定可能で、step は小数も使えます。
全角で入力すると無視されますね…たまに気にせず入力する人もいるので微妙ですね。テキストフィールド横に数値を上下できるボタンがでるのはちょっとイイかもですが。

firefox ×
chrome ×
safari ×
opera

range

スライダで値を選択できます。min / max で範囲を指定できます。(デフォルト0〜100)

firefox ×
chrome
safari
opera

他にも追加要素はありますが、まだまだ各ブラウザの実装を待たねばならない段階ですね。今のところoperaが一歩リードというところでしょうか。
各要素と属性の組み合わせについては下記が詳しいので参考にして下さい。
HTML5.jp / input要素

Error: Suspended

この本を読みながら勉強中

HTML5 / 04. Video

Canvas関連たくさんあるけど、目的もなく円とかグラフとかやってもきっと忘れるので、ここは華麗にスルーを決めて次に進もうw

で、<video>タグ。こちらも追加タグですが、今後の動向に注目。
Mozilla, Googleともに誰もが自由に使えるフォーマットの模索をしているようです。

> @IT / ネット参入に“料金所”は要らない、Mozilla
> ITmedia News / YouTube、HTML5動画プレーヤーをテスト公開

YoutubeでもHTML5でテスト配信しているようです。

Youtubeの動画を引用する時に、<video src=”http://www.youtube.com/v/****”></video> 的な記述が出来るのはまだちょっと先のよう。
これできたらスゴイよね。
> HTML5.jp / video要素 – html5doctor

また、今のFlash使ったみたいに、どのブラウザでも動作するというのも少し様子見なのかな…
> マイコミジャーナル / HTML5 video、ブラウザ対応状況とコーデックまとめ

こちらにFirefox3.5以上で動作するサンプルがあります。
> 株式会社あゆた / Video要素のサンプル

videoタグの要素についてはコチラ。
> WHATWG / The video element

Error: Suspended

この本を読みながら勉強中

HTML5 / 03. Canvas

いきなりCanvasか〜、楽しそうな機能が先に紹介されてますな。
まずは下準備。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
<head>
<title>03. Canvas</title>
<meta charset="UTF-8">
</head>
<body>
<canvas id="canvas" width="320" height="240"></canvas>
<script type="text/javascript">
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
// ココにイロイロ書いていくよ
context.stroke();
</script>
</body>
</html>

四角に塗りつぶす。Reference

1
context.fillRect(x, y, w, h);

テキストを書く。Reference

1
context.fillText(text, x, y [, maxWidth ] );

線を引く。Reference
画面から出てもクリッピング(スクリーンの中だけ描画)されますね。

1
2
3
4
context.beginPath();
context.moveTo(x, y);
context.lineTo(x, y);
context.closePath();

四角を描く(塗りつぶしなし)Reference

1
context.rect(x, y, w, h);

03. Canvas
うーん、なんかすごく昔にやったOpenGLとかを思い出します。

Error: Suspended

この本を読みながら勉強中

HTML5 / 02. 文書構造

<div id=”header”>, <div id=”footer”> とかみんなが使ってる通例はタグとして用意されたみたいね。
<header>, <footer>とか<nav>, <aside>とか。
<header>, <footer>は、複数あっても良いとのこと。

<nav>は、いわゆるグローバルナビってヤツですな。
<menu>ってのもあるみたいだけど、これはインタラクティブなWebアプリ向けとのこと。
使い方は、実装がいろいろ出てきてからチーム内でルール決めしたりかなあ。

あとは<section>, <article>もあるけど、こちらも直感的にはわかりにくい。
文章の区切りだから、<h1>とかの見出しがセットで必須とのこと。
さらに<article>は、twitterやBlogみたいにまるっと引用されるときに使いましょうって感じ。

<img>とかと関連するテキストをまとめる<figure>ってのもあるから、より意味のあるカタマリを意識してマークアップしてねって事なのかな。
で、レイアウト整形とかで使う場合は素直に<div>使いましょうってさ。

詳しくは ココ とか ココ とか ココ を。

Error: Suspended

この本を読みながら勉強中

HTML5 / 01. HelloWorld!

HTML5勉強開始(今頃かい!!)

XHTMLの反省を生かしてか、結構柔軟なのね。

タグも結構省略出来るみたいで、jphone対応してた頃のHTMLを思い出した。

という事でココはプログラマらしくHelloWorld!から。

省略の限りをつくしてるので、良い子のみんなは真似しないでね。

01. Hello World!

あとは、EclipseのテンプレにHTML5を追加っと(こっちはちゃんとしたのを…)

1
2
3
4
5
6
7
8
9
<!DOCTYPE html>
<html>
<head>
<title>${cursor}</title>
<meta charset="UTF-8">
</head>
<body>
</body>
</html>
Error: Suspended

この本を読みながら勉強中