珈琲問屋

珈琲問屋さんのHPをリニューアル担当しました。
もともとあったページをリニューアルで、システム的にはECのCMSが入っていて大幅にタグ構造は変えることができません。
試行錯誤でJavaかましたり、JquaryでDOMったりと動かせないタグをなんとかCSSレベルで大幅リニューアル。
毎月様々な企画をやっていて、安いし美味しい新鮮な珈琲をおとどけするサイトです!
みなさんもぜひご利用してみてください!!







ハイビジョンでMacが凄い


最近のフルハイビジョンテレビの液晶はピクセルでいうと
1,920 x 1,080ピクセルもあるんですね。

これだけあったらパソコンつないでも使えるだろ
ということでマックをつなげてみました。写真はMacbookと接続してデュアルモニター状態。
うちのは37型の東芝REGZAなんですけど、37とはいえやっぱ大画面!!
マックに入った写真をみんなで見たり、Youtubeみたり、いろいろ使えそうです。大画面で漫画読んだりしてます。

接続方法なんですけど、Macはディスプレイに接続するのにDVI端子を使います。
ハイビジョンテレビはだいたいHDMIというデジタルな端子があります。
なので、単純にHDMI-DVI変換ケーブルをAMAZONで購入。
1000円程度の出費でつながりました。

大画面でマックの画面をみるととても迫力!写真もすごいキレイだし、ブラウジングも完璧です。
これは感動・・・ハイビジョンTV持ってる人にはぜひオススメ!!
ワイヤレスキーボードとマウスで遠隔操作できれば完璧です。
そんでMacminiをTV横に置いておきたい。

うちのはMacBookなので、DIV端子ではなくてミニDVIなので、もともとディスプレイに接続するために購入していたApple純正のMiniDVI – DVI変換アダプタも使ってます。
DVI端子でかいし、パソコンも全部HDMI端子にしちゃえばいいのにね

ちなみに、ハイビジョンテレビは、入力された映像を表示する前に画像の色補正やらサイズ変換やらいろいろ処理をするため表示されるまでにコンマ何秒かのタイムラグがあります、そのためマウスの操作が若干遅れてるように感じます。ゲームの入力なんかでも問題になってますね。
タイムラグ感が気になる場合は、TVにゲームモードなどが用意されていれば、そういった途中処理をなくして高速に描画します。

大画面で、高精度なマックの画面がでるのは本当に感動です。
興味持った人は、ぜひやてみてください。

今回使ったもの。


1m は¥1,070 PLANEX HDMI-DVI変換ケーブル

もしくは、HDMIケーブルをすでに持ってるなら変換アダプタだけでもOK


¥950 PLANEX HDMI to DVI変換アダプタ PL-HDDVAD

最近は42型で79,900円 32型で49,900円で買えるらしい、激安・・・
icon







cocoa始めました。

Macのアプリを開発するために、cocoaを始めました。
そしてiphoneアプリを作ります!!

とりあえず、Macのアプリを作ろう!
MacはOSを買うと、もれなくX-codeという開発環境が付いてくる。無料で高度なプログラム開発キットが付いてくるなんて、なんて素晴らしいんだろう。
でも言語がobjective-cという、またマイナーな言語っぽいので覚えるのがめんどそう。

とにかくグラフィックさえ描画できれば簡単なゲームくらい作れるだろうと思って
試行錯誤。
外部ファイルではなくリソースにある、画像(png,jpnなど)を表示できれば、いいなと思って検索していたんだけど、なかなか見つからない、もしくは難しくて良くわかんない。
やっとん・ぱか工房さんのところで自分がやりたいこととマッチするの発見。ありがとうございます。

で、小一時間後・・・(かかりすぎだ)
なんとかできたー
32×32のマップのチップをPNGで準備してそれを表示させることが出来ました!
これさえできれば、パズルゲームだってRPGだって!できるはず・・・・
スクリーンショット(2009-12-13 0.58.48)

以下よくやりそうなんで覚書。

1.プロジェクト作成
X-codeを起動して、新規cocoaアプリケーションを作る。

