投稿

12月, 2011の投稿を表示しています

"ハッカーと画家(Hackers and Painters)"を読んだ

イメージ
会社の人に勧められて読んだ本。こういった本を読むのは精神的にもいいと思う。閉じた世界の窓を開けて空気の入れ替えをする感じ。思ったことを箇条書き。まとまってないけどね。「日本人は最初から完璧な物を作ろうとするから、欧米人のように作りながら新たなIdeaを生み出すような考え方のほうがSoftwareを創りだすには適している。」
→ これを読んでGoogle Chrome Extension "History Plus"をとりあえずReleaseした。 「大企業は委員会で設計し、ハッカーはただそれを実装するだけ。」 「ソフトウェアはデザインを知っているハッカーによってデザインされるべき」 EmacsとXyzzy関連でLISPを噛ったけど、もう少し勉強してみようかな。 < Related Posts >「20歳を過ぎてから英語を学ぼうと決めた人達へ」を読んだ

iPad向け電子書籍AppをAdobe InDesign + Digital Publishing Suiteで作成するためのまとめ

イメージ
1年前に調査したときはβ版だったのが、Adobe InDesignからiPad App, Android Appが作成できるようになっていたので、詳細を調査。1. Adobe InDesign単体ではEPUB形式のみ対応InDesign単体ではEPUB形式に書き出せる機能がある。しかし、iPad Appを生成してくれるわけではない。iPad Appを生成するには別途Digital Publishing SuiteというServiceを利用する必要がある。EPUB形式は電子書籍の規格の一つ。読むためには別途電子書籍Reader(iPadやiPhoneはiBooksが標準でInstallされている)が必要。簡単にいうと、HTML5とCSS3がzip圧縮されている。2. Adobe Digital Publishing Suite (ADPS) とはAdobe InDesignから.folio形式に書き出し → AdobeのServerにUpload → iPad, Android向けにCompileされた状態でDownload
を提供してくれるService. 2011年9月から販売開始。詳しくはOfficial Siteで。Sample AppがiTunes App StoreからDownload出来るので、これを読むと何が出来るのかが分かる。ADPS GUIDE for iPad on the iTunes App Store[ Index ]ADOBE DIGITAL PUBLISHING SUITEの概要 はじめに - 制作するにあたっての準備 インタラクティブコンテンツの制作 [ サンプル ] インタラクティブコンテンツの制作 [ 作り方 ] Folio Producer Service データのアップロードと管理 ADOBE DIGITAL PUBLISHING SUITEの利用 PointとしてはAdobe InDesign CS5/CS5.5が必須。 Objective-CのSource Codeは入手できない。AdobeのServerにUploadしてCompileされる。 基本料金(Platform fee)と.folioごとに費用(配信サービス費用)が発生する 3. Adobe Digital Publishing Suiteの費用日本では…

VMware FusionにVirtual MachineとしてMac OS X LionをInstallする方法

