イラレ原稿からRetina画像をつくるまで

最近もっぱらWEB屋さんと化しています。

デザイナーさんからいただく原稿はWEB用としてちとつらいillustratorでくるのがほとんどなのですが、
ここにきてRetina対応は必須となり、Retina画像を切り出すフローに頭悩ませる日々でした。

イラレ原稿もらってもそのまま切り出せるはずもなく、パーツの区別なくオブジェクトがまぜこぜになっているため
パーツ用として切り出しやすいように、まずはオブジェクトの小数点座標排除&レイヤーを再構成
なんだかんだいってこれが一番時間がかかる作業。。。

レイヤーわけまで終わったら、PSDへ書き出し。
いままでは72dpiで書き出していましたが、Retinaへ対応させるため144dpiで書き出します。
もちろんレイヤーは保持したまま

スクリーンショット 2014-03-30 15.00.05

書き出したpsdをphotoshopで開き、ドキュメントの解像度を72dpiへ直します。
単純にSlicyなどで書き出す場合は144dpiのままでいいとは思うのですが、
@bounds設定で使いたいものがあるのでひと手間加えます。

開いた状態ではこの設定。 144dpi
横幅ピクセルを覚えておきましょう(例では600px)
スクリーンショット 2014-03-30 15.00.33

これをまず、 72dpi へ書き換えると幅が自動で300pxへ変わります。
これを再度600pxにします(縦は自動で変わります)

スクリーンショット 2014-03-30 15.00.49

これでOKです。

あとは、Slicyで書き出す際、Slicyを3倍速で使うExtentionを使いレイヤー名,@Boundsを追加していきます。これほんとに楽。ドネーション確実モノ。

じつは 144dpiのまま AddBounds を使うと、あさっての場所に@boundsシェイプが追加されてこまっていたのですが
解像度が72dpiではなく144dpiだったためにおこる現象でした。

PhotoshopCCになってから Generate機能が追加されましたが、まだSlicyのほうが細かいところでよいですね〜
倍サイズであれば 非Retina画像は縮小してくれるのでやっぱり楽

Share on Facebook

WordPressでかんたんWeb API構築

えーと、またしても何ヶ月ぶりでしょうか。。1年ぶりくらい?時の経つのは早いですね。
そして、同時進行な案件が重なりすぎて自分のことなんもできません。

そんななか、とあるiPhoneアプリ案件でサーバのデータを拾ってくる処理
いわゆるAPIを叩いてJSONデータのレスポンスを受けるweb APIなアレを作ってます。

普通にPHPやCakePHPでさくっと作ってしまえばいいのですが、クライアント側で更新するためどうしても管理画面が必要なるのですが、
管理画面をイチから構築って地味に面倒ですよね。

そーいやWordpressなら管理画面やらフロントエンドやら一式そろってるし、一発で済むんでないの??ってフと思い立ち
ちょっと試してみました。

WordPressの投稿系は
・カスタム投稿タイプ
・カスタムフィールド
あとはクライアントが使いやすいように管理画面をカスタマイズすれば十分。
ユーザー認証(管理画面へのログイン)も付いてるのでなんと楽なことでしょーか。

リクエスト/レスポンスまわりは プラグインの JSON APIで済みそう。

CakePHPみたいなコントローラークラス内にメソッドを追加していけばそれで受けてくれる模様。

まず、functions.php内にてコントローラーを追加します。
コントローラー名は「TestApi」

// コントローラーを追加
// add_testapi_controllerは登録するための関数名(適宜)
add_filter('json_api_controllers', 'add_testapi_controller');   
function add_testapi_controller($controllers) {   
    $controllers[] = 'TestApi'; //コントローラー名を指定
    Return $controllers; 
} 

// json_api_*コントローラ名*_controller_path コントローラ名は全て小文字

add_filter('json_api_testapi_controller_path', 'testapi_controller_path');   
function testapi_controller_path($default_path) {
    $path=get_template_directory().'/JSON_API_TestApi_Controller.php'; //コントローラのファイルパス
    return $path;   
}

