SE奮闘記

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

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してComp

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.1 Mac OS X 10.7からLicenseが変更されて、Lionが既にInstallされているPC上に最大２つまで仮想PCとしてLionをInstallできるようになった。詳しくは下記参照。 VMware KB: Installing Mac OS X 10.7 (Lion) as a virtual machine in Fusion 4   1. Mac OS X LionをApp Storeから再Download LionにUpgradeしてしまうと自動的にInstall Imageが削除されてしまうので、もう一度App StoreからDownloadし直す。 App Store起動 → (Option Keyを押しながら)Purchases → INSTALL   2. Install Disk Image(dmg)を作成 Applications → Install Mac OS X Lionを右Click → Show Package Contents → Contents → SharedSupport → InstallESD.dmgをDouble ClickしてMount Applications → Utilities → Disk Utilityを起動 "New Image"をClickして新規Disk Imageを作成 Mountしてある"Mac OS X Install ESD"を選択して、"Destination"にさっき作ったImageをDrag&Dropする。   3. VMware FusionにInstall VMware Fusion起動 → File → New ... 作成したdmgを選択して"Mac OS X 10.7 64-bit"の

Web SiteにBGMを埋め込んだときの手順をMemo. 環境: Adobe Flash Professional CS5, swfobject 2.2 1. 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)かどうかを判別 オープンソース

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

前の記事 で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しているみたいなので、しばらく放って置いた。 ・・・で、２時間経過 さすがに痺れを切らして、Mac mini自体を再起動。 再起動後は、Dockに "OS X Lion - Paused" "OS X Lion Server - Paused" と表示され、App Storeから"Install"をClickしても変化しない。 system logを確認すると以下のようなErrorが出ていた $ less /var/log/system_log Dec 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::

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が２つあるので、今度はRaid1構成にしてみる。 Install画面のMenuに"Disk Utility"があるので選択。 ２つの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

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 Help What are regular expressions? - Analytics Help   2. Webmaster ToolsとGoogle Analyticsを連携させる

動画の再生回数、最後まで見たかどうかを 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']);

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 Japanese MP4などの動画を再生するためにはApacheのMime Typeを設定する必要がある(IE)。 参考： MIMEタイプ一覧 : 個人ホームページ / BIGLOBE 動画の形式(type)も様々。Video TagのType属性指定する値は下記Siteを参考に。 Video type parameters - WHATWG Wiki H.264／AVC概要/4.プロファイルとレベル - MPlayer and MEncoder on MacOSX iPad, iPhoneなどiOS向けへの動画は Adobe Media Encoder を使って変換しているけど、 FFmpeg などで変換する場合は下記Siteを参考に。 Technical Note TN2218: Compressing QuickTime Movies for the Web | Safari Developer Library 「 ios dev h.264 」でGoogle先生に聞く   < Related Posts > HTML5(<video>) or Flashを自動で切り替えてくれるJavaScript Library（iPadやiPh

Web上で動画を再生させる方法は swfobject を利用して、 Flash対応 → Flashを埋め込む Flash未対応 → 静的画像 とするのが今までの正攻法。今後はiPad, iPhone(iOS)やSmart Phoneでも再生できるように、HTML5の"video" Tagを使うのが当たり前になってくると思う。 各Browserの差異を吸収して、HTML5のVideo TagとFlashを切り替えてくれるJavaScript Libraryを紹介。   MediaElement.js VideoJS JW Player License GPLv2/MIT LGPLv3 CC3.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 Library Safari HTML

PCとiPad両方に対応したWeb Siteを構築したときのMemo. 共通のCSSのみで完結させたかったけど、どうしても下記理由でPCとMobileを判別する必要が出てきた。 どの端末でも動画を再生させたい どの端末でも曲(BGM)を流したい Gallery（画像一覧）はSwipeで次の写真に移動したい → jQuery系Plugin側で対応しているのが多い。 PCで画面を広くした場合だけ、位置を変えたい 実現するために調査した結果の一覧。 Library 言語&License 用途 swfobject JavaScript (MIT) Flash(swf)が使えるか判別して、object tagか静的画像を自動挿入してくれる。 Modernizr JavaScript (MIT & BSD) HTML5/CSS3が使えるか判別。<video>が使えるかの判断に jQuery.Mobile JavaScript (MIT or GPLv2) TapやSwipeなどのEventを取得するのに使える。その場合autoInitializePage=falseにして利用する。 VideoJS JavaScript (LGPLv3) video tag → flash → 静的画像の順に判断して、動画を再生できるようにしてくれる。Flashの場合は FlowPlayer を利用。 こちらの記事 も参考に php-mobile-detext PHP (MIT) Server側で判断したいときに。PHP4で動かないけど、簡単に修正できる。 (WordPress) P

最近は記事に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 Graphics PSD形式でDownloadできるので、どんな風に構成されているかも確認できて勉強になる。iPhone用のIconの作成するときにも参考になりそう。   < Related Posts > Adobe PhotoshopでButtonを作るTutorial [Design]Free PSD Graphic Sample集 TwitterやFacebookのアイコンを探す Bloggerにfaviconを設定してみた favicon.ico（ファビコン）を作ってみる

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 Japan Intelの仮想化支援機能「Intel VT」とは？ － ＠IT 要件と照らし合わせると、WindowsをGuest OSに出来ないOpenVZは消える。将来性を考慮すると、やっぱりKVMかな？ でも、Server自体が古いので、結局CentOS5 + VMware Serverになりそう。（＾＾；   < Related Posts > CentOS6にVMware Server 2.0.2をInstallする（失敗編） 【仮想化】Xen（主にCitrix XenServer）を調査 【

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