タグ

ブックマーク / labs.unoh.net (21)

  • ウノウラボ by Zynga Japan: I love spacer

    携帯向けXHTMLを書いているとバッドノウハウばかりが身について行くのですが、その中で私が愛してやまないspacerのことについて熱く語ってみようと思います。 私が個人的に見つけたバッドノウハウばかりですので、これら以外にもっとスマートな方法がありましたら是非ご教示ください。 一般的な使い方 <br /><br />での改行するなんてとんでもない、でも3キャリ対応しようと思ったらline-heightも使えないし。。。そんなことでお悩みの方が良く使っているのがこのspacer。

  • ウノウラボ by Zynga Japan: iPhone向けのサイトを作るときのちょっとした気配り

    yamaokaです。 だいぶiPhoneAndroidといったスマートフォン向けのwebページを作ることが増えてきたのではないでしょうか。ちょっとした気配りで使いやすくなるケースもあるかなと思うので、いくつか使えそうな工夫について書いてみたいと思います。 ただし、今回はiPhone向けです。 タップされた場所をハイライトする iPhoneのSafariでは「-webkit-tap-highlight-color」という拡張された属性があり、タップされた箇所に色を付けることができます。CSS3ではRGBaによる色指定ができるので、半透明の色を指定すればタップされた箇所をわかりやすく示すことができます。例えば、-webkit-tap-highlight-color:rgba(255,0,0,0.40);と指定すると薄い赤色を付けることができます。「outline:none;」と併せてリンク文

  • ウノウラボ by Zynga Japan: Photoshopのスクリプトを気軽に複数ファイルに適用する

    みなさんこんにちは。11月に入社したデザイナーの935です。 デザインの仕事をしていると「バッチ処理ではできない複雑な作業を複数のファイルに一度に適応したい」という気持ちになることがありませんか?そんなとき私はjsflなんかと比べると若干マイナーな感のあるphotoshopのスクリプトを愛用しています。 でも、photoshopのスクリプトってメニューからだと「一度に開いたファイル一つ」にしか適応できないですよね?そうすると、せっかくスクリプト書いたのに「それってなんか片手おちじゃない?どうせなら一度にやってよ」という気持ちになるわけです。 そこで今回はドロップレットを使って複数のファイルにスクリプトを適用する方法をご紹介したいと思います。 まあ、特定のフォルダのファイルリストを取得してforで回すようなスクリプト書いてもいいんですが、今回はドロップレットを使って気軽にやってみましょう。

  • ウノウラボ Unoh Labs: Illustratorの小技 その3 ブレンド機能をパスにする

    たけぞうです 前回、ブレンド機能の小技をお伝えしましたが 今回はそのブレンド機能をパスにする小技を紹介します ※使用しているのはIllustratorのCS4です これはパスではないため 図の5つ並ぶ真ん中の四角だけを動かしたり色を変えたりする事は出来ません また 「パスのアウトライン化」をしても適応されません ではどうしたらよいか オブジェクトの「透明部分を分割・結合」を選択 詳細設定が出てくると思いますが、そのまま先に進めても構いません すると

  • ウノウラボ Unoh Labs: 絵文字のためにsymfonyのカスタムハンドラーを作ってみました

    こんにちは、kayです。 携帯サイトのdocomo絵文字が文字と同じ色になっていると気になって気になって仕方がない今日この頃なのですが、YAMLでデフォルトの色を設定して絵文字を出力するときに自動的にその色にしてくれるなんてことをしたいなぁと思っていました。 しかし、sfYaml::load()をすると毎回パースしてしまうのでとっても頻繁に呼び出される絵文字の色にそれを使ってしまうと大変なことになってしまいます。 app.ymlなどのsymfony側の設定YAMLはパース結果をキャッシュしてくれるのですが、それを絵文字の色の設定でもすればいいと大先生に言われましたのでカスタムハンドラーを作って対応することにしました。 symfonyのビルドインハンドラー まず、symfonyにはビルトインハンドラーが多数存在しますが、今回は汎用的に使えるsfDefineEnvironmentConfigH

  • ウノウラボ Unoh Labs: DOMろうTouchコンテンツ

    Flashエンジニアnao ozawaです。最近あんまりゴリゴリとFlashでコーディングしていません。なんでかなぁ!まるで働いていないみたいじゃないですか。一応ちゃんと仕事してるんですよ? まぁ、そんな感じの毎日なので、実はここ数日、作業のかたわら、スマートフォン向けページのレイアウト方法を色々考えております。 ・ブラウザの画面回転するのめんどくさくね? みなさんご存知のように、iPhoneを筆頭に最近のスマートフォンは、携帯を横に向けると、合わせてくるりと画面が横レイアウトに変わります。斯(か)く言う私も初めてソレに遭遇したときには驚きを隠せず、暫くは日がな一日iPhoneをくりくりと縦にしたり横にしたりして過ごしていたものです。それはそれは楽しかった。 が、しかし、最近スマートフォン向けのページを作る具体策を考えてみて、はじめて気がついたのです。 画面の幅が変わるのって、めんど

  • ウノウラボ Unoh Labs: 携帯とスマートフォンでsymfonyのテンプレートを切り替える

    こんにちは。中村です。 先日、まちつく!mixi版がスマートフォンに対応しました。 スマートフォン対応にあたって、元々まちつく!が携帯専用アプリであったために変更しなければいけない点がいくつかありましたが、その中でも今回はテンプレートの切り替えについて書きたいと思います。 時間的な都合もあり方針としては、基的には携帯用のテンプレートを表示できるようにして、よく使われる機能についてはスマートフォン用のテンプレートを用意して表示するようにしました。 ※まちつく!で利用しているsymfonyのバージョンとは違いますが、ここでは最新バージョンの1.4.7の場合になります。 独自のviewクラスを定義する どのページがスマートフォンに対応しているかを管理することなく対応したかったので、アクセスしている端末とテンプレートファイルの有無によって挙動を変更することにしました。読み込むテンプレートの切り替

  • ウノウラボ Unoh Labs: PNG画像書き出しの「あとちょっと軽くできたら...」を可能にするファイル作成TIPS

    こんにちは。ウノウでデザイナーをしているChristelです。 銀色の全身スーツを着、透明チューブの中を走る車で移動する21世紀で暮らす私たち。 夢のクラウド化が囁かれる昨今ですが、未だ携帯電話関連の画像作成には、スカイツリーよりも高い容量の壁があります。 「Flashの3階層メニューで文字も画像で100kb以内でよろしく」とか 「あれとこれとそのファイル合わせて一回で表示するのは20kb以内でね」など、 関係者の皆さんは、1バイトに泣き、1バイトに笑う日々を送っておられることでしょう。 今日はそんな皆さんに 「ビットマップデータを透過PNGで書き出すとき、クオリティを下げずにサイズをちょっとだけ減らせる画像作成のコツ」 をご紹介します。ニッチ過ぎて申し訳ないです。 1)まずPhotoshopで画像を作成 ↑ 一世を風靡した感のあるWEB2.0風。画像の痛さには目を瞑ってください。

  • ウノウラボ Unoh Labs: 線画のゴミ除去方法

    初めまして。ウノウでデザイナーをしているyamamotoです。 最近は色々と便利なが出ているので、当たり前の技術になっていますが 知っているとチョビット便利なフォトショップ上でのゴミの取り方をご紹介します。 画像データはフォトショップ上にて直接描いてしまったサンプルですが 実際は紙に描いたものをスキャニングしたものだと仮定して下さい。 スキャニングし線を抽出するとどうしてもゴミがついてきてしまいます。 そこで便利なゴミの取り方のご紹介です。 1:線画部分だけを抽出した状態 レイヤー部分をダブルクリックしレイヤースタイルを表示します ※フォトショップ上レイヤータブからもレイヤースタイルを選択できます。 この時、境界線を選択し、塗りつぶしのタイプをカラーにし カラーをわかりやすい色にします。ここでは赤を選択しています。 描画モードを通常にし位置を外側にします。 ※大抵はカラー以外はデフォル

  • ウノウラボ Unoh Labs: MySQLのチューニングのためのデータの集め方

    いつの間にか会社で古株になったyamaokaです。 webアプリケーションのバックエンドにMySQLを使っている場合、 クエリ(SQL)のチューニングをする必要がありますよね。 皆さんはチューニングの計画をどのように立てていますか。 もちろん、既に明らかに重いことが想定されているページがあれば、 その処理で使われているクエリを中心にEXPLAINなどを使って解析していけばいいと思います。 でもそうではなく、全体的にクエリの見直しやチューニングを行いたい場合は 実際に実行されているクエリを確認していくという作業が必要です。 そこで使うことができる3つの方法について書きたいと思います。 遅いクエリを記録する MySQLにはスロークエリログといって、 実行に時間がかかったクエリを記録する機能が最初から付いています。 /etc/my.cnfに次のように設定を書けば実行時間が1秒を超えたクエリが出力

  • ウノウラボ Unoh Labs: symfonyのsfBrowserを使ってコンソールツールを作成してみました

    はじめまして、4月に入社しました、はなだと申します。 以後よろしくお願いいたします。 私自身は、これまでにJava/C#/C++/Perlなどを使った開発を行って来ましたが、現在は(はじめての!)PHPを使ったソーシャルアプリの開発を行っています。 これまでは、新しい言語を学習する際に、サンプルやチュートリアルを終えたあとで、ちょっとした作業を簡略化するためのツールをチョコチョコとつくっていました。今回は、はじめてのPHPということで、symfonyのsfBrowserを使った、コンソールツールを作ってみました。 このツール開発を通じてやりたいことは次のような内容です。 開発しているsymfonyのURLを指定して、コンソールベースのツールでリンクを遷移させたい できればUser-Agentとして携帯電話に対応させたい さらに  symfonyの内部構造を理解したい PHPの言語仕様や

  • ウノウラボ Unoh Labs: オブジェクトをマウス操作で移動させる

    こんにちは、はじめまして! goです。 6月からActionScriptのプログラマとして、ウノウに参画することになりました。 エンジニアとして経験がまだまだ浅いので、リファレンスを片手に日々奮闘しております。 Flashを扱うエンジニアとして、ここではインタラクションに関わる小ネタをActionScriptで披露していこうかと考えています。 ということで、今回はマウスを使ったオブジェクトの移動のお話です。 以下の方針に従って、作業を進めていきます。 1、画面全体でMOUSE_DOWNとMOUSE_MOVEのイベント監視 2、MOUSE_DOWNのイベントが発生したときに、マウスの座標、移動対象のオブジェクトの座標を取得します。 3、MOUSE_MOVE時に、移動前のマウス位置と、移動後のマウス位置の差(つまり移動量)を取得します。 4、移動前の円の座標に移動量を加算して、移動後

  • ウノウラボ Unoh Labs: symfonyを使ってみた所感

    こんにちは、オマタです。 4月に入社したばかりでここに書ける小ネタがないのですが、 symfonyを使い始めてみて便利だなと思ったことを書いてみたいと思います。 jobeetが用意されているところがすごい symfony初心者は、jobeetと言われるチュートリアルを参照しつつ、 説明の通りに自分の環境で動かしながら使い方に慣れていくのが一般的です。 このjobeetがとてもよく出来ていて、これを一通りこなすだけでインストールから エンジニア求人サイトの正しい作り方までを勉強することができます。 途中、日語訳の説明文に間違いや分かり辛いところがあったりしますが、 そのときは個人blogに書かれているjobeet正誤情報が助けてくれます。 ちなみにウノウではjobeetの14日目までが習得推奨となっています。 jobeetへのリンク symfonyコマンドがすごい sym

  • ウノウラボ Unoh Labs: NetBeansはじめました。

    はじめまして、今年4月に入社しましたtomohisaです。 よろしくお願いします。 今日は総合開発環境、NetBeansを紹介したいと思います。 さっそくですが、皆さんはPHPの編集にどのようなエディタをお使いでしょうか? 秀丸のようなプレーンなテキストエディタでしょうか? それともDreamweaverのようなHTMLエディタ? はたまたEclipseのような総合IDEなどもありますね。 僕はウノウに入社した直後viを使用していましたが、 どうも馴染めずいたところ、先輩に教えていただきNetBeansの存在を知りました。 ◯よいところ1:WEBアプリ開発にピッタリ 僕は以前Eclipseをメインに開発していたのですが、 一番使い勝手が悪かったのは「FTPクライアントとして動作しないこと」でした。 機能を追加できるプラグインもありましたが、どれも決め手にかけるものが多い・

  • ウノウラボ 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: Illustratorの小技 その2

    たけぞうです。 前回に引き続き、イラレを使った小技を紹介します。 今回はブレンドの機能を使いたいと思います。 この絵のキャラクターに色をつけたいと思います。 単色で塗るのも味気ないから、と グラデーションの円形あたりを使って塗ってみましょう。 こんな感じに立体的なりました。 が、 グラデーションが円形なのに対して キャラクターの形が真ん丸でないので この微妙な感じ、苛立たしい 出来ることなら往復ビンタしたい気持ち、わかります。 そんなときに、ブレンド 使ってみましょう。 まずは前回もお伝えしたCtrl+Fで このキャラクターの肌(?)のパスが上に重なるようにします。 ※Ctrl+F(選択したパスを上に重なるようにコピペしてくれる) そして上のパスを小さく縮小します。 サイズはその時の気分しだいで、お好みでどうぞ。 色も変えます。 上の部分を白、下の部分を青に 単色でかまいません、グラデでも

  • ウノウラボ Unoh Labs: 携帯向けXHTML

    おはようございます。 最近携帯向けのページを作成することが多いので、携帯向けのXHTMLと格闘しておりますkayです。 その際に個人的に感じたこと等をまとめてみましたので、少しでもご参考になればと思います。 なお、ここでご紹介しますものはあくまでも個人的な趣味に基づいており、一定時期より古い機種は配慮しておりませんのでご了承ください。 3キャリア対応の携帯サイトを作成する場合、docomoに合わせてCSSをインラインで書く必要があります。 これはPCサイトを作成したことのある人にとってはきっととても気持ち悪いことなんですが、我慢してstyle=""を使っています。 また携帯ですので、実際に出来ることはとても限られており、機種やキャリアによっても異なりますので個人的にはベーシックなものを中心に使用してデザインすることをおすすめします。 その際、一番制限が厳しいのは相変わらずdocomo

  • ウノウラボ Unoh Labs: symfonyのfunctional testを携帯のUserAgentにしよう

    こんにちは市丸です。 symfony コマンドで generate:module をすると、functional test用ファイルが自動生成されます。 symfonyで携帯サービスを作る場合、frontendは携帯端末 backendではPCブラウザでアクセスすることがほとんだと思います。 frontendのfunctional testを携帯のUserAgentにする方法を紹介します。 ※試したのは、symfony 1.4です。 まずスケルトンをコピー mkdir -p data/skeleton cp -r lib/vendor/symfony/lib/task/generator/skeleton/module data/skeleton/ data/skeleton/module/test/actionsTest.phpを以下のように改変。 <?php include(dir

  • ウノウラボ Unoh Labs: symfony/Doctrineのキャッシュ機能

    symfonyプロジェクト全体で共通で利用される設定は、ProjectConfigurationクラス(config/ProjectConfiguration.phpファイル)のconfigureDoctrine()メソッド内で行うとよいでしょう。 以下の例では、クエリーキャッシュと結果キャッシュの両方にmemcachedドライバを設定しています。また、それぞれのデフォルトの存続時間を1時間に設定しています。 class ProjectConfiguration extends sfProjectConfiguration { public function setup() { $this->enablePlugins('sfDoctrinePlugin'); } public function configureDoctrine(Doctrine_Manager $manager) {

  • ウノウラボ Unoh Labs: Flash Liteコンテンツを動的に合成してみる

    おはようございます。うちだです。 日、mixiアプリモバイルにて「バンドやろうよ!」をリリース致しました。是非遊んでみてください。 今回は「バンドやろうよ!」でも使った、Flash Liteコンテンツの合成を軽めに紹介します。 Ming Flash Liteの合成にはMingを使います。 Mingを用いるとswfの合成や変数書き換えが非常に簡単にできます。 但し、一部機能にバグがあるので要注意ですが、合成や変数書き換えだけに利用するのであれば今のところ問題は見つかっていません。 さっそく合成 「バンドやろうよ!」では自キャラクターのギターを持ち替えすることでき、その部分に利用しています。 合成するパーツ毎にswfを用意します 1.swf 2.swf 3.swf guitar.swf ming_useswfversion(4); $swf = new SWFMovie(); $swf-