2つめのfilterでハマったのが
「json_api_*コントローラ名*_controller_path」
この記法を変えないように。

get_template_directory().’/JSON_API_TestApi_Controller.php’;
これは、使用中のテンプレートディレクリ直下にコントローラのファイルを置くことを想定しています。

コントローラーファイルもこの記法にしたほうが無難です。
JSON_API_*コントローラ名*_Controller.php

そして、本題のコントローラ
下記のように冒頭にコメントを入れることで、プラグイン設定の部分に概要が表示されます。

<?php
/*
Controller name: TestApi
Controller description: テスト用API
*/
class JSON_API_TestApi_Controller {   
    
    public function all() { 
        $args= array('post_type' => 'post');
        $result_query = new WP_Query($args);          
        
        $result=array();
        if ($result_query->have_posts()) {
            while ($result_query->have_posts()){
                $result_query->the_post();
                
                $data['post_id']=get_the_ID();
                $data['title']=get_the_title();
                $data['date']=get_the_date('Y.m.d H:i');
                $data['content']=get_the_content();
                array_push($result,$data);
            }
        }
        wp_reset_postdata();
        return array( "result" => $result ); 
    }
}
?>

ここでは全投稿記事を取得しjsonで返送するメソッドallを作っています。
みてわかるとおり、フツーに検索してループ内で整形処理し、最後にresultという連想配列へ突っ込んで返しているだけです。
あとはプラグイン側でjsonで出力しています。

今回WP_Queryを使用しましたが、query_postsでも大丈夫です。
フツーにループで処理しているので、カスタム投稿もいつも通りに使えました。

もちろん、the_title() メソッドではechoで出力してしまうので get_the_title()などに置き換えてください。

また、引数を取り合い場合は
$_GET
$_POST
などで普通にPHP的に引数を取得できます。

最後に、コントローラファイルを配置したところで、プラグイン設定のコントローラを有効化します。
(コントローラファイルを配置しない状態ではエラーがでるはず)
WP管理面の「設定」-「JSON API」にてTestAPIを有効化してください。

スクリーンショット 2013-12-01 22.01.43

ちなみに有効化の隣のメソッド名をクリックするとメソッドを呼んでくれます。

さっくり作れるのはいいんですが、トークンやらIDやらなんにもやってないのでダダ漏れ上等なAPIではあります。
あくまでさっくりAPIってことで

Share on Facebook

BLE112

はーいつぶりでしょうか?
最後の投稿が 2011/10/17 ってまるまる1年以上も書いてないとか。
あれからいろいろありました。。

いえ、特に無いです。

最近wordress仕事ばっかしてたのに、自分とこじゃ更新すらしてないし
ArdOSCもメンテしてないし。。すいません。。

今回はまた別のことに興味できてメモ書き残しておこうと思い出したように書いております。

iPhone/iPadではBluetoothは当然サポートされているものの、Makerさんなど個人レベルで扱うには
どうしてもMade for iPhone(MFi)ライセンスの壁が富士山並に高く手を出せないのですが
iPhoneの4S以降の機種ではBluetooth Low Energyがサーポートされており、
MFiライセンス無用で使用できるようになりました。ナイス過ぎます。

いろいろ調べてみると
Bluegigaからでている
BLE112というモジュールが良い感じなので
これを探ってメモっておこうというエントリーでした。

無線なので日本では技適云々はありますが、、

IMG_1522

Share on Facebook

new ArdOSC2.1

。。。9ヶ月ぶり?
おまいさんダレ?

えとえと、久しぶりに成果物アップしました
無謀にもGitHub。
git全然わかりませんが何か?
は?フォーク?Volksは好きですもちろん

https://github.com/recotana/ArdOSC

以前とは違いごそっと変えちゃいました
メッセージのオブジェクト作って
そのオブジェクトへArgumentをAddしていきます。今っぽいですね!

