ascii.jpで、スマートフォンサイト制作についての連載を書かせていただいている関係で、最近iPhoneの画面ショットを大量に撮影しております。

そのため、少しでも作業を楽にできないかと模索していたのですが、次の方法が今のところ一番サクサクできます。

使うソフト

• Macに付属のプレビュー
• Pastebot
• Mac版 Pastebot

手順

• まずは、PastebotのiPhone版、Mac版をそれぞれインストールします
• お互いで起動して「Sync」の設定を行ないます
• iPhoneで希望の画面を表示して画面ショットを撮影します
• ちなみに、iPhoneでの画面ショットは「スリープボタン」を押しながら「ホームボタン」
• そして、iPhoneの「写真」アプリを起動してサムネイルをしばし長押しし「コピー」します
• Pastebotを起動します。今コピーした内容が、Pastebotに貼りつきます
• これをタップして、サブメニューから「Macにコピー」を選びます
• Macで、プレビューを起動します
• [ファイル][クリップボードから新規作成]を選びます
• 保存します

手順解説の映像はこちら

これで完成。まだまだ若干手順は多いですが、これでもかなり楽になっています。Pastebotは450円と、なかなかのお値段ではありますが、一つあるとさまざまな活用用途のある便利なソフトです。是非、使ってみてください。

• Pastebot

JavaScript開発者にとっては、もはやなくてはならないライブラリである「jQuery」ですが、今月からスマートフォンの開発用ライブラリである「jQuery Mobile Project」がスタートしているようです。

詳細は未定で、公開は2010年中を目指しているということで年末が楽しみな感じ。アナウンスのページがありましたので、拙い翻訳ですが、日本語にしてみたいと思います。間違いがありましたらご指摘ください。

元文書：Announcing the jQuery Mobile Project | jQuery Mobile

The jQuery project is really excited to announce the work that we’ve been doing to bring jQuery to mobile devices. Not only is the core jQuery library being improved to work across all of the major mobile platforms, but we’re also working to release a complete, unified, mobile UI framework.

jQueryプロジェクトでは、jQueryをスマートフォン向けに提供しようと試みています。jQuery自身では、各スマートフォンに対応しているとは言えませんが、私たちはこれを完璧に、統一されたUIフレームワークで提供しようとしています。

Absolutely critical to us is that jQuery and the mobile UI framework that we’re developing work across all major international mobile platforms (not just a few of the most popular platforms in North America). We’ve published a complete strategy overview detailing the work that we’re doing and a chart showing all the browsers that we’re going to support.

私たちにとって、例えば北アメリカで主要なスマートフォンだけに対応するのではなく、世界中のあらゆるスマートフォンに対応するということが極めて重要です。私たちは、今後の戦略を発表すると共に各ブラウザの対応状況をチャートでお知らせします。

Right now we’re working hard, planning out the features that we want to land and doing testing against the devices that we want to support — and hoping for a release later this year. If you wish to help, please join the discussion in the jQuery Mobile Community.

現在私たちは、全力で開発やテストを進めています。今年のおわり頃にはリリースできればと思っています。コミュニティも準備しましたので、もしよろしければ是非ご確認ください。

The jQuery project has received sponsorship from a number of mobile browser vendors as well.

jQueryプロジェクトは、各ブラウザベンダーの皆様からご協力をいただいております。

＜以下、各ブラウザベンダーのコメントにつき、中略します＞

We’re thrilled to be working on this project. The mobile web is desperately in need of a framework that is capable of working across all browsers, allowing developers to build truly mobile web sites. We’re doing all we can to ensure that jQuery Mobile fills that need.

スマートフォンのWebには、すべてのブラウザで正しく動作するようなフレームワークが必要です。私たちは、jQuery Mobileがそれを叶えられるようにします。このプロジェクトをゾクゾクしながら進めています。

＜ここまで＞

うまく翻訳できたか分かりませんが、出来上がったら本当に便利そうなフレームワークになりそうです。今年の終わりごろ、すごく楽しみですね。今後も、新しい情報がありましたらお知らせしていきます。

• jQuery Mobile | jQuery Mobile

しかし、HTML+CSS+JavaScriptというWebプログラマなら誰でも知ってる技術で、ネイティブのiPhoneアプリが作れてしまう素敵なソフトがありました。ここでは、「Getting Started with PhoneGap（iPhone）」を日本語にしつつ、手順をUSTREAMで録画したのでそちらの映像も合わせてご参照ください。

必要なもの