2.描画用のクラスを作る
開いたプロジェクトウィンドウで、classesを右クリック。新規追加で画面描画用のクラスを追加。
スクリーンショット(2009-12-13 0.54.35)
その時にsub class of を、NSViewにする。
スクリーンショット(2009-12-13 1.11.08)
プロジェクトウィンドウに、新しい、.hと.mができる。(今回はmainViewとしたので、mainView.h , mainView.m)
スクリーンショット(2009-12-13 1.13.29)

3.インターフェースビルダーでCustomView作成
今作ったクラスをウィンドウに関連付けるために、まずはインターフェスビルダーを起動
プロジェクトウィンドウのResourcesの中にあるMainMenu.xibをダブルクリックで起動します。
スクリーンショット(2009-12-13 0.56.26)

インターフェースビルダーで、ライブラリーにある、Custom Viewをウィンドウにドラッグして配置。
スクリーンショット(2009-12-13 0.57.09)

配置したCustom Windowを選択して、Inspectorパレットの一番右のタブの中にあるclassの設定で、さっき作ったクラス名をいれる。(mainView)
スクリーンショット(2009-12-13 0.57.22)

4.リソースに画像読み込み
プロジェクトウィンドウのResourcesを右クリックして、追加、既存のファイルで
読み込みたい画像を指定。
スクリーンショット(2009-12-13 11.04.39)
これで、リソースに登録されます。

5.mainView.hのコード

#import <Cocoa/Cocoa.h>
@interface mainView : NSView {
	NSImage *_imgWall;//イメージ
}
//イメージの読み込み処理
- (NSImage*)loadImage:(NSString*)name;
//イメージの描画処理
- (void)drawImage:(NSImage*)image x:(float)x y:(float)y;
@end

6.mainView.mのコード

#import "mainView.h"
@implementation mainView

- (id)initWithFrame:(NSRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code here.
		_imgWall=[[self loadImage:@"wall.png"] retain];
		
    }
    return self;
}
//メモリ解放
- (void)dealloc {
    [_imgWall release];
    [super dealloc]; 
}
//左上原点
- (BOOL)isFlipped {
    return YES;
}
- (void)drawRect:(NSRect)dirtyRect {
    // Drawing code here.
	//32x32のPNGを横に20個、縦に15個敷き詰める。
	int bx;
	int by;
	for(by=0;by<15;by++){
		for(bx=0;bx<20;bx++){
			[self drawImage:_imgWall x:(bx*32) y:(by*32)];
		}
	}
}

//イメージ読み込み処理
- (NSImage*)loadImage:(NSString*)name {
    NSImage *image=[NSImage imageNamed:name];
    if (image==nil) return nil;
    [image setFlipped:[self isFlipped]];    
    return image;
}
//イメージの描画処理
- (void)drawImage:(NSImage*)image x:(float)x y:(float)y {    
    //描画元の領域
    NSRect frRect;
    frRect.origin.x=0;
    frRect.origin.y=0;
    frRect.size=[image size];
    
    //描画先の領域
    NSRect drRect;
    drRect.origin.x=x;
    drRect.origin.y=y;
    drRect.size=[image size];
    
    //描画処理
    [image drawInRect:drRect fromRect:frRect operation:NSCompositeSourceOver fraction:1.0f];
}
@end

出来上がり!!

Webで検索する前には、下記の本をかって、チュートリアル的なのやりました。
X-codeの使い方やinterFace builderの基本操作が、簡単なアプリを作りながら学習できたので良かったです。



2,835円 CocoaではじめようMac/iPhoneプログラミング入門







IMAGE MONSTER


IMAGE MONSTERはCanonの新型デジタル一眼レフカメラ、 EOS 7Dのキャッチフレーズ。
EOS 5Dmk2に続き、動画も取れる一眼。
YOUTUBEで綺麗なサンプル見つけたので貼付け↑

一眼なだと背景をぼかした動画や、フォーカスを変えながらの撮影とか
普通のビデオカメラより写りがいいらしい

