ウノウラボ by Zynga Japan: わんわん
きゃんきゅーんわんわおんわーんばうきゃんきゃんきゃうんわおんわおんわんきゃんきゃんきゃうんきゃんきゃん! わうわーん。 わんわーんわんわうわん。 わんわおんわんわおんわん! きゃうんわーんわうきゅーんわおんわーんばうわおんわんわおんわん。 わーんわーんきゃんわうわんわんわおん! わんきゃんきゃんわうわーんわんきゃんわおんわんわおんわん! わん。 きゃうんきゃんきゅーん。 わーんわんきゃんわうわーんばうわんわんわうきゅーんきゃんわんわーんわおんわん。 きゃうんわおんわおんわおん! きゃんわおんわおんわんばうわおんわんばうきゃんわおんきゃうんわおん! わんわおんばうきゃん! わうきゃうんきゃんわおんきゃんきゃんわおん! わんきゃんわーんわーんわんきゃうんわんきゃんきゃんきゃんきゃんきゅーんきゅーんわおんわんわおんわーんわーんわんわんわんばうわおんわんきゃんわーん!
ウノウラボ by Zynga Japan: iPhone向けのサイトを作るときのちょっとした気配り
yamaokaです。 だいぶiPhoneやAndroidといったスマートフォン向けのwebページを作ることが増えてきたのではないでしょうか。ちょっとした気配りで使いやすくなるケースもあるかなと思うので、いくつか使えそうな工夫について書いてみたいと思います。 ただし、今回はiPhone向けです。 タップされた場所をハイライトする iPhoneのSafariでは「-webkit-tap-highlight-color」という拡張された属性があり、タップされた箇所に色を付けることができます。CSS3ではRGBaによる色指定ができるので、半透明の色を指定すればタップされた箇所をわかりやすく示すことができます。例えば、-webkit-tap-highlight-color:rgba(255,0,0,0.40);と指定すると薄い赤色を付けることができます。「outline:none;」と併せてリンク文
ウノウラボ Unoh Labs: ASIHTTPRequestを入れてみた
ご無沙汰しています。Brandonです。 今回は私がジンガジャパンでやってる実務とまったく関係がないObjective Cのライブラリ「ASIHTTPRequest」を紹介したいと思います。 前の記事の続きをやってたら、たまたま「ASIHTTPRequest」に出くわして、これはなかなかよさそうなのでみんなさんにご紹介しようと思いました。 （もし既に知っていたらどうもすみません。前の記事からまったくiPhone関係の物を触ってなかったこともあって、情報が遅いのは承知しています。） AppleのiOS SDKに入っているNSMutableURLRequestでHTTPリクエストを送るやりかただと、以下のようなコードになります。 （下記は前の記事の一部の内容になります） /** * リクエスト(requestObj)に認証情報をつける関数 */ - (void) addAuthToWeb
ウノウラボ Unoh Labs: Hello,Lithium!
こんにちは。４月に入社したyuzoです。 今回は元CakePHPのDevelopperが新たに立ち上げた新しいフレームワーク「Lithium」を試してみました。 準備する この記事を書いている現在のバージョンは0.9.5です。以下からダウンロードできます。 http://rad-dev.org/lithium/versions ひとまず、draftsのブログチュートリアルを動かすまで、を目標とします。 http://rad-dev.org/lithium/wiki/drafts/blog-tutorial Lithiumの動作環境は ・HTTP Server (Apache + mod_rewrite recommended) ・PHP 5.3.0 or higher ・CouchDb, MongoDb, MySQL 5 or SQLite 3 for applicatio
ウノウラボ Unoh Labs: 条件式でのnullの扱い(php)
はじめまして、3月に入社した太田です。 以前はほぼJAVAオンリーで開発を行っていたのですが、ウノウに入社してからphpを使うようになりました。そんな中で一番戸惑った暗黙の型変換、特にnullの扱いについて、非常に基本的な事ではありますが備忘も兼ねてまとめておこうと思います。 nullをnullと比べてみる if (null == null) { echo '出力される'; } if (null === null) { echo '出力される'; } 上記の条件式はいずれもtrueを返します。 nullとbooleanを比べてみる if (null) { echo '出力されない'; } if (null == false) { echo '出力される'; } if (null === false) { echo '出力されない'; } 暗黙の型変換によって、2番目のみtrueが返されます
ウノウラボ Unoh Labs: 携帯向けXHTML
おはようございます。 最近携帯向けのページを作成することが多いので、携帯向けのXHTMLと格闘しておりますkayです。 その際に個人的に感じたこと等をまとめてみましたので、少しでもご参考になればと思います。 なお、ここでご紹介しますものはあくまでも個人的な趣味に基づいており、一定時期より古い機種は配慮しておりませんのでご了承ください。 3キャリア対応の携帯サイトを作成する場合、docomoに合わせてCSSをインラインで書く必要があります。 これはPCサイトを作成したことのある人にとってはきっととても気持ち悪いことなんですが、我慢してstyle=""を使っています。 また携帯ですので、実際に出来ることはとても限られており、機種やキャリアによっても異なりますので個人的にはベーシックなものを中心に使用してデザインすることをおすすめします。 その際、一番制限が厳しいのは相変わらずdocomo
ウノウラボ Unoh Labs: Cactiによるサーバ稼働状況の監視と異常通知
こんにちわ。 7月2日に、エイガでつながるクチコミサイト「映画生活」のリニューアルが無事に終わってほっとしているhideです。近々、映画APIなども公開していきたいと思っていますので、どうぞよろしくお願い致します。 さて、今日は、Cactiを使ったサーバ稼働状況の監視について説明したいと思います。サーバの稼動状況を監視するツールとしてはMRTGが有名ですが、ウノウではCacti を使っています。MRTGと比べて、Webブラウザ上から設定を行うことができる、データはMySQLに保存されるので過去の任意の時点を詳しく見ることができるなどの点で優れています。 Cactiは普通にインストールしただけだとサーバから取得したデータをグラフ表示するだけなのですが、http://cactiusers.org/にて公開されている Cacti Plugin Architecture というパッチを当てるとプ
ウノウラボ Unoh Labs: Q4Mを触ってみる
yukiです。そろそろクリスマスですね。みんな浮かれていればいいと思います！最近急に目が悪くなって、ツリーの赤色電球と居酒屋の赤提灯の色が判別出来なくなってきました。嘘です。 今回は、みんな大好きメッセージキュー、Q4Mを触ってみた感想を今更ながらレポートします。 公式ページはこちらhttp://q4m.31tools.com/ Q4Mはサイボウズラボの奥 一穂氏が開発されており、MySQLの5.1以上でストレージエンジンとして利用できるメッセージキューで、MySQLプラグインとしてGPLライセンスで配布されております。 特長 MySQLのストレージエンジンとして利用できるので、テーブル作成時にストレージエンジンを指定するだけで利用できます。 CREATE TABLE hoge ( ... ) ENGINE = QUEUE キューの作成(enqueue)は通常のレコード操作と同様にINSE
ウノウラボ Unoh Labs: WEBアプリのテストに便利なFirefoxのアドオン
こんにちは！ のりPと同い年ですが、クラブ通いは●年前に卒業しました やまもと＠テスト番長です。 早いもので、もうお盆の帰省シーズンですね。 今年の夏は世間の騒がしい日々が続いておりますが、みなさんお変わりございませんでしょうか。 さて、Firefoxといえば豊富なアドオンですが、今回はテスター目線で WEBアプリケーションのテストに便利なFirefoxアドオンを並べてみたいと思います。 Firesizer ブラウザの画面サイズを整えることが出来ます。 InFormEnter 準備しておいた値を入力フォームにセットしてくれます。 MeasureIt 画面上のピクセルサイズを測ることが出来ます。 Regular Expressions Tester 正規表現での検索がその場で出来ます。 FireShot キャプチャにメモを書き込んだり出来ます。 Web Developer F
ウノウラボ Unoh Labs: ゼロからはじめる携帯サイト構築。
こんにちは、日食を妙に楽しみにしていたわりには見ようともしなかった ryosuke です。曇りで残念でした。曇りでも日食と分かるぐらい暗くなったら嬉しかったのですが、東京ではそんな事は全然ありませんでしたね。 さてさて、そんな私ですが入社後半年が経過したところで、入社当初より携わって来た携帯サイト構築に関して得た知識(失敗談)をまとめてみようと思います。 初ラボブログ記事でも触れた様にそもそも本格的な携帯サイト構築は経験に乏しく、バッドノウハウの塊の様な面倒な思いこみが先行しがちだったわけですが(実際バッドノウハウの塊ですが)、端末の機能や表現力が豊かになるのと同時に開発環境的なツールやライブラリの充実、ノウハウの蓄積と情報公開により随分すんなり入って行けた様に思います。 結局はキャリア感の差異を知り吸収する事がすべて いきなりですが、PCサイトと携帯サイトの違いで最も厄介な所はこれにつき
ウノウラボ Unoh Labs: Sinatra気に入った
先日、まちつく！が正式リリースになりました。よろしければ是非携帯でアクセスして遊んでみてください。 おはようございます。内田です。 今までRailsを使うほどでも無いアプリはオレオレフレームワークで作ってたのですが、最近巷で流行ってるsinatraのコードを読んでみたら必要十分な機能があり、センスも良く、とても気にいった。 今回は公式ドキュメントの流れで、使いそうな機能をまとめてみました 一番簡単な例 sudo gem install sinatra # app.rb require 'rubygems' require 'sinatra' get '/' do 'Hello, world' end ruby app.rb curl http://localhost:4567/ Routes HTTPメソッドにURLとブロックを渡します get '/' do end post '/'
ウノウラボ Unoh Labs: 1時間で作る簡易スクリプト言語(JavaScript)
さかとくです。最近では、JavaScript上でJavaバイトコードが実行できたり(Orto)、JavaScriptでScheme(jsScheme)が動いたりと、とても楽しい状況ですね。ブラウザさえあれば、その上でいろんなプログラミング言語を体験することができるのですから！ 私も、これまで、マクロ言語やスクリプト言語をいくつか作ってきました。（代表作は、音楽のプログラミング言語「サクラ」や、日本語プログラミング言語「なでしこ」などです。）今は、ブラウザ上で動く日本語プログラミング言語を開発中ですが、これはまだ見せられる状況ではありません。 そこで、ウノウラボを書くのに与えられただろう時間(約１時間)で、オリジナルのプログラミング言語を作ってみようと思います。もちろん、JavaScriptだけで。 では、はじめてみましょう！ (1) コンパイラコンパイラをゲットする はじめに用意するのは、
ウノウラボ Unoh Labs: JavaScript でクリップボードを扱う方法 (Flash10対応版)
酒徳(クジラ飛行机)です。以前、ラボブログにJavaScriptでクリップボードを使う(IE/Firefox) という記事を書きました。これは、Flash Player の機能を利用して、JavaScript でクリップボードを操作するというものでした。 ところが、Flash Player 10 になって、セキュリティ制約が強化されたため、この方法でテキストをコピーすることができなくなってしまいました。そこで、このセキュリティ制約を回避してクリップボードを扱う方法と、簡単に「コピー」ができるライブラリを公開します。 まず、Flash Player 10 のセキュリティ制約について紹介します。具体的に言うと、クリップボードにテキストをコピーするメソッド「System.setClipboard()」の使用が制限されるようになってしまいました。以前はこのメソッドを任意のタイミングで呼び出すことが
ウノウラボ Unoh Labs: JavaScriptでクリップボードを使う(IE/Firefox)
こんにちは、さかとくです。師走で忙しいですね。今回は、JavaScriptでクリップボードを使うプログラムを作ってみます。IEとFirefoxで動く簡単なライブラリを作ってみましたので、参考にしてください。 IEだけで動かすのは、簡単なのですが、FireFoxではクリップボードを操作する方法がありません。そこで、FireFoxでも使えるようにFlashを使って工夫してみます。 まず、参考までにIEでクリップボードを扱うJavaScriptを見てみましょう。IEなら以下のように一行書くだけです。
ウノウラボ Unoh Labs: Webブラウジングを快適にするAutoPagerize
こんにちわ、山下です。 Software Design 10月号にサーバ監視ツールCactiについての記事を書きました。この号のNagios,Swatch,Wiiの記事もウノウ・エンジニアによるものですので、ぜひ興味のある方はご覧ください。 さて、今日はWebブラウジングを快適にするAutoPagerizeというツールを紹介します。AutoPagerizeはGreasemonkey用の拡張スクリプトで、今、自分のまわりで爆発的に流行っています。先日の出張 Shibuya.js 24でも作者の方が発表されていたのでご存じの方も多いのではないでしょうか。 念のために何をするツールかを説明しておくと、Googleなどの検索結果で次のページを表示するときに「次へ」ボタンを押さなくてもページ下部までスクロールすると、勝手に次のページを読み込んでその下に付け足してくれるものです。なかなか文章では伝わ
ウノウラボ Unoh Labs: 四角いリンク
yamaokaです。 最近タブをメタファーにしたナビゲーションをよく見るようになりました。タブには大抵、内容を示すキャプションが付けられています。さて、どこからどこまでがリンクでしょうか。どの部分をクリックすればそのタブを選択できるでしょうか。 例えば、キャプションの文字だけにリンクが貼られている場合。利用者はタブの中のさらに狭い範囲、文字の部分を狙ってクリックしなくてはなりません。 実はマウスの操作というのは難しいのです。狭い範囲を狙って指定することにはあまり向いていません。目的到達のために狭い範囲のクリックを強制するのはどう考えてもよいインターフェースではありません。 そこで大抵のタブ型インターフェースではタブの枠の中全体をリンクとして扱えるようになっています。 アンカー要素のdisplay属性をblockにして、必要な高さと幅を与えることでリンクの範囲を四角形に広げることができますね
ウノウラボ Unoh Labs: Macでのスクリーンショットの撮り方まとめ
yamaokaです。 Mac（Mac OS X）でスクリーンショットを撮る方法についてまとめてみます。いつも忘れてしまうので個人的な備忘録だったりしますが、同じことで悩んでしまう方にとって少しでも参考になれば幸いです。 「Command + Shift + 3」を押下 単純に画面全体のキャプチャ画像が必要な場合に使います。ショートカットキーを押した瞬間、デスクトップに画面全体のキャプチャ画像が保存されます（PNG形式）。 「Command + Shift + 4」を押下 マウスカーソルが十字（ヘアライン）に変わり、画面上の範囲を選択できるようになります。ドラッグして範囲選択した上でマウスのボタンを離すと、選択範囲のキャプチャ画像がデスクトップに保存されます（PNG形式）。 「Command + Shift + 4」を押下、さらに「Space」を押下 マウスカーソルがカメラの形に変わり、その
ウノウラボ Unoh Labs: CSSを書くときに使っているツールの紹介
yamaokaです。 今回は、ぼくが普段CSSを書くときに使っているツールを紹介します。 Firebug 入手先: Firebug :: Firefox Add-ons Firebug posted by (C)フォト蔵 もはやJavaScriptの開発には欠かせなくなった感のあるFirebugですが、CSSを書くのにも使えます。 ボックス要素を調査（inspect）、CSSを書き換えてレイアウトを考える参考にしたり、 HTMLを書き換えてid属性やclass属性を書き換えて適用するスタイルを変更した場合の変化を試してみたりします。 IE Develper Toolbar 入手先: Download details: Internet Explorer Developer Toolbar IE Developer Toolbar posted by (C)フォト蔵 前述のFirebugと同
ウノウラボ Unoh Labs: hasLayoutとは何か
yamaokaです。 CSSに携わっている方なら、Holly hackを使ったことがあるかもしれません。 /* Hides from IE5-Mac \*/ * html .foo { height: 1%; } /* */ Internet Explorer（以下IE）で、レイアウトに問題のある要素に 上記のようなスタイルを指定をすると、 あら不思議、まともな表示がなされるというものです （上記のままではIE7に対応していませんが…）。 さて、どうしてレイアウトが意図したとおりに行われるようになるのでしょうか。 IEのhasLayoutプロパティ IEでは、全ての要素が 「hasLayout」という読み取り専用のプロパティを持っています。 これはそれぞれの要素がレイアウト情報（＝要素の幅・高さなどに関する属性情報）を 保持しているかどうかを示す値で、 デフォルトの状態では「hasLayo
ウノウラボ Unoh Labs: jQueryのパフォーマンス最適化に関するTips
こんにちは、山下です。 今回は、jQueryのパフォーマンス最適化について説明したいと思います。 軽量と言われているjQueryですが、いろいろな機能を実現しようとして複数のプラグインを導入すると、だんだんと動作が重くなってきます。サーバ側をいくらチューニングしたところで、ブラウザ側での処理に時間がかかっていたら、せっかく訪問してくれたユーザに重いサイトとして認識されてしまいます。以下に、ウノウで運営している「映画生活」で実際に行っている方法を紹介します。 1. Packed版ではなくMinified版を使う jQuery1.1まではPacked版のみだったのですが、jQuery1.2からMinified版もダウンロードできるようになりました。Packed版よりもMinified版を使うことをお勧めします。どう違うのかというと、Packed版はファイルサイズを極限まで削減するために静的辞
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