• Leopard(10.5)または、SnowLeopard(10.6)の IntelベースMac OS X
• iPhone
• iPhoneデベロッパ登録
• Gitのインストール

Step 1

• a) ターミナルを起動して、PhoneGapをインストールしたいディレクトリに移動します。続いて「git clone git://github.com/phonegap/phonegap-iphone.git」と打込み、Enterキーを押します。
• b) ターミナルで「cd phonegap-iphone」と打ち込んでPhoneGapをインストールしたディレクトリに移動します。この時、デスクトップフォルダは適切ではないので、書類フォルダなどで作業するとよいでしょう。（※翻訳合ってますか？(^^;
• そして「git submodule init」と打ち込んでEnterを押します（1,2行メッセージが出ます）
• 続いて「git submodule update」と打ち込んでEnterを押します（しばらく時間がかかります）
• さらに「make」と打ち込んで Enterを押します。すると、ディレクトリ内に「PhoneGapLibInstaller.pkg」というファイルが出来上がります。
• （もしXcodeが起動していたら終了させて）、今出来上がった「PhoneGapLibInstaller.pkg」をダブルクリックして起動します。これで、Xcodeに「PhoneGapLib」とXcode用のテンプレートが追加されます。
• d) （※cがない？）　Xcodeを起動して、［ファイル］［新規プロジェクト］メニューを選びます
• “User Templates”セクションに”PhoneGap”グループが追加されているので、これを選んで「PhoneGap-based Application”を選びます。
• 「選択…」ボタンをクリックし、プロジェクトの名前と場所を設定します
• /wwwディレクトリ内に、HTMLやCSS、JavaScriptを配置してプログラムを作成します
• デベロッパライセンスを取得している場合は、「info.plist」を開いて「BundleIdentifier」の設定を書き換えます。もし、デベロッパライセンスを持っておらず、シミュレータで動作を試すだけならこのステップは省略します。
• 続いて、iOS SDKのバージョンを設定します。
  • ［プロジェクト］［プロジェクトの設定］メニューを開きます
  • 「アーキテクチャ」を「Standard」に、「ベースSDK」を「iPhoneシミュレータ3.2」に設定します
  • 設定を閉じて、画面左上の「概要」の選択肢から「Simulator」を選びます。
• ツールバーの「ビルドと実行」を選びます

Step2

• 「info.plist」を選んで、「BundleDisplayName」をアプリの名前に変えます
• 「icon.png」を57×57pxの画像で置き換えます。これが、アプリのアイコンになります
• 「default.png」を320×480pxの画像で置き換えます。これは、起動直後の画面になります。

以上です。翻訳間違えなどありましたらご指摘ください。手順を撮影した映像はこちらです。

是非、チャレンジしてみてください！

• PhoneGap

Magic Trackpadを発売日に手に入れて使っています。しばらくは、マウスと併用だったり、長い時間使うと指が痛くなりましたが、最近はこれだけで生活できるようになりました。この辺りで、少し特徴についてまとめておきます。

オススメできない人

まず、大前提でこの商品は万人には勧められません。例えば次の方。

・Photoshopなどの細かい操作が主なデザイナー

所詮はトラックパッドであり、精細な操作はマウスにかないません。

・高機能マウスを使っている

ボタンがたくさんあったりするマウスを使っている方は、確実に物足りなくなります。

このような方は素直にロジクールあたりのマウスを使うとよいでしょう。

では、そうまでしてMagic Trackpadをつかうメリットはなんでしょう。

・机が広い、必要ない

マウスと違って机が広く使えますし、持ったまま使ったりもできます。リビングパソコンに最適

・ノートで操作がしやすくなる

ノートパソコンを使う時に、マウスが欲しくてイライラする事がありますが、これで訓練すると、ノートでもすいすい使えるようになります。

・いろんな指で使える

使いすぎると指が疲れたと書きましたが、それを解消したのがいろんな指での操作。人差し指が疲れたら中指、薬指で操作すると、分散されます。

オススメ設定

私のMagic Trackpadの設定は、図の通りです。

使える機能は、全部使います。どれも使い出すと、めちゃくちゃ便利で手放せません。唯一無効にしているのが、ドラッグ。

これは、クリックをしようとすると、ふいにドラッグになってしまうなど、誤操作が多かったので無効にしました。ドラッグは、親指でボタンを押して操作をします。

おすすめの使い方

では、この設定でMagic Trackpadをどのように使うのが良いでしょうか。私は、こんな感じで使います。