基本のカメラ機能も
シャッタースピード秒間8枚で連写可能
ISO感度は6400まで設定できて暗いときでも撮影のチャンスが増える
画素数1800万
約100%の視野率でファインダーから見える風景がとてっても見やすい
ファインダーも透過液晶がついてて、水平情報とかが透けてみえたり機能のすごい
それでハイビジョンで動画撮影も出来ちゃうんだから
全部入り的でCANONの本気が伺えますなー!!
上位機種の5Dよりフルサイズじゃない点を除けばスペック的には上な気がする。

近所のYAMADA電気でいじりまくってました。
とりあえずファインダーが広いのがいい。
シャッター音もしっかりしててかっっこいい!

見てみるとAMAZONが安い
bodyのみで129,352円。安い!けど買うとなると高い・・・・
悩む



¥129,352 Canon デジタル一眼レフ EOS 7D

↓レンズつけるとこのくらい。
ついてくる標準レンズも新しいもので、同じモデルの前の型より明るくなって、写りも評判いい


¥198,000 Canon デジタル一眼レフカメラ EOS 7Dレンズキット







Google 日本語入力

g2
Googleが日本語入力システムを出してました。しらなかった・・・

マックの日本語入力システムは、標準の「ことえり」があまりにも頭悪いのでATOKを使っていたのですが、先日snow leopardになったら古いverのATOKが起動しなくなってしまい、最近はことえりで我慢していました。
とはいえ、こうやってBlogを初めて文章を入力する機会が増えると、ことえりの変換にはイライラ・・・
ことえりは、何でそこで区切るの!!??っていうくらい驚きの文節で変換してくるし、良く使う2文字熟語ですら1文字づつ別々に区切られて知らない言葉にされてしまう。

そんなとき、大好きなgoogleからIMEが出てるということを知りました。
しかもMacとWindowsどっちもあるらしい。
ということで、さっそくインストール!!
この日記もGoogleIMEで入力してます。

変換してみると、サクサクと入力できて、候補もテンポ良く表示されます。
候補は、googleの検索窓に入力した時みたいに、下に出てきます。↓
googleime

それと、”うえ”とか入力して、矢印「↑」になるのが、ATOKの頃よく使ってたんですが、ことえりはやってくれなかったので
GoogleIMEでは変換してくれたのでうれしい。

一応これもw
「貴社の記者が汽車で帰社した」
できた!!!
”こーるお”まで入力すると
スクリーンショット(2009-12-12 9.58.51)

でたでたw

googleIME、Webで検索されてい大量の言葉などを元に変換エンジンを作ってるらしく
”現在のWebのありのままが反映されたインプットメソッド”とgoogleの人が言ってる。
辞書にもネットの情報を利用してるとは、さすがgoogle

実際使ってみてgoogle IMEは間違いなく、ことえりより頭いい
これからはこれだな。
ダウンロードページ







max script覚え書き

maxscript

maxscriptは、3ds max上動くスクリプト言語です。ちょっと敷居も高くデザイナーにとっては覚えるのが面倒ですが、モデリングするとき、レンダリングを効率よくするとき
何か、同じ処理をたくさんやる時など、様々な場面で活躍します。
こまったときにmax上で、オリジナルのツールを作っちゃって作業の効率化をできたりしますので
簡単な命令だけでも覚えておくと便利です。
ゲームも作れますw

3ds max ver 5くらいの時のものなので使えないかもしれませんが
当時つくった覚え書きリストです(下記ダウンロード)
文法が独特なので置き換えできるように作ったものです。
ある程度、javaでもcでも他の言語を使ったことがある人なら習得は簡単だと思います。



¥4,935 maxscriptも解説されてる公式ガイド。Autodesk 3ds Max Autodesk 3ds Max Design ビジュアルリファレンス







UNIQLO LUCKY SWITCH

uniclock
UNIQLO LUCKY SWITCHというのをやっていたので
サイドバーの上に入れてみました。(上の画面は関係ない。ユニクロックのスクショです)
※サイドバーから外したのでここに置いておきます。

クリックすると、そのサイトないの画像が全てユニクロくじになります。
完全にサイトジャック状態です。
クリックすると、画像がめくられて当たりがでたらバッグがもらえるそうです。

面白い・・・・