イメージ
App Storeから購入したMac OS X Lionを再Downloadして、VMware FusionのVirtual MachineとしてInstallする方法。環境: Mac mini(Mac OS X Lion 10.7.2)(Mid 2010版), VMware Fusion 4.1.1Mac OS X 10.7からLicenseが変更されて、Lionが既にInstallされているPC上に最大2つまで仮想PCとしてLionをInstallできるようになった。詳しくは下記参照。VMware KB: Installing Mac OS X 10.7 (Lion) as a virtual machine in Fusion 41. Mac OS X LionをApp Storeから再DownloadLionにUpgradeしてしまうと自動的にInstall Imageが削除されてしまうので、もう一度App StoreからDownloadし直す。App Store起動 → (Option Keyを押しながら)Purchases → INSTALL2. Install Disk Image(dmg)を作成Applications → Install Mac OS X Lionを右Click → Show Package Contents → Contents → SharedSupport → InstallESD.dmgをDouble ClickしてMountApplications → Utilities → Disk Utilityを起動"New Image"をClickして新規Disk Imageを作成Mountしてある"Mac OS X Install ESD"を選択して、"Destination"にさっき作ったImageをDrag&Dropする。3. VMware FusionにInstallVMware Fusion起動 → File → New ...作成したdmgを選択して"Mac OS X 10.7 64-bit"の仮想PCを作成< Related Posts >Mac OS X Lion Serverを購入してInstall(Upgrad…

SWF形式のBGMを停止、再生する方法とvideo tagを使ってiPadも対応する

イメージ
Web SiteにBGMを埋め込んだときの手順をMemo.環境: Adobe Flash Professional CS5, swfobject 2.21. BGM用の曲(MP3)をSWFにAdobe Flash Professionalが使える環境なら
File → Import → Import to Library ...
からMP3をImportして、TimeLine PanelにDrug&Dropすれば完了。ActionScriptはPlay();を埋め込んでおく。後で気付いたけど、Flowplayerにmp3を再生する機能があるので、これを使った方が簡単にできる気がする。2. PCとMobileを判断してSite埋め込むiPhone, iPadではswfを再生できないので、前の記事を参考にPCかMobileかを判断して、Mobileの場合はHTML5のVideo tagを使うようにする。3. 再生、停止する方法PCの場合は、swfobjectをつかって、再生する場合はembedSWF
停止したい場合はremoveSWFすればいい。(今ならFlowplayer + mp3でやる)video tagの場合は下記Siteを参考に。ちなみにiPadで画面読み込みと同時に曲の再生は出来ないみたい。Safari HTML5 Audio and Video Guide | Safari Developer Library< Related Posts >動画(FlowPlayer)の再生回数をGoogle AnalyticsでTrackingするHTML5のVideo Tagを使う際の注意点とiPad, iPhone向けの動画へ変換するHTML5(<video>) or Flashを自動で切り替えてくれるJavaScript Library(iPadやiPhoneでも動画を再生)PHP or JavaScriptでMobile端末(iPad, iPhone, Android)かどうかを判別オープンソースなフラッシュ(SWF)形式のプレーヤーFlowPlayer

NHKオンデマンドを登録、利用してみた。

イメージ
NHKスペシャルでSteven Jobs氏の特集をやるので、「これは見なきゃ!」と思ったけど、Singaporeの家にはTVがない。調べてみるとNHKオンデマンドで過去の番組を動画配信しているみたいなので、試しに登録して視聴してみた。NHK スティーブ・ジョブズ特集|NHKスペシャル 世界を変えた男 スティーブ・ジョブズ(仮)ちなみに通常NHKオンデマンドは海外から利用できない。海外でも利用できますか? | NHKオンデマンド|よくある質問・お問い合わせ動作環境の確認 | NHKオンデマンド|初めての方へ個人的には知識系の番組が好きなので、"その時歴史が動いた"は凄く惹かれる。価格も単品で105円~なので気軽に視聴できる。(詳しくは利用料金表を参照)しばらくは週一で見ていこう。< Related Posts >【CentOS】プロキシサーバーSquidのインストールして設定

Mac OS X Lion Serverを購入してInstall(Upgrade)

イメージ
前の記事でClean InstallしたMac mini(Snow Leopard Server)にOS X Lion ServerをApp Storeから購入してInstallしてみた。OS X Lion Server 4300円
OS X Lion           2600円
           計           6900円ここからはハマったときのLogなので読み飛ばしてOK購入後Dockに
"OS X Lion Server - Waiting..."
が表示され、一向に動かない。Activity Monitorを見ると、何かしらDownloadしているみたいなので、しばらく放って置いた。・・・で、2時間経過さすがに痺れを切らして、Mac mini自体を再起動。
再起動後は、Dockに
"OS X Lion - Paused"
"OS X Lion Server - Paused"
と表示され、App Storeから"Install"をClickしても変化しない。system logを確認すると以下のようなErrorが出ていた
$ less /var/log/system_logDec 13 19:51:17 saturn storeagent[201]: wrote primary DSID: 212901445
Dec 13 19:51:20: --- last message repeated 1 time ---
Dec 13 19:51:20 saturn App Store[907]: Calling purchase callback
Dec 13 19:51:21 saturn storeagent[201]: CANCEL 2: -[DownloadQueue _notifyClientsAboutDownloadsChange:forSource:]
Dec 13 19:53:18 saturn [0x0-0x16016].com.apple.iTunes[932]: AppleGVA:: Error creating the accele…

Mac mini ServerをNetwork経由でClean Installする方法

イメージ
1年半前に買って、Singaporeに来てからも大活躍していたMac mini Server. Lion ServerにUpgradeしたくなったので、Clean Installからやってみた。Mac mini (Snow Leopard Server) (Mid 2010版)詳しくはOfficial Supportに方法が載っている。リモートインストール Mac OS X v10.5 および v10.6 を使ってソフトウェアを再インストールする方法1. Install Utility起動Macがもう一台あれば、そちらにInstall Diskを挿入したあと、
Utilities → Remote Install Mac OS X
を選択。画面に従って、待機状態になるまで進めていく。Windowsしか周りにない場合は、リモートアシスタントを使うと出来るらしい。
詳しくは"OS X Lion:Windows 移行アシスタントについて"へ。一台が待機状態になったら、InstallしたいMac miniを再起動。起動中に"Option"Keyを押し続ける。起動後は右のRemote Install Mac OS Xを選択。Ethernetに接続してあれば、Networkは選択する必要なし。2. Disk UtilityでRaid1構成にする500GBのDiskが2つあるので、今度はRaid1構成にしてみる。Install画面のMenuに"Disk Utility"があるので選択。2つのDiskをそれぞれ"Format: Mac OS Extended(Journaled)"でErase"RAID"から"RAID Type: Mirrored RAID Set"を選択。左PanelからFormatしたHDDをDrag&Dropする。これでCreate。Disk Utilityを終了。作成したDiskを選択してInstall実行。3. Install後の設定OS Install自体は40分ぐらいで終わる。その後、Serial Numberの入力などの初期設定。ちなみにLoginした後もSoftware Updateを行うとさらに4…

Google Analytics導入時にやるべき初期設定(FilterとSocial Pluginへの対応)

イメージ
Google AnalyticsのTracking CodeをSiteに設置してから、行うべき設定をまとめてみた。Filterを使って、指定したDomain以外はTrackingしないようにする Webmaster ToolsとGoogle Analyticsを連携させる Facebook Like, Twitter, Google +1のSocial系PluginもAccess解析する その他、Trackingしたい箇所でEvent情報を送信するScriptを埋め込む 1. Filterを使って、指定したDomain以外はTrackingしないようにする< 2012/04/05 Modified >
この設定がうまく機能しなくなったので非推奨。
参考: Blogの更新をサボっていたら閲覧数が急激に落ちたGoogle Analyticsは同じWeb Property ID(UA-xxxxxx-x)を使っていると、申請したWebsite URLとは関係なくTrackingしてしまう。開発環境やSTAGE(Test環境)からのAccessは除外したいので、下記Siteを参考にFilterを設定。[重要] Google Analyticsの導入後、最初にやることGoogle AnalyticsにLogin → Accountを選択 → 設定画面 → Filters → New Filter入力例Filter Fieldに「Hostname」を選択。
Filter Patternには正規表現を記述するので、「.」(ドット)や「-」(ハイフン)は「\」(バックスラッシュ)でEscapeしないといけない。詳細はAnalytics Helpを参照(Change Languageで日本語に変更可能)What information do the filter fields represent? - Analytics HelpWhat are regular expressions? - Analytics Help2. Webmaster ToolsとGoogle Analyticsを連携させるGoogle AnalyticsのSearch Engine OptimizationからWebmaster Toolsの情報を参照できるようになる。設…

動画(FlowPlayer)の再生回数をGoogle AnalyticsでTrackingする

イメージ
動画の再生回数、最後まで見たかどうかをGoogle AnalyticsでTrackingする方法。YouTubeを利用する場合は、YouTube Analyticsがあるので特に何もする必要はない。どうしてもGoogle Analyticsを使いたい場合は、YouTube JavaScript Player APIを使うと再生、停止のEventを取得できるので、EventをTriggerにしてGoogle Analyticsに情報を送れば可能。この辺は前の記事を参考に。今回は動画をYouTubeに置きたくないという要件だったので、再生するためにOpen SourceのFlash Player "FlowPlayer"(version 3.2.7)を利用。FlowPlayerはGPLv3で配布されていて、Free版はFull ScreenにするとFlowPlayerのLogoが表示される。このLogoを消すためにはCommercial Licenseを購入する必要がある。詳しくはOfficial Siteを参照。このFlowPlayer非常によく出来ていて、外見(Skin)を変更したり、JavaScriptで外部から操作できるようなAPIが充実しているので、とても使いやすい。Google Analyticsと連携するCodeはOfficial Siteにもある。Eventにhookして、Google Analyticsに情報を送信するのはYouTubeのAPIと同じ。それすらも面倒くさい場合は、直接Parameterを指定すると、FlowPlayerがGoogle Analyticsに情報を送信してくれる機能もある。Official SiteにあったのはGoogle Analyticsの古いCodeを利用していたので、jQueryと組み合わせて利用するために次のように記述。<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-1234567-1']);
  _gaq.push(['_trackPageview']…

HTML5のVideo Tagを使う際の注意点とiPad, iPhone向けの動画へ変換する

イメージ
HTML5のVideo Tagを使うとIE9, iPhone, MacのFirefoxなど特定の環境だけ動画が再生されなくて困ったときのMemo.結論から言うと、PC BrowserではFlowPlayerなどのFlashを使った方が無難。少なくともお客様相手の仕事はそうした方がいい。VideoJSなどのJavaScript Library(HTML5のVideo Tag)を使う場合の注意点。 FirefoxはH.264 codecの動画を再生できない。
参考: Firefox で Youtube の HTML5 動画が見られない | トラブルシューティング | Firefox ヘルプGoogle ChromeでもH.264の動画を再生できなくなる
参考: Google ChromeがH.264対応をとりやめ、WebM推進を鮮明に -- Engadget JapaneseMP4などの動画を再生するためにはApacheのMime Typeを設定する必要がある(IE)。
参考: MIMEタイプ一覧 : 個人ホームページ / BIGLOBE動画の形式(type)も様々。Video TagのType属性指定する値は下記Siteを参考に。Video type parameters - WHATWG WikiH.264/AVC概要/4.プロファイルとレベル - MPlayer and MEncoder on MacOSXiPad, iPhoneなどiOS向けへの動画はAdobe Media Encoderを使って変換しているけど、FFmpegなどで変換する場合は下記Siteを参考に。Technical Note TN2218: Compressing QuickTime Movies for the Web | Safari Developer Libraryios dev h.264」でGoogle先生に聞く < Related Posts >HTML5(<video>) or Flashを自動で切り替えてくれるJavaScript Library(iPadやiPhoneでも動画を再生)PHP or JavaScriptでMobile端末(iPad, iPhone, Android)かどうかを判別H.264コーデックの…

HTML5(<video>) or Flashを自動で切り替えてくれるJavaScript Library(iPadやiPhoneでも動画を再生)

イメージ
Web上で動画を再生させる方法はswfobjectを利用して、
Flash対応 → Flashを埋め込む
Flash未対応 → 静的画像
とするのが今までの正攻法。今後はiPad, iPhone(iOS)やSmart Phoneでも再生できるように、HTML5の"video" Tagを使うのが当たり前になってくると思う。各Browserの差異を吸収して、HTML5のVideo TagとFlashを切り替えてくれるJavaScript Libraryを紹介。MediaElement.jsVideoJSJW PlayerLicenseGPLv2/MITLGPLv3CC3.0商用利用-FlashはFlowPlayerを利用しているので、Logoを消したい場合はこちらを参照。
$95~$89~
詳しくはOfficial Siteで説明Flash PlayerのSourceも公開されているので何でも出来る。基本はこれでいい気がする。FlowPlayerがJavaScriptで制御できて使いやすい。Creative Commons Licenseなので注意。iOSの場合だけHTML5を使うみたい。注意点「○秒間連続再生できるまで停止する」のようなBuffering機能がない。3.2.7にはBufferingしている間Loading Animationが表示されないBugがある。(詳細)Video tagに設定できる属性は下記Siteを参考に。HTMLMediaElement Class Reference | Safari Developer LibrarySafari HTML5 Audio and Video Guide | Safari Developer Libraryその他HTML5 Videoについて参考になる記事Videoタグのイベント挙動サンプル | Classmethod.dev()
日本語で分かりやすい code · Video for Everybody!
Video Tagの基本的な記述方法、動画形式など必読! HTML5 video issues on the iPad and how to solve them | Blog | Miller Medeiros
iPadでH…

PHP or JavaScriptでMobile端末(iPad, iPhone, Android)かどうかを判別

イメージ
PCとiPad両方に対応したWeb Siteを構築したときのMemo.共通のCSSのみで完結させたかったけど、どうしても下記理由でPCとMobileを判別する必要が出てきた。どの端末でも動画を再生させたい どの端末でも曲(BGM)を流したい Gallery(画像一覧)はSwipeで次の写真に移動したい
→ jQuery系Plugin側で対応しているのが多い。 PCで画面を広くした場合だけ、位置を変えたい 実現するために調査した結果の一覧。Library言語&License用途swfobjectJavaScript
(MIT)Flash(swf)が使えるか判別して、object tagか静的画像を自動挿入してくれる。ModernizrJavaScript
(MIT & BSD)HTML5/CSS3が使えるか判別。<video>が使えるかの判断にjQuery.MobileJavaScript
(MIT or GPLv2)TapやSwipeなどのEventを取得するのに使える。その場合autoInitializePage=falseにして利用する。VideoJSJavaScript
(LGPLv3)video tag → flash → 静的画像の順に判断して、動画を再生できるようにしてくれる。Flashの場合はFlowPlayerを利用。こちらの記事も参考にphp-mobile-detextPHP
(MIT)Server側で判断したいときに。PHP4で動かないけど、簡単に修正できる。(WordPress)PHPWordPressを使っているなら標準でiPhoneかを判断するGlobal変数($is_iphone)がある。
詳しくは/wp-includes/vars.phpを参照。ちなみにiPhone, iOS, Androidが判断できればいいという場合は次のようなJavaScriptで簡単に判断することが出来る(jQueryを拡張)。jQuery.extend({
    isMobile: function() {
        if (navigator.userAgent.indexOf(…

WordPressのOfficial LogoがPSD形式でDownloadできる

イメージ
最近は記事にThumbnail画像を付けるようにした。理由はBlogger(このBlog)をSmart Phone(iPhone, iPod touch, Android)で開いたときに最初の画像が一覧で表示される。 記事を読みやすく。 閲覧数に影響が出るか実験 Design Skillを上げたい Gimp, Photoshop, Illustrator, Fireworksの使いこなせるように ちなみにAndroidはこんな感じで表示される。WordPressはOfficial LogoのSource Fileを配布している。WordPress > About > Logos and GraphicsPSD形式でDownloadできるので、どんな風に構成されているかも確認できて勉強になる。iPhone用のIconの作成するときにも参考になりそう。< Related Posts >Adobe PhotoshopでButtonを作るTutorial[Design]Free PSD Graphic Sample集TwitterやFacebookのアイコンを探すBloggerにfaviconを設定してみたfavicon.ico(ファビコン)を作ってみる

Xen or KVM or OpenVZ. VMware Serverからの移行を考える

イメージ
VMware ServerのSupportが切れて、CentOS6.0にInstall出来なかったので、他の仮想化技術に切り替えようと調査したMemo.用途は主に社内の開発用。要件をまとめると、Source CodeはSubversionで管理しているので、サーバーが壊れても問題ない。 Guest OSはお客様の環境に合わせるので、CentOSとかWindowsとかいろいろ。 Windows XP + IE6 or IE8の環境は作っておきたいので、Windowsはほぼ必須。 Commandを叩かなくても管理Toolで簡単に起動、停止できるとうれしい。 無償で将来的にも安心して、長く使える技術を選択したい。 参考にしたSiteは下記。1,000円を切る低価格で登場、「さくらのVPS」をチェック――徹底ベンチマーク編 - SourceForge.JP Magazine : オープンソースの話題満載仮想化の達人:オープンソースで仮想化――どれが有望? - ITmedia エンタープライズ主要ハイパーバイザーの性能とコストを徹底比較した3つのホワイトペーパー - TechTargetジャパン 仮想化ちなみにKVMはCPUに仮想化支援機能がないと使えないらしい。実践!仮想化ソフトウェア 2009:第5回 Linux KVMを使ってみよう|gihyo.jp … 技術評論社CPUの仮想化サポート技術は一体何をサポートしているのか--仮想化技術をひも解く(5) - ZDNet JapanIntelの仮想化支援機能「Intel VT」とは? - @IT要件と照らし合わせると、WindowsをGuest OSに出来ないOpenVZは消える。将来性を考慮すると、やっぱりKVMかな?でも、Server自体が古いので、結局CentOS5 + VMware Serverになりそう。(^^;< Related Posts >CentOS6にVMware Server 2.0.2をInstallする(失敗編)【仮想化】Xen(主にCitrix XenServer)を調査【Linux】CentOS5 64bitにVMware Server 2.0をインストールする

このBlogの閲覧数とGoogle AdSense収益を公開。今後の方針について

イメージ
このBlogも書き始めてから丸4年。ほぼ毎日(平日だけ)投稿し続けたのは我ながらスゴイと思う。今読み返してみると自分の日本語能力のなさと読みにくさが、あまりに痛いので、今後のBlogを書いていく上での方針を決めてみた。今まで何でもいいから調べたことを残していく 毎日書き続けることが大事 間違ってても後で直せばいい 今後読みやすく 読者を意識する 誤字、脱字をなくす 4年間書き続けたGoogle Analyticsの結果はこれ(2011/11/02 - 2011/12/02)簡単に言うと、毎日でなくていいから、もう少し精査した記事を投稿するようにするということ。まぁ、だんだんとね。< Related Posts >[Google Analytics]Profile作成時に申請したURL以外(開発環境)でもTrackingする?Google Adsenseで稼げるのか?Bloggerに導入してみた