・クリックの基本はタップ。ときどき、親指

Magic Trackpad自体はマウスが置いてあった場所と同じ場所において、利き手で操作します。基本は人差し指で操作をし、クリックはタップ。右クリックは中指と一緒にタップです。

とはいえ、そのままでは指が疲れるので、タップの代わりに親指で下の方にあるボタン（ゴム足兼用）を押したり、中指をメインで操作したり、人差し指と薬指でタップしたりなど、あちのこちの指を使い分けます。

それほど気を使っているわけではないのですが、いろいろな方法を織り交ぜると、指が疲れません。

拡大縮小は超使える

二本指で縮めたり伸ばしたりするピンチは超使えるテクニックです。

プレビューや、iPhotoなどのAppleソフトではもちろん、Photoshopや、各種ブラウザでもほとんど使えます。（Fireworksは対応していないようで非常に残念）

ちょっと細かい部分が見にくい時などに、キーボードを使わずに拡大出来るのは、リビングパソコンではもちろん、文書などの確認や、Webのコーディングでも大活躍。手放せません。

奥義、両手使い

細かい作業が必要な方にはオススメしないと言ったMagic Trackpadですが、利き手ではない方で使うという奥義もあります。

使ってみると、意外と使える。クリックや右クリックはマウスで、ピンチや二本指、三本指の操作をMagic Trackpadで、などと使い分けると、作業効率が一気にアップするかもしれません。

って事で、オススメです。はい。

• Apple Magic Trackpad MC380J/A

USTREAMで連動番組をスタートします

この連載ですが、毎週水曜日に掲載されます。しかし、なかなか読む時間がない、とかざっと読んだけど理解しきれないという方のために、USTREAMの番組をご準備しました。

毎週、著者自らが音と映像で連載の内容について、解説。場合によっては実機などを使ったデモを交えながら紹介していきます。

本日 2010年 8月 6日深夜 0時は、第1回の連載を元に解説をさせていただきます。 連載の記事内容と合わせてご覧いただければ幸いです。

• 実践！ iPhone&Androidサイト制作ガイド（ascii.jp同名連載　連動企画）
• ASCII.jp：作って学ぶスマートフォン対応サイトの基本｜実践！iPhone＆Androidサイト制作ガイド

マウスに比べて細かい操作はしにくいものの、それももしかしたら慣れの問題かも知れず、それよりもやはり2本指でのスクールや、3本指で「戻る」「進む」の操作ができたり、ピンチで画像を拡大縮小できるなど、普通のマウスではできない新しい操作ができるということが、これまでになかった便利さを提供してくれています。

ということで、愛用しているMagic TrackPadですが、せっかくなので Windows（BootCamp）でも使いたい！　ということで、頑張って設定してみました。画面ショットなどを全然取っていないので、メモだけで申し訳ありません。

まずは、Bootcampのドライバをバージョンアップします。

• Apple Magic Trackpad Update 1.0 for Windows 32 bit

そしたら、コントロールパネルからBluetoothの設定を行ない、機器の認識中にMagic TrackPadの右側にある電源スイッチを入れます。すると、候補に表示されます。

この候補を選んで追加しようとすると、失敗したというメッセージができますが、問題ありません。そのまま登録します。

その後、暫く待つか、Magic TrackPadの電源ボタンを押したりすると、Windowsの右下に「接続に失敗しました」といったバルーンメッセージが表示されます。これをクリックすると、「PINコード」の入力画面が現れます。

ここに「0000」と入力しましょう。これで接続が完了します。無事に使えるようになりました！

Windows上では、3本指以上の操作はできませんが、2本指のスクロールなどは行うことができます。なかなか快適な操作感です。

※一度 Windowsに認識させた状態で、Macに戻ってくると認識しなくなっていることがあるようです。その場合は、一度MacのBluetooth設定画面で、Magic TrackPadを削除して改めて接続しなおすと接続できました。

• Apple Magic Trackpad MC380J/A

2010年 7月 27日に衝撃的に発表された、Appleの新インターフェース「Magic TrackPad」。 新しもの好きな私（現在 Magic Mouse愛用中）は、早速購入いたしました。

そして、本日到着。早速使い始めています。

まだ、さすがに使い慣れないのでマウスが恋しいですが、もう少し頑張ると新しい世界が見えてきそうな気もします。マウスの代替と考えるよりも、新しいインタフェースとして考えたほうが良いかも知れませんね。

