2014.04.06

Mac Book Pro Retinaを今、居間にw

mbp

2月の末に、Mac Book Pro Retina 13 late 2013 を買いました。
買った動機は冬寒い。
に尽きます。
喜び勇んで開封したので開封の儀どころではなく、iphoneの変な画像しかないw

ホカホカの居間で出来る作業はホカホカでしたい。
ガラヶの家族も居間でネットしたいよね。
ということでAppleStoreでぽちりました。

なぜエントリーモデル?(オチあり)

当たり前ですが、どこで使うか。何に使うか。が機種選定の鍵になるんではないかと思います。
それプラス、オーバースペックの”オーバー”の部分にお金を使うことないよね。という考え方で挑みました。

MBPでネットサーフィン以外にする作業としては、

PhotoShopでちょっとした切り抜き、リサイズなど画像の編集
Aptanaでサイト構築 これがメイン

今までと同じ作業しかしない訳で。
snow leopard搭載のiMac late2006のスペックでも十分間に合ってる作業です。
MBPとの性能差は火を見るよりも明らかですし、今回MBPに求めたものが機動性のみだったという。
機動性のみだとすると選択肢に13inc Airが入ってきます。
しかしストレージ容量を我慢すればRetinaのMBPとの差額を6,000円と見ることもできます…
あと6,000円で2.4GHzでIPSでRetina。余裕で出せます!
画質と色は”オーバー”の部分じゃないです。しかもAirのディスプレイには当たり外れがあるという。

そこで貧乏なりに頑張って、Mac Book Pro Retina の13インチモデルの一番お安いME864J/Aを選択。
メモリだけ8GBにカスタマイズしました。
あとで自分では増やせないし本当は16GB積みたかったけど…貧乏だもん(´・ω・`)。

AppleStoreではME864J/Aを8GBにメモリ増設した場合、13inc真ん中のクラスME865J/A吊るし(8GB/256GB)との差額は1万円ほどになります。フラッシュストレージの容量128MBに一万円出すか出さないかの選択になります。

ただし!ニコニコ一括払いをするなら量販店でME865J/A 8GB/256GB一択です。AppleStoreのME864J/A カスタマイズより、交渉でポイントとかなんとかお得になる場合の方が多いんじゃないかなぁ。交渉とか関係ないAmazonですら!

けど…今回、私はAppleローン1%を利用して1年払いにしたかったのでございます。
以前iMacを買った時に1口座をすっからかんにして貯蓄し直さなかったという苦い経験から量販店との差には目を瞑ることにしましたw
そんな訳でエントリーモデルCTO 8GBなのですw。
結局は財布と相談よねというオチが着いてしまいますが、身の丈にあった選択ではないかと思われます。

ストレージ容量対策

予想通りメインのお絵描き用マッスィーンもサブのサーバーマッスィーンもあるし、そこにプラスするぶんにはMBPエントリーモデルで十分でございました。
心配になるのが内蔵ストレージの容量。
なんだかんだ必要最低限AptanaとPhotoshopとESETをインストールして現在ストレージは30GB使用してます。
どのみち容量に余裕があってもTime Machineを使いたくなるので、外付けを用意するのは必須。進行形のファイルをMBPに、作業が終了したものに関しては外付けに保存することにしました。
もともとAirMac Extremeを通してUSB接続の外付けハードディスクは無線でつながってる訳で、MBPに余計なケーブルを繫がずとも快適にバックアップと保存ができました。
これからMBPを入れたLAN環境の構築をするならAirMac Extremeはすごく便利です。あってよかったAirMac。
うちのは第二世代だけど(;´Д`)平べったくてかわいいもんね!

画面共有で快適すぎる

そしてこれが一番ありがたかったw
MBPがあれば、居間から寒い部屋のMacを操作できるのです!
今までは寒い部屋にMac2台が隣り合っておいてあり、座ったまま椅子でコロコロ移動するだけでしたから特に画面共有の必要性はなく恩恵はなかったけれど、MBPを今で使うにあたってこれほど便利なことはありません。
今やってるgit学習も一台のMacでコンフリクトしながらあったかい部屋でできるってもんです。うがー
マウス、キーボードを持ち替えないってのは、”Teleport”で経験済みなのですが、一つのモニタで違うマッスイーンを操作するのはモニタの前をうろちょろしなくていいし、なんだかことの外はかどります。

あとがき

Retinaディスプレイはどうかと言うと、文字の読み書きは快適です。
言われてるように普通のディスプレイが汚くて見られなくなる!ということは無いです。普通のディスプレイを見た時、最初違和感はありますが数分で馴れます。
どちらかというと馴れないのは、13inc RetinaにおけるWEBサイトの画像のぼやけ方です。ロゴ、文字画像周りはWEB制作側が対応をしていかなきゃなぁーと実感しましま。