インパクトもあって、手軽だしめくりたくもなっちゃいそう
外れても、その日のお買い得な商品情報が表示されたりとか
なんて上手い広告なんだろう。
さすがだなぁ

とりあえず画像がいっぱいあればクジも多くなりそうなので
適当に画像をならべておきます↓ 当たったらコメント入れてくださいw

123456
123456
123456
123456







Mac 版 Google Chrome がついにリリース

google開発者
今朝googleからメールがきました。

”Mac ユーザーの皆さん、本当にお待たせしました。
Mac 版 Google Chrome の登場です”

ページでは開発者達のレゴ写真まで準備されていてgoogleっぽい遊びもあった。
メールを読むと、Mac版の開発に関して以下のようなことが行われていたらしい。

・73,804 行の Mac むけのコードを記述
・29 回の開発ビルド
・1,177 件の Mac 関連のバグを修正
・Mac 版 Google Chrome のコードベースに、外部から 12 人のコミッターとバグ修正者、48 人のコード提供者が参加
・8,760 杯のジュースとコーヒーを消費

プログラムのビルドとかバグの回数とかは良くわかんないけどw
8760杯のジュースとコーヒーは
レゴの人を数えると18人いるようなので1人あたり486杯
Chromeは1年以上前から開発されてるから(この記事参照
だいたい1日1杯くらいになるので、けっこう普通だったw

現在使ってみて、Mac Chromeは、Windows版と同じように軽くてシンプルで使いやすいです。
不満点としては、ショートカットの作成で、アドレスの横のアイコン↓
スクリーンショット(2009-12-09 13.16.24)
をドラッグすると、デスクトップとかにショートカットファイルができる機能が
通常どのブラウザでもあるのに、Mac Chromeではできませんでした。
ブックマークにいれるほどでもない、ちょっとしたURLを覚えとくのによく使っていたので不便。
一応、いろいろいじっていたら、アドレスのテキストを全て選択してアドレスの上で長押しするとドラッグ可能になってショートカット作れるっぽいことは発見したんですが
ちょっと面倒。

意外とsafari4の出来がいいので、メインブラウザ選びに悩みそうです。







ヤスオク

ヤスオク

なんだかやばそうなの発見。格安オークション ヤスオク
久々に危険な香りのするWebサービス

落札価格はこんな感じ
Apple MacBook Proが¥5,393
SHARP AQUOS 37型 ¥2,805
ヤスオクというだけあって安い!!

そして、この仕組みが凄い
ユーザーは、コインというのを1コイン75円で買います。
入札には1コイン使います。
0円スタートで
1回、入札されると価格が15円あがり自動延長されます。
(1円オークションというのもあり、その場合は1円あがります)

例えばさっきの例のMacProは1円オークションだったようなのですが

1回の入札で1円あがるので、5,393円だったということは5393回入札されています、
ということは1回入札75円なので
5393回 × 75円 = 404,475円 がコインの代金として主催者に入ります。

実は出品者はいなくて、主催者が儲けた404,475円で13万円のMac proを買って落札者に送ります。
最終的に落札した人は、入札回数x75円+落札代金というとても安い値段で落とせます。
そのかわり落とせなかった人は入札につかったコイン分のお金は戻ってきません。

みんなからお金を集めて主催者と落札者が儲けるという
まさにギャンブルですね。
もし、主催者がサクラをしていたら・・・・

これは規制とかかからないのだろうか・・・
普通にギャンブルの仕組みだよね??
でもいまのうちになんか落札しておきたいw

サイトもすげーきれいにデザインされていてそういう怪しさをなくしてる。
登録画面の入力ミスのエラーなんかも
半透明の吹き出しがでたりして、やけに作り込まれている。
とにかくうまい。頭いいな
今の世の中はサイトをすごくきれいに作っておけば信用があがる
実質はどんなオフィスかわからないけど、Webさえしっかりすれば一流企業
そんな匂いがします。
ネーミングも絶妙

落札できた人いたら教えてください。
いつか消えそうな・・・







BEAMS online shop

BEAMS online shopのサイトディレクション担当。

雑誌Web designing 2009.5月号で紹介していただきました。