ということで、明日の H2O Space. TV.では、この新しいデバイス「Magic TrackPad」を特集します。テーマは「Magic TrackPadの使い方を考えよう！」。ファーストインプレッションと、このデバイスで何が出来るかを考えてみようかなと思っております。

もしよろしければ、是非ともご覧くださいませ。

• h2ospace_php on USTREAM: H2O Space. TV. on USTREAM. 技術

いまさらの紹介ですが『Posterous』というブログサービスがユニークです。

サービス自体もなかなかユニークで、HTMLメールを決められたメールアドレスに送信するだけで投稿ができるという手軽なサービス。

しかし、面白いのは最初のアプローチで、トップページを見ると「Create an account（アカウントを作る）」に取り消し線が引かれていて「Skip it!」と書かれています。

会員登録はしなくて良いので、とにかくメールを送って1個目のエントリーを作成しましょうと言うわけです。

実際には本当にないわけではなく、1つ目の投稿に返信される形で登録の案内が送信されてきて、きちんとしたブログとして組み立てるには設定をしていかなければなりません。

しかし、アプローチとしては非常に面白く、サービスをとりあえず使ってみるという意味では敷居を下げることに成功しているのではないでしょうか。すべてのサービスで使えるというわけではないですが、参考になります。

• Posterous – The place to post everything. Just email us. Dead simple blog by email.

Verizonが、新しいAndroid端末「DROID」のためにプロモーションサイトを開設しました。ここで採用されているインタフェースが非常に革新的です。

まずはじめに、「マウスのみ」か「フルモーショントラッキング3D」というインタフェースを選びます。後者を選ぶと、カメラ使用の許可を経て、カメラで撮影した映像が映し出されます。

iMacやMacBookなど、画面の上にカメラが内蔵されている端末であればそのままで良いですが、外付けカメラなどの場合は画面の上あたりに設置するとよいでしょう。自分の顔が写った状態にして、鼻を赤いエリアにあわせて「TRACK」ボタンをクリックします。

これでサイトがスタート。アクセスすると画面には、DROIDの端末が表示されていますが、なんとこの状態で顔を左右に動かすと、それに合わせて端末が左右に動いて覗き込むことができます。

さらに、各端末の性能を見たりプロモーション映像を見たりもできますが、常時トラッキングされていて、画面が左右に揺れます。

まぁ、これだけといえばこれだけなのですが、この発想は非常に面白いといえます。カメラが、キーボード・マウスに代わる新しいインタフェースとして活躍しそうですね。顔を動かして、敵の弾を避けるゲームとか、顔の向きに合わせて映る場面が変わる映像コンテンツとか。色々なことに応用ができそうです。今後の応用が楽しみですね。

Evernoteがバージョンアップし、「1.10.0」がリリースされました。
今回の目玉機能はなんといっても「トランク」。

これは、iPhoneの「iTunes Store」のような存在で、Evernote専用の拡張ソフトなどを探すことができます。まだまだ公開されたばかりで、ラインナップは多くありませんが、それでも Evernoteを Todo的に利用するソフトや、さまざまなWebサービスに入会できたり、Eye-Fiなどのハードウェアを購入することもできます。（Amazonのアフリエイトリンクのようですが）

その他、割り当てのないタグを隠す機能や、位置情報の付加されたノートに機能が追加されていたりなど、キラリと光る機能追加が色々あるようです。ちょっとこのあたり、文章で説明するよりもデモを交えて説明したほうが良いかなと思います。

ということで、2010年 7月 16日（金）　 23:00頃からの、H2O Space. TV on USTREAMでは「Evernote」を特集します。題して「Evernoteと Egretlistではじめる、ゆるいタスク管理（GTD）講座」。

GTD（Getting Things Done）は、タスクを管理するための方法論。完璧にこなせたら、かなりすごい管理ができそうなんですが、なんだかこれをやるだけでも疲れてしまうという感じの、かなり盛り沢山なタスク管理です。

そこで、GTDを勉強しては挫折して、かなり中途半端に導入した私流のタスク管理を紹介します（笑。

正直、他の人の参考になるような代物ではない気がしますが、少しでもヒントがあればいいなという感じのゆるい放送になります。ということで、16日の 23時。3連休前のまったりした時間に、是非とも御覧くださいませ。（急な予定変更などがあるかも知れませんので、Twitterなどで是非チェックしてください

• h2ospace_php on USTREAM: H2O Space. TV. on USTREAM. 技術
• すべてを記憶する | Evernote Corporation