その他、MBPを導入してwebの開発環境として多少見なおさなくてはならない部分もありましたが、見直しですごく環境が向上しました。
それはまた後ほど、晒してゆきたいと思います。
まだモバイルも家庭内限定ですしw 試してみたいことが沢山。夢が広がりますwうはww

2014.03.26

本棚

Photoshopを使うようになってからほぼ三冊の本に教わったなぁと今にして思う。

グラフィック社
フォトショップ・スーパーイラストレーション 寺越慶司 著
グラフィック社
寺沢武一のデジタルマンガ解剖学 寺沢武一
MdN
フォトショップ講座 ベン・ウィルモア 著

すべてPhotoshop 5.0時代の本だー。
特に寺越慶司さんの著書にはいろんな事を教わった。チャンネルとマスクについてほぼ全てこの本に教わった。

新しいMacを買ってPhotoshopをインストールして何だか思い出した。

2014.01.26

AmazonJSでサイドバーにちまっとアマゾン

WordPressでアマゾンアソシエイトを表示してます。
ネタに付随してアマゾンへのリンクをするときはいいのです。
昔の記事の商品に新しいバージョンがでてたり、記事をかくほどでもないけどお気に入りの商品をちまっと載せて置きたい。
そんな時にサイドバーに表示できたらいいなと思っておりました。
Amazon純正のは使いにくいし、なんかサイドバーに特化したプラグインでもないかな〜と数日しらべたんですが見つけられませんでした。

ネットをあてもなくさまよってたら、AmazonJSのショートコードをカスタムフィールドを使ってサイドバーに設置する方法に出逢いました!。

もう、今すぐこちら!

WordPressでAmazonのアソシエイトリンクを設置する | Webクリエイターネット
プラグインの設置のみならず、Amazonアソシエイトプログラムに登録するところから、英語で敷居の高いProduct Advertising APIの申し込み、設置のためのPHPスクリプトまで至れり尽くせりなのです!
ありがとう!ありがとう!
PHPぃ?えちょって食べれるの?というこの私にも、ほらこの通り!
amaside
ちょっとCSSをいじりました(・ω・)それしかわかんないしねw

AmazonJS

APIの設定などはWebクリエイターネットさんを見れば一目瞭然なので設置テストとプラグインの変更点だけ記したいと思います。
このAmazonJS。シンプルでとても使いやすいです。
AmazonJS (WordPress Plugin) | kwLog
制作者さまの理念を読んでなるほどと思いました。設定とともに一読されることをお勧めします!
すばらしいプラグインです!makoto_kwさま、ありがとうございます。

さて、本文への設置テスト。

うわなにこれ欲しい。茶碗…
リンクカラーなど当ブログのCSSが効いてたので、いきなり設置しても違和感がありませんでした。シンプルで押し付けない。ほんといいです。
cssに少し手を加えてみました。
v0.6から画像のサイズもショートコードで指定できるようになりました。imgsize属性でsmall, medium, largeが指定できます。
当サイトではcssをいじくってるので画像と文字部分のマージンが広くなってますが、デフォルトでは画像サイズにあわせたマージンが美しく設定されてます。

cssをオリジナルの物に替えるには作者さまのサイトの『高度な使い方』”スタイルの拡張”で説明されてます。

ダッシュボードの配色エクトプラズムってなんなの

ダッシュボードの配色エクトプラズムってなんなの

カスタムCSSにチェックをいれて、使用しているテーマの中にamazonjs.cssというファイルを作り、上書きしたいcssを変更。
.amazonjs_item と .amazonjs_item .amazonjs_indicatorのbackgroundのurlの階層を書き換えるのをお忘れなきよう。
amazonjs.jsを替える場合も同様にテーマ内にファイルを作り、チェックを入れてください。

カスタムフィールドを使いサイドバーに設置する

カスタムフィールド用の便利なプラグインを使ってないので、デフォルトのカスタムフィールドの場合になります。
まず、土台となる固定ページを作りました。
カスタムフィールドの”名前”の新規追加を押して分かりやすい名前を付け、値にAmazonJSの出してくれるショートコードをペースト。
『カスタムフィールドを追加』ボタンを押して、ページを公開して準備が整いました。
ループ以外の場所にカスタムフィールドを出力する時、ページのidが必要なので控ておいた。(『短縮URLを取得』ボタンを押すと簡単にidわかりますん)

サイドバーのテンプレートの(私の場合はsidebar.phpです。そのまんまですね。)設置したい場所に、スクリプトを追加。