あと、大きいのは
OSCアドレスごとに処理先の関数を設定できるようにしました。コールバックですね
ただ、パターンマッチまではやってないので(重くなりそうなので)単に文字列のマッチングだけです。

もひとつ、String(char *)をgetする際は予めメモリ確保を・
Exmapleでは最初に文字数を取得してから、char v[文字数]でメモリ確保し、そのポインタ渡してます
スコープ内でメモリ確保して、スコープ抜けたときに勝手にfreeするので楽かな〜と。

もし、float、stringを使わないのであれば
OSCcommon/OSCcommon.h の
#define _USE_FLOAT_
#define _USE_STRING_
それぞれコメントアウトしちゃってください。
バイナリサイズ減るはず

ドキュメントは無いので、Exampleみてくださいませ。。。

Share on Facebook

CoreMIDIの勉強

なんか去年末からごにょごにょやってたんだけど、いろいろあって遅々として進まず。
勉強するには手を動かしてコード書くのがイチバンですよねやっぱ。

CoreMIDIはぱっとみデバイス(Device,Entity,Endpoint)の関係性がいまいちわからずもやもやしてたんですが
自分なりに関係性を図に書いてみました。

CoreMIDIの図(修正)

App側からはClientオブジェクトを作成し、これを通してMIDIデバイスとやりとりするわけですが
デバイス内のEntityがいまいちわからず。
Entity内には実際のMIDI入出力ポート(Endpoint)のSource(MIDI IN) Destination(MIDI OUT)が入っています。

よくあるMIDI IN 2 /MIDI OUT 2 みたいなMIDIインターフェースで手持ちのEDIROL UM-2Gなんかだと
Entity内にそれぞれIN 2コ/OUT 2コなんて構成になってると思いきや
IN 1/OUT 2の入ったEntityが2つ という構成になってました。

MIDI Device(UM-2G)
 |
 ◆-Entity 1 –IN 1 (Source) / OUT 1 (Destination)
 |
 ◆-Entity 2 –IN 1 (Source) / OUT 1 (Destination)

また、Device,Entity,Endpoint はそれぞれユニークなIDが振られているため、永続化に使えるのか?と想像してます。

OSXでは一度接続したMIDI機器の情報は保存される模様で、つなげていなくても全デバイス取得すると取得できちゃったりします。
ただ、Entityプロパティのオフライン情報で実際の接続の有無が確認できる模様。
iPadではこんなことはなく、MIDI機器外すと全デバイス情報もクリアされちゃうみたいです。

CoreMIDIイニシャライズの流れとしては

1 Clientオブジェクトの作成
2 Inportオブジェクト、Outportオブジェクトを作成
3 MIDI受信コールバック関数をInportオブジェクトへ登録(送信のみはいらない)
4 NotificationコールバックをClientへ登録(これは適宜)
5 受信したいEndpoint(Source)とInportオブジェクトをコネクト

これでMIDI受信すると受信コールバックが呼ばれます。
送信はMIDIパケットリストを作成し、Endpoint(Destination)を指定して送信します。

受信したいEndpoint、送信先のEndpointは総じて全部まるっこ指定してるようです。
細かく制御することも可能だと思います。

とりあえずの勉強の成果としてちょっとCoreMIDI Objective-Cラッパーを作ってみました。
ちょとアプリに組み込もうとして作ったものですけど。

受信したMIDIメッセージに対応したデリゲートと
送信用のメソッド組み込んでます。
自分の使いそうなのだけですけど。(つかうってもNote ON/OFF と CCくらい)

初めてGitHub使ってみたけどうまくいけてるんだろか。。。

RTCMidiLib

それにしてもiPadだとCoreMIDIでバッグはほんとやりにくい!
ビルド/デバッグのたびにMacかMIDIインターフェースにつなぎ変えないといけないし
そもそもデバッガ使えない!
プリントデバッグではなく実機でのUITextViewデバッグ!

激しく参考にさせていただいてます
Objective-Audio
http://objective-audio.jp/cat54/core-midi-mac/

Share on Facebook