これ、Webクリエイターネットさんのコードまんまなんですけど、違うところはget_post_metaの第一引数に固定ページのidを直接持ってきているところです。
それだけです(∩・ω・)∩。

コメントが入れたかったので、カスタムフィールドの値に直にタグを書きました。これはいいのかどうかわからないw

できなかったこと

複数の商品を表示するので、値に複数のショートコードを入力します。
カスタムフィールドの値の窓が狭いのと(伸びるけど)、変なコメントを入れたりして見た目にごちゃごちゃだし、複数のカスタムフィールドで管理したいような気がしました。
一つの”key”に複数の”value”ですね。
forecheでクルクルしてやればいいのかなーと思いましたが、そうするとカスタムフィールドでショートコードを使う方法が分からないので断念しますた。
逆転の発想で、掲載したい数だけ別名のカスタムフィールドを作ったろーかなーと思いましたけど…却って不便そうなので…w

2014.01.20

jQuery 追加の置換をしたいのよ〜正規表現?(`・ω・´)キラッ

先ず何から取っ掛かっていいのかも分からないほど…jQuery学習にブランクが開いてしまいました。
少々いじる機会があったのでリハビリ備忘録を付けておきます。

階層が違うyo!相対パスが切れるno!

メインサイトさわやかまみれを更新するとき、面倒のなきようナビゲーションが置いてある各ページ共通のfooterに外部ファイルのhtmlを.loadで読み込んでます。
(以前書いた記事『備忘録 jQuery .loadでfooterを管理 & ウィンドウサイズで位置変更』)

階層が違うページに共通仕様のfooter.htmlを読み込ませるとナビゲーションや画像のリンク(相対バス)が切れてしまうため、別階層用のfooter.htmlを用意しておりました。
変更があれば当然、二つのfooter.htmlを直さなくてはなりません。
めんどくさい。
めんどくさいという理由からcssを覚えjQueryに手をだしたのに…むっきー

そこで今度は一つのfooter.htmlで済むようにロード時にリンクを書き換えるスクリプトをなんとかしようと思います。

loadで読み込むfooter.htmlのパスの分岐

footer
まず、footer.htmlへのパスを分岐させる条件を付けるべく下の階層にあるunder.htmlの<body>にidを振り、

bodyにid=under_layerがある時は上の階層へのパス、それ意外の時は同じ階層という具合に分岐をしておきました。

そしてunder.htmlに読み込んだfooter部分のリンクのパスを変えるべく上記.loadのfunction()の部分、コールバック関数で小細工をしたいと思います。

各ページへのLINKと画像のパスを書き換える

一階層上のファイルにアクセスしたいだけなので、相対バスの頭に../を付けてやればいいだけなのです。
簡単です。簡単に違いありません。しかし方法が分かりません…
aとimgの属性をそれぞれ.attrで書き換えてやればいいんです。
しかし、単純にhrefをattrで拾って、

するとツイッターやブログのアドレスのhttpから始まる部分の頭にも../がついてしましま。

そこでググったところ.replaceで正規表現とかなにそれ魔法?という方法が見つかりました。

3行目。attrで取得したurlを.replace(“置換したい文字列”,”置換後の文字列”)で置き換えるのですが、置き換えるんじゃないの、頭に追加したいのという希望をかなえるのが、最後の$1の部分。
正規表現で文字列を()でグループ化しておくとキャッシュしておいてくれて、後方参照ちうので使い回せるんです。

ところでちょっと正規表現の覚え書き。
/スラッシュ/で囲った部分が正規表現。クォートでは囲まないよ。
スラッシュ内の()は文字列をグループ化。
[a-z]+ 小文字a~zまでのいずれか一文字を一回以上繰り返し。(baa)
\.html$ バックスラッシュでドットをエスケープして文字としてあつかい、最後が.htmlと一致(.html)
| の区切りは’または、’でrssも検索(foo.rss)
最後のgで複数個文字列を検索。(この場合いらんかも?)

.replace(/置換したい文字列の正規表現/,”追加する文字列$1″)の$1にグループ化しておいた文字列baa.htmlが参照され
../baa.htmlとなります。

やった(∩・ω・)∩なりました。
画像も同じようにsrcを置換してやることにします。画像はまたフォルダに入ってるので、正規表現をちょろっと変えなくては…
.+jpg$とかでいいかなぁ。
ちょっと正規表現は難しいですが、覚えると色んな事ができそうですな。

参考サイト:
JavaScriptの正規表現で文字列を抜き出す「グループ化」: 小粋空間
jQueryで正規表現を学んでみる。【基礎編】 | webOpixel
サルにもわかる正規表現入門
くそぅ404の亡霊

リンク切れもなく、画像も無事に表示されておりますが、SafariのWEBインスペクタのコンソールに画像がノットファウンドだとエラーがでちゃいます。
Firefoxコンソール、FirBugではエラーありません。
404だという画像のパスはunder.htmlと同じ階層になってまふので、読み込みのタイミングだとは思いますがちょっと悲すぃですね。

2014.01.12

そして外付けケースに移植〜HDD換装その後(∩・ω・)∩

outhdd

先日iMac late2006から外した250GBのHDDを外付けとして再利用します。
今回用意した外付けケースはこちら。

クロシコのGW3.5AA-SUP  SATA3.5型HDDケース USB2.0
AirMac Extremeベースステーションで使う予定なので、電源連動は不要だし悩んだんですけど、この電源連動無いバージョンの評判があまりよろしくなかったのでこちらにしてみました。
お約束の購入時のお値段はAmazon ¥1,709 ご参考にしてくだしあ。
選考基準はお・ね・だ・ん。なぜシルバーなのかもお値段。
デザインでは2.5inchならLogitec一択だったんですが、3.5inchはどれもこれもデザインとかなにそれおいしいの?ですし。

hdd_kaifu
開封の儀。付属品はネジ3種類、縦置きスタンド、ACアダプター、USBケーブル。
説明書は英文のが入ってます。画付きなので大丈夫。
対応0SはMacだと10.3以降になっちょります。
大きさはこんくらい。比較用にMagic Mouseのせました。
hdd_size

さて、組み立てです。拍子抜けするほど簡単なのです。
難関?は二つほど。
hdd_LED
一つ目はこれ。外箱裏面に書いてあるのですが、LED(画像 赤丸)を曲げないようにご注意。もがっ!なんも意識してなかった。だって外箱あんまり見てなかったもん。画像では既になんかちょっと曲がっているような気がしますが様子見。点かなかったら外しますわ。

まず、バックパネルのコネクタにさくっとHDDを差してHDD上面に止め付けるのは短い皿ネジです。
hdd_nezi

そんで、残りの長いネジは側面。黒いネジは黒いバネルに。
hdd_nezi_posi

黒いネジをバックパネルに止めるところで事件発生。
事件というほどでもないですがね。ネジ穴がHDDのネジ穴と合いません。
hdd_zure
だいたいこういうのネジ強引に締めればなんとかなるんだけど、ネジが締められないほどずれてますよ。最大の難関w
幸いというかコネクタ側は正常。ずれているのはHDDのコネクタとは反対側のネジ穴なので、力技で穴の位置を合わせるです。
少しボディ部分を押し下げただけで、ネジが締められるようになりました。そんなにもテンションはかかってないような…。
あんまり激しくHDDとケースのネジ穴位置がずれている場合は無理せず交換に出した方がええかもしれません。

hdd_fin
さあ、できました。開封から所要時間10分以内です。
以前、Snow Leopardで外付けのフォーマットで痛い目を見たような気がするので、iMac/Snow leopardで使っていたデータはこのままmini/MountainLionのディスクユーティリティで消去することに。
miniに繋いで、無事に認識。LEDも大丈夫みたいです。光ってます。
AirMac Extremeには既に一台外付けがつながっているので、USBハブを用意しました。
hdd_ushab
iBUFFALO 【PS3動作確認済】USB2.0Hub バスパワー 4ポート グリーン BSH4U06GR(Amazon)
かわいいねぇ。
しかし、AirMacに挿すと裏面が上にきちゃうねぇ。残念だよ。

iMacスノレパのFinderからAirMacのアイコンをクリックしたらなにもせずに新しい外付けも認識されてました。AirMacユーティリティでは一台目と同じ共有の設定が引き継がれていて、差し支えないのでこのまま運用します。
音ははっきりいってウルサイかもしれません。でもこれはケースじゃなくて中のHDDのせいでしょう。隣室に置くのでまあいいのです。
けっこうボディは熱くなってます。横置きは放熱が片面だけになっちゃうしダメな予感。もともと横置きの足ゴムも付属してませんし、縦置き前提っぽいです。

ちょっと遊び心で250GBのこの外付けに生まれ変わったHDDをTime Machineに設定してみましたw
1TBに換装した内蔵のバックアップを250GBに…無謀ですw
AirDisk経由でTime Machineってどんな感じなのかやってみたかったのです。
現在内蔵は65GBの使用量なんで、現在無事にバックアップが作成されておりますが、数ヶ月だけ遊んでみようかと。
そんで巧くいったら2TBの外付け買うのでしょうね…なんか病気じゃないかと思われます。

PageTop