Quantcast
Channel: その後のその後
Viewing all 317 articles
Browse latest View live

[iOS][Xcode]Objective-Cのクラスの依存関係を「D3.js」でビジュアライズするライブラリ

$
0
0

Objc-dependency-visualizerというOSSツールを使うと、アプリ内で使用している Objective-C クラスの依存関係をビジュアライズしてくれます。


試しに "iOS7 Sampler" でやってみると、こんな感じのを生成してくれました。


f:id:shu223:20140310030019j:image


実行するのはrubyスクリプトで、依存関係だけが記述されているだけのシンプルなjsファイルが生成されます。


で、閲覧時にはリポジトリに同梱されている index.html 内のJavaScriptから、生成したjsファイルとビジュアライゼーション用 JavaScript ライブラリ「D3.js」を使用してビジュアライズされます。


そんなわけで、引っ張ったり特定の箇所にフォーカスしたり表示をいろいろカスタマイズしたりできます。


f:id:shu223:20140310031646j:image

(SVProgressHUDにフォーカスした図)


使い方

GitHubからcloneしてきます。

git clone https://github.com/PaulTaykalo/objc-dependency-visualizer.git

あとはスクリプトを実行するだけ。

cd objc-dependency-visualizer
./generate-objc-dependencies-to-json.rb -s <PROJECT_PREFIX>  > origin.js

・・・といっても引数に指定する <PROJECT_PREFIX> って何?という話ですが、スクリプトの中身を見たところ、

IO.popen("find ~/Library/Developer/Xcode/DerivedData -name \"#{options[:project_name]}*-*\" -type d -depth 1 -exec find {} -type d -name \"i386\" -o -name \"armv*\" -o -name \"x86_64\" \\; ") { |f| 
 f.each do |line|  
  paths << line
 end
}

"~/Library/Developer/Xcode/DerivedData" を見に行ってるので、その配下にあるフォルダ名のプレフィックス(例:フォルダ名 "iOS7Sampler-gsaqzzlucgunafcnfuaxtsbqynjz" であれば "iOS7Sampler")を入れておけばよさそうです。


成功すると origin.js に次のような依存関係を抽出したものが出力されます。

var dependencies = {
links:
  [
         { "source" : "ActivityTrackingViewController", "dest" : "CMMotionActivityManager" },
         { "source" : "ActivityTrackingViewController", "dest" : "CMStepCounter" },
         { "source" : "ActivityTrackingViewController", "dest" : "SVProgressHUD" },
         { "source" : "AVCaptureManager", "dest" : "AVCaptureDevice" },
         { "source" : "AVCaptureManager", "dest" : "AVCaptureDeviceInput" },
         { "source" : "AVCaptureManager", "dest" : "AVCaptureMovieFileOutput" },
         { "source" : "AVCaptureManager", "dest" : "AVCaptureSession" },
         { "source" : "AVCaptureManager", "dest" : "AVCaptureVideoPreviewLayer" },
         { "source" : "BeaconViewController", "dest" : "CBPeripheralManager" },
         { "source" : "BeaconViewController", "dest" : "CLBeaconRegion" },
         { "source" : "BeaconViewController", "dest" : "CLLocationManager" },
         { "source" : "BeaconViewController", "dest" : "PulsingHaloLayer" },
(中略)            
      ]
 }
;  

あとはリポジトリに同梱されていた index.html を開くだけ。


しくみ

ビジュアライズの部分は上述した通り「D3.js」が用いられています。


で、依存性を抽出する部分は、スクリプトのソースを見てみると、

IO.popen("find \"#{options[:search_directory]}\" -name \"*.o\" -exec  /usr/bin/nm -o {} \\;") { |f| 

という処理があることから、nmコマンドが用いられているようです。(nmはオブジェクトファイルからシンボルをリストするコマンド)


ちなみに、昔書いた

で紹介した objc_dep.py ではプロジェクト内にあるソースファイルを直接見に行く形式だったので、同じプロジェクトに対して実行しても結果が変わってくるかと思います。


プロジェクトフォルダにはあるけど実は使用してないコードとかが混ざらない分、こっちの方がよりアプリの実態を正確に表してくれそうかなと。




[Xcode][iOS][Objective-C]IB上でカスタムフォントを選択してプレビューできるXcodeプラグイン『MoarFonts』

$
0
0

iOSでカスタムフォントを使う場合、いままで(自分の場合)は

  1. UILabelやUIButtonのサブクラスを作成(内部でfontプロパティをカスタムフォントで差し替える)
  2. IB 上で UILabel オブジェクトを置いて、"Custom Class" に 1 で作成したクラスを指定
  3. IB 上でフォントサイズ、色、レイアウトを決める
  4. ビルドして確認

ってなことをやってたわけですが、カスタムフォントは同じポイント数(pointSize)を指定しても全然サイズが違ったり、縦位置が全然違ったり、横に大きく広がったりということがザラで、 ビルドしてみるまでどう見えるかが未知数、という問題を抱えていました。「ちょっと大きかったなー」「もうちょい下か」「frame.size.width広げよう」みたいに調整する度にビルドするという。。


自分は比較的泥臭い作業耐性があるのでそんなもんだと思ってやってたわけですが、昨今のXcodeプラグインブームを見るにつけ、「どこかの偉い人がとっくに解決してくれてるのではないか」と思ってググってみたらやっぱりありました。


MoarFonts

http://pitaya.ch/moarfonts/



Interface Builder 上でカスタムフォントを選ぶことができ、ばっちりプレビューもされます。


使い方は、プロジェクトにスクリプトを1行追加してビルドするだけ。


導入手順

moarfontsの実行ファイルを /usr/local/bin にコピーしておきます。

$ cp moarfonts /usr/local/bin/

下記ディレクトリのアクセス権を変更しておきます。

sudo chmod a+w /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator7.1.sdk/System/Library/.lilid
sudo chmod a+w /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator7.1.sdk/System/Library/.lilid/.lilic

使い方

[Build Phase] の + ボタンを押して [Run Script Build Phase] を追加して下記スクリプトを入力。

mdfind -onlyin "${SRCROOT}" "kMDItemContentTypeTree == public.font" -0 | sort -z | xargs -0 /usr/local/bin/moarfonts install

ビルドすれば上記スクリプトが実行され、あとはXcodeを再起動すればIBからカスタムフォントが選択・プレビューできるようになります。


トラブルシューティング

自分のXcodeプロジェクトで、IBのフォントのドロップダウンリストには出てくるものの、選んでも反映されない、ということがありました。


フォントをコピーするスクリプトの mdfind コマンドに渡すパスのあたりが怪しいと思い検証してみたものの、そこは正しくフォントファイルを検索できている様子。スクリプトの結果をログ出力させてみても success したと言っています。

Successfully installed xxxx (/Users/(中略)/Resorces/fonts/xxxx.otf)

いろいろ試してわかったのは、そのプロジェクトで使用していた複数のフォントファイルの、「フォント名がかぶっていた」ことが原因でした。不要な方を削除することで解決。


無料のはないの?

非常にありがたいMoarFontsですが、実は有料(10ドル)です。購入を決断する前に、無料のものも探してみました。

deni2s/IBCustomFonts ? GitHub

最初に見つけたのはこちらでした。


システムフォントの定義をカスタムフォントに置き換えることで、「カスタムフォントをIB上で選択」を実現するものです。Xcodeプラグインではなくプロジェクトに追加しておく方式で、

こちらの記事で紹介した『AutoNibL10n』とできることも実現方法(loadメソッド内でmethod swizzling)も似ています。


一番肝心な「IBでのプレビュー」ができないので今回の要件としてはアウト。


0xced/FontReplacer ? GitHub

良さそう、と思ったのですが、もう公開されてないようです。どうやら、上記のMoarFontsと同じ作者で、README には MoarFonts を使ってくださいと書いてあります。



そんなわけで、無料で「IBでカスタムフォントのプレビューができる」ものは見つけられず、MoarFontsをお買い上げ。短縮できる時間や自分でつくる時間を考えると、全然ありかなーと思います。


[iOS][Objective-C][ライブラリ]UISegmentedControlで複数セグメントを選択する

$
0
0

UISegmentedControl は複数のセグメントの中からどれか1つを選ぶための UI なので、セグメントごとにOn/Offをトグルさせる、といった使い方はできないわけですが、見た目的にそういう挙動を期待したくなることがあります。


たとえば、TableViewやCollectionViewの要素や、マップのアノテーションの、フィルタリング条件を指定してもらうためのUIとか。


そこで、WLSegmentedControlというOSSを使うと、UISegmentedControl と同じような見た目で、複数セグメント選択ができるようになります。


an0/WLSegmentedControls ? GitHub


こんな感じです。


f:id:shu223:20140323102116p:image:w300


UISegmentedControlのサブクラスとして実装されてるわけではなく、UIControlをベースに、見た目がiOS7のUISegmentedControlっぽくなるように実装されています。


使い方

ビュー生成:

NSArray *items = @[@"item1", @"item2", @"item3", @"item4"];
self.segmentedCtl = [[WLHorizontalSegmentedControl alloc] initWithItems:items];
self.segmentedCtl.allowsMultiSelection = YES;
[self.segmentedCtl addTarget:self
                      action:@selector(segmentChanged:)
            forControlEvents:UIControlEventValueChanged];
[self.view addSubview:self.segmentedCtl];

メソッド名などでやってることは一目瞭然だと思うので、説明は割愛します。


各セグメントの選択状態を指定する

WLSegmentedControl は、NSIndexSet という、複数のインデックス要素を格納するコレクションクラスを利用してつくられています。


選択状態をセットするときは、NSIndexSetオブジェクトを生成して、 setSelectedSegmentIndice: メソッドでセットします。

NSIndexSet *indexSet = [[NSIndexSet alloc] initWithIndexesInRange:NSMakeRange(0, 4)];
[self.segmentedCtl setSelectedSegmentIndice:indexSet];

あまりよくないところ

  • メンテされてない(2014年3月現在、3ヶ月以上前から更新なし)
  • 見た目のカスタマイズ性に乏しい
    • フォントとか。
  • ソースがあまり奇麗ではない
  • CocoaPods非対応
  • プロジェクトに追加すべきクラスファイルだけフォルダにわける、といった配慮もされてない
  • IBで配置できるようにつくられてない

こんな感じで、OSSとしては積極的におすすめできるものではありませんが、pull requestしたり、参考にしつつ自分なりに新たにつくるなどすると良さそうです。


参考

EZ-NET: NSIndexSet の値を取得・設定する : Objective-C プログラミング


[iOS][Objective-C][IRKit][ガジェット]複数のWiFi設定を保持しIRKitにセットできるユーティリティアプリをつくりました

$
0
0

IRKit は基本的に家に据え置きで使うことが想定されたプロダクト設計になってますが、自分の場合はいろいろと仕事で使う場面が多く、家とコワーキングスペース、その他別の作業場所など、使う場所がコロコロ変わります。


で、IRKitは軽くて小さいのでデバイス自体のモバイル性は高いのですが、公式アプリにしろSDKにしろ、WiFi設定は基本的には一度きり、という想定になったつくりになっています。具体的には、SSID, PasswordをWiFi環境が変わるたびに手打ちしないといけない。


f:id:shu223:20140324182734j:image:w240


それが面倒なので、WiFiのSSIDとPassowrdの設定を複数保持して、IRKitの設定時に呼び出せるユーティリティアプリをつくりました。


ダウンロード

GitHubでプロジェクト一式を公開しています。git clone して pod install してください。


https://github.com/shu223/IRKitWifiUtility


使い方

1. wifi_settings.plist に ssid と password の辞書を入れておく

2. ビルド&インストール

起動するとplistに書いたWiFi設定がリスト表示され、


f:id:shu223:20140324181601j:image:w240


セルをタップするといつものセットアップ画面が立ち上がるのですが、下記のように Name (SSID) と Password があらかじめ入力された状態になります。


f:id:shu223:20140324182756j:image:w240


しくみ

WiFi設定画面のビューコントローラは IRWifiEditViewController なのですが、このクラスの keys という IRKeys 型オブジェクトに、plistファイルからとってきた SSID/Passをセットしています。


その際、IRWifiEditViewController オブジェクトはアプリ側(SDK導入側)から直接生成したり保持したりしてないので、そのプロパティをアプリ側からいじるために、IRNewPeripheralViewController の navController プロパティをヘッダに出す修正をSDKに行い(pull request 送信済み)、そのdelegateにアプリ側ビューコントローラをセットしています。


IRNewPeripheralViewController *vc = [[IRNewPeripheralViewController alloc] init];
vc.delegate = self;

[self presentViewController:vc
                   animated:YES
                 completion:^{
                     
                     vc.navController.delegate = self;
                 }];

で、UINavigationControllerDelegate の 〜 willShowViewController 〜 メソッドで、IRWifiEditViewController オブジェクトをフックし keys プロパティをいじっています。

- (void)navigationController:(UINavigationController *)navigationController willShowViewController:(UIViewController *)viewController animated:(BOOL)animated {
    
    if ([viewController isKindOfClass:[IRWifiEditViewController class]]) {
        
        IRKeys *keys = [(IRWifiEditViewController *)viewController keys];
        if (keys) {
            
            NSAssert(selectedIndex < [self.items count], @"invalid index!");
            
            NSDictionary *item = self.items[selectedIndex];
            keys.ssid     = item[@"ssid"];
            keys.password = item[@"password"];
            
            [(IRWifiEditViewController *)viewController setKeys:keys];
        }
    }
}

注意点

設定を変えるときはIRKitデバイス側のリセットが必要です。


自分の場合はボールペン等は持っていないことが多いのですが、ライトニングケーブルの角でもリセットスイッチを押せることを発見し、上記ユーティリティの作成と相俟ってだいぶIRKitをいろんな環境で使うのが快適になりました。


f:id:shu223:20140324181657j:image:w400



IRKit
IRKit
posted with amazlet at 14.01.14
maaash.jp

[iOS][制作実績][iBeacon][雑記][海外就職]iBeacon+実店舗の初仕事がリリースされました(&独立のご報告)

$
0
0

人に会う度に「あれ、なんで日本にいるの?」「いつアメリカに戻るの?」とよく聞かれるのでまずご報告ですが、現在はフリーランスの iOS エンジニアとして日本国内で活動しております。


シリコンバレーから戻ってきたきっかけは、こちらこちら の記事に書いた通り「プライベートな事情」だったわけですが、その後しばらくしてその「事情」は落ち着き、アメリカに戻れる状況になったときに、自分としては結構迷いがありました。


理由は主に自分がエンジニアとして今後どう生存していくか的なことなのですが、本題に入る前にものすごく長くなってしまいそうなのでまたの機会に書きます。


そんなこんなで数ヶ月フラフラしつつ色々考えた結果、今年1月末に都内にちゃんとアパートを借りて引っ越し、2月から正式にフリーランスエンジニアとしての活動を開始したのでした *1


みなさまどうぞよろしくお願いいたします!!!



・・・で、やっと本題です↓


本題:iBeacon+実店舗アプリ

今日リリースされたてほやほやの、火鍋専門店『小肥羊』で使えるメニューオーダーアプリです。



こちらの記事がわかりやすいです。


iBeaconの使い方としては実店舗での入退店管理とクーポン付与というド直球。


ちなみに僕が開発を担当したのは、このリリースされたアプリ自体ではなく、プロジェクト前段階の実証実験用アプリです。

  • 店に近づくと通知が来て地図が出て道案内してくれる
  • 入店するとメニュー等のUIが有効になる
  • 入店後しばらくするとおすすめメニューを通知
  • 退店するとありがとうございました通知&クーポン付与

みたいな機能を持つアプリをつくって、このプロジェクトの関係者一同のiPhoneに入れて実際に店に行く体験をしてみる(火鍋を食べてビールも飲む)、という実験でした。


(その頃のツイート)


その実験から得たいろいろなノウハウや反省を活かして本番アプリ開発へ、となったわけなのですが、僕はその頃はもう別のお仕事が決まっていたので本番開発には入れず、じっとスカイプを見守っていただけでした *2


きっかけ

ちなみにこの話をいただくきっかけになったのは、こんなツイートでした。



iOS+デバイス連携的なことに興味を持ち、連載とか始めたりブログに書いてたりしてたのを知っていた MTL の @i2key さんからの絶妙のトスでした。


ほんと何がやりたいとか書いとくといいことあると思いました。


メディア掲載等


他にやってること

新しいウェアラブルデバイスの開発とか、とある医療機器系のスタートアップとのお仕事とか、UIに凝ったiOS7アプリ案件とか、ありがたいことにおもしろい&勉強になるお仕事の話をいろいろといただいております。


今は書けないことばかりなのですが、書けるようになったら順次報告させていただきたいと思っております。


まとめ

火鍋すごくおいしいのでぜひお試しください!


https://itunes.apple.com/jp/app//id839937843?mt=8


*1:AppSociallyの問い合わせ対応的なことは続けていて、CEO高橋氏とはいまも良き友人です。

*2:リリースアプリのじゃんけんボーナスチャンス機能だけは担当してたりします

[iBeacon][iOS][Bluetooth][ガジェット]【iBeacon】Estimote iOS SDKがついに(やっと)温度センサと加速度センサをサポート

$
0
0

iOS7リリース当初は「iBeacon といえば Estimote」ぐらいの存在感を発揮していたものの、

・・・と 他のビーコンがどんどん実践投入 されていく中でだんだん存在感が薄れてきた Estimote が、ついに加速度センサと温度センサをサポートしたSDKをリリースしたようです。



さっそく試してみた

1. SDKを取得

Estimote iOS SDK の 2.0beta ブランチをcloneしてきます。


2. ファームアップデート

2.0betaブランチに付属しているExamplesプロジェクトをビルドすると、

Update Firmware Demoという項目があるので、そこからファームをアップデートします。


f:id:shu223:20140406122128j:image:w240


自分が持ってるEstimote ビーコン3台のうち、1台は検出されず、1台は何度やっても必ず途中でコケる、そして1台だけ成功しました。


何に失敗してるのかわからなかったので、デモのソースを見てみると、

[self.beacon checkFirmwareUpdateWithCompletion:^(ESTBeaconFirmwareInfoVO *result, NSError *error) {
}];

こんな感じでエラーは取れてるので、それを表示するように改修 *1 してみたところ、download -> reboot まではうまくいってて、ファームインストール中に接続が切れてるようでした。


そのビーコンは繋がったり繋がらなかったりするので、電波が弱くなってるのかもしれません。もう1台は一度も検出すらされないし。。


温度センサの値を見る

ファームアップデートに成功すると、Examplesの Temperature Demo でそのビーコンを選択できるようになります。


で、そのビーコンを選択すると、接続が始まり、接続成功すると、


f:id:shu223:20140406122242j:image:w240


28.2度・・・


まだまだ肌寒い4月6日現在において、そんなはずはありません。


下に書いてあるINFORMATIONを読むと、参照温度をセットしてキャリブレーションしてねと書いてあります。


気温をキャリブレーション

手元に温度計等がなかったので、天気アプリで現在の気温を見て、

[self.beacon calibrateTemperatureWithReferenceTemperature:@(10.)
                                               completion:^(NSNumber *value, NSError *error) {
                                                   
                                               }];

こんな感じでキャリブレーションしました。


当たり前ですが、一度やればOKです。


ただビーコンごとにやる必要はあるので、もしこのビーコンの温度センサ機能を実践投入するなら、(台数によっては)複数のビーコンを一括キャリブレーションするユーティリティが必要になりそうです。


温度センサの値を取得するメソッド

こんな感じのシンプルなものでした。

[self.beacon readTemperatureWithCompletion:^(NSNumber* value, NSError *error) {
}];

加速度センサの値を見る

Examples の Accelerometer Demo で確認できます。


f:id:shu223:20140406122456j:image:w240


iOSの加速度センサのようにデバイスの傾きが得られるのではなく、Core Motion のモーションアクティビティのように動いた回数がカウントされます。


ビーコンを動かしながら値がどう動くか見てみた感じだと、閾値以上の傾きがあるたびに値がインクリメントされるようです。


加速度センサの値を取得するメソッド

実はiOSのように加速度センサの傾き自体を取得できるようになっていて、でもアプリ側で閾値処理して歩数カウントしてるのかなと期待したのですが、

[self.beacon readAccelerometerCountWithCompletion:^(NSNumber* value, NSError *error) {
}];

SDKでカウント自体しか取れないようにされていました。


使い道

温度センサは、iOSデバイスにも、他のビーコン端末にもついてない *2 センサなので、ビーコンの可能性がいろいろ広がるのではないでしょうか。


たとえば、IRKit + iBeacon であれば、今まで領域に入ったらエアコンon、出たらoff、としていたものを、温度が一定以上なら冷房をon、温度が一定以下なら暖房をon、みたいに出来ます。


加速度センサは、据え置きというよりは失くしもの防止等の持ち歩き用途で移動中かどうかを判別するとか、据え置き型なら持ち出し防止とか、そういったことに使えるかもしれません。


何はともあれ、技適マークは取得してくれないとどうにもなりませんが。。


参考・関連記事

*1:本家リポジトリにプルリク送りました

*2kontakt.io は、新基盤でセンサを拡張できるようになっているとCEOが言ってました。

[iOS][Objective-C][Xcode][ライブラリ]第5回、第6回 #potatotips で勉強になったことのまとめ

$
0
0

例のごとく、『第5回 #potatotips』『第6回 #potatotips』について @hirama2 さんの記事を読んでキャッチアップさせていただきました。


で、ちまちまメモとして勉強になったことをツイートしてたのですが、わりとふぁぼられ率が高いので、ニーズあるかもしれないのでこちらにまとめておきます。


え!?Storyboard使ってるのにそんな画面遷移のしかたしてるのですか!?

ViewControllerを疎結合にしておくための、値の受け渡し方の提案、およびそれを実現するための TKRIntent の話。


スライドでは「そもそものstoryboardのいいところ」から始まり、「困るケース」「解決案」と順を追って説明してくれるので、すごくなるほど感があります。



下記ツイートの通り、直近の案件でまさにそういう状況になってたので、タイムリーに響きました。



SDWebImageを1年半使ってみた

超定番ライブラリ、SDWebImage の諸々の使い方や、職人的に気が利いてるところの紹介。FastImageCache との併用例も。



「非同期で画像をとってきてくれるライブラリ」は過去にもいろいろなものが台頭しましたが、このスライドを読んで、SDWebImage はそれらの決定版なんだなーと。


あと、最後のページの「自前の実装は捨てましょう」が個人的にグッときました *1



デバッグ時のカスタムQuick Look機能

個人的にこのTipsを知ったときは超テンション上がりました。



下記記事にキャプチャ入りで詳細に書かれています。


多段delegateをResponder Chainで取り除く方法

Responder Chainをたどって、移譲先(セレクタが実装されているコントローラ)を見つけて、処理してもらう方法。


delegate が多段になってつらくなる、というケースも結構あるあるなので、今度試してみようと思います。


iOS simulatorでもcolored logcatしたい!


タイトルだけ見たときは、「コンソールのログ出力に色をつけてくれるXcodeプラグインなのかな?」と思ったのですが、記事を読んでみると、

  • ブラウザでログを見る
  • 複数アプリのログを見ることができる
    • url schemeでアプリ間を行き来する際のログを追うこともできる

という特徴があり、しくみとしては、

  • goのlogcat serverがブラウザにログを送る
  • ログの整形は template/main.html で行っている

となっているそうです。


こういうやり方もあるのかーと勉強になりました。


関連


*1:UIScrollView をベースに、自前でつくってたカルーセルUIコンポーネントがあったのですが、ふと『iCarousel』(こちらも超有名OSS)を見てみたら、そっちの方がずっとよくできてて、自分の実装はあっさり葬り去ることになったという。(iCarouselは「カバーフローをつくるもの」という思い込みがあって、当初は選択肢として考えてなかった)

[iOS][Objective-C][アニメーション]【iOS7】53種類のカスタム画面遷移を試せるサンプルコードを公開しました

$
0
0

リポジトリだけつくって、ずっと放置してた 「iOS7のカスタム画面遷移ギャラリーアプリ」 にやっと手をつけて、第1弾として 53種類 を試せるようにして公開しました。


f:id:shu223:20140416100040g:image


https://github.com/shu223/AnimatedTransitionGallery


なぜつくったのか

iOS 7 から UIViewControllerAnimatedTransitioning および UIViewControllerTransitioningDelegate プロトコルが追加され、カスタム画面遷移(トランジションエフェクト)が格段に実装しやすくなりましたが、結局のところ実際のアニメーション部分は自分で実装する必要があります。


で、カスタム画面遷移は UIViewController の実装とは切り離せるようにAPIが設計されていて、使い回しやすい ので、こうして一カ所にまとまっていてすぐに試せて見比べられたら便利かも、ということでつくりました。


使い方

git clone した後、 git submodule してください。

$ git clone https://github.com/shu223/AnimatedTransitionGallery
$ cd AnimatedTransitionGallery/
$ git submodule update --init --recursive

あとは TTMAnimatedTransitionGallery プロジェクトを開いてビルドすればOKです。


利用可能なカスタム画面遷移一覧

  • HUTransitionVerticalLinesAnimator
  • HUTransitionHorizontalLinesAnimator
  • HUTransitionGhostAnimator
  • ZBFallenBricksAnimator
  • ATCAnimatedTransitioningFade
  • ATCAnimatedTransitioningBounce
  • ATCAnimatedTransitioningSquish
  • ATCAnimatedTransitioningFloat
  • LCZoomTransition
  • ADBackFadeTransition
  • ADCarrouselTransition
  • ADCrossTransition
  • ADCubeTransition
  • ADFadeTransition
  • ADFlipTransition
  • ADFoldTransition
  • ADGhostTransition
  • ADGlueTransition
  • ADModernPushTransition
  • ADPushRotateTransition
  • ADScaleTransition
  • ADSlideTransition
  • ADSwapTransition
  • ADSwipeFadeTransition
  • ADSwipeTransition
  • ADZoomTransition
  • CECardsAnimationController
  • CECrossfadeAnimationController
  • CECubeAnimationController
  • CEExplodeAnimationController
  • CEFlipAnimationController
  • CEFoldAnimationController
  • CENatGeoAnimationController
  • CEPortalAnimationController
  • CETurnAnimationController
  • KWTransitionStyleNameRotateFromTop
  • KWTransitionStyleNameFadeBackOver
  • KWTransitionStyleNameBounceIn
  • KWTransitionStyleNameDropOut
  • KWTransitionStyleNameStepBackScroll
  • KWTransitionStyleNameStepBackSwipe
  • KWTransitionStyleNameUp
  • KWTransitionStyleNamePushUp
  • KWTransitionStyleNameFall
  • KWTransitionStyleNameSink
  • DMAlphaTransition
  • DMScaleTransition
  • DMSlideTransition
  • HFAnimator
  • HFDynamicAnimator
  • BouncePresentTransition
  • FlipTransition
  • ShrinkDismissTransition

たくさん集めてみての所感

とりあえず集めてみたものの、正直なところどれも「新しいAPIが追加されたのでつくってみた」感が強く、OSSとして完成度の高いものは(まだ)あまりないと感じました。


サンプルとしてはインパクトがあっても、クセが強すぎるものは使いづらいですし、本格的にアプリをつくる場合、アニメーションや演出の類いはやはり細かいチューニングをする必要がでてくるものですが、今回追加したOSSはカスタマイズ性に欠けるものがほとんどです。


また「遷移後の後片付け」がちゃんとされてないものもたくさんあります(遷移後にビューが元の状態に戻らないとか)。


とはいえ同じく iOS 7 で追加された snapshotViewAfterScreenUpdates やresizableSnapshotViewFromRect:〜 をうまく利用しているものや、CATransform3D で三次元的なエフェクトを使っているものもあり、自分が実装する際の参考やたたき台として便利だとは思うので、ぜひ一度ビルドしてお試しいただければと思います。


参考

iOS7のカスタム画面遷移については、下記書籍に詳しい解説があります。


上を目指すプログラマーのためのiPhoneアプリ開発テクニック iOS 7編
加藤 寛人 西方 夏子 藤川 宏之 鈴木 晃 高丘 知央
インプレスジャパン
売り上げランキング: 1,885


iOS6.x以下でのカスタム画面遷移については、拙著に実装方法としくみの解説を書きました。




Core Image を使用したトランジションエフェクト、なんてのもあります。こちらも拙著に詳細あり。




[Bluetooth][電子工作][iOS][デバイス連携]BLE112 / 113 の開発環境を Mac に構築する

$
0
0

iOSデバイス同士とか、既製プロダクトと BLE で通信する場合は Core Bluetooth フレームワークが扱えれば問題ないのですが、新規でウェアラブルデバイスや、iOSと連携する何らかのガジェットとかを開発しようとすると、プロジェクト内の立場上は「iOS エンジニア」だとしても、ある程度 BLE モジュール側のことも知っていないと、ハード屋さんとの意思疎通がなかなか難しい場合があります。(相手がCore Bluetooth等、iOS側に精通していれば話は別ですが。。)


そんなわけで、Bluegiga の BLE113 の「開発キット」 (Developer Kit) を注文してみました。



・・・のですが、その翌日(これを書いてる今日)に仕事で BLE112 の開発キットを借りることができたので、さっそくそっちで開発環境構築〜動作確認までを試してみたので、その手順をまとめておきます。


BLE113 の開発キットはまだ到着してないのですが、112と基本的にやることは同じだと思います。


工場出荷時点の BLE112 Development Kit

BLE112 Development Kit は、購入して電源を入れるだけで、下記のように ディスプレイに温度が表示されます。


f:id:shu223:20140419213520j:image:w400


アドバタイジングも開始されているので、BLExplr や自前 Core Bluetooth 実装等でも確認することもできます。


Windows の仮想環境を用意する

関連ツールの何もかもが Windows 版しか用意されてないので、とにかく Windows 環境が必要になります。


VirtualBox で Windows 環境をつくる

無料 の仮想化ソフト VirtualBox を用いて、Windows の仮想環境を Mac OSX 上に構築します。


基本的に下記ページの手順通りでうまくいったのですが、


一点だけ違ったのは、 初回起動時に Virtual Disk Image を求められる ことでした(ちなみに私が使用したVirtualBoxのバージョンは 4.3.10 です)。


インストールメディア(Windowsのインストールディスク)の Virtual Disk Image は下記のように作成します。

  1. OSのインストールメディアをドライブに入れる
  2. Disk Utility を起動して [New Image] (→ .dmg ファイルが生成される)
  3. 2で作成した .dmg ファイルを `~/Library/VirtualBox` に置いておく。

あとはダイアログで上記 .dmg ファイルを選択すれば、インストールが始まります。


BGScriptの開発環境を用意する

BGScript 専用のIDE、みたいなのはないので、既存の Windows 用テキストエディタ "notepad++" をカスタマイズして使用します。


notepad++をインストール

ググれば本家ダウンロードサイトも出てきますし、Bluegiga の Documentation and Software のページ からもダウンロードできます。


途中でPlugin フォルダを有効にするかどうかのチェックボックスがあるので、有効にしておきます。


シンタックスハイライトやコード補完が効くようにする

notepad++で、BGScript 編集時にシンタックスハイライトやコード補完が効くようにします。


Bluegiga の Documentation and Software のページ から

[PC Tools] > [BGScript Syntax Highlighting for Notepad++]

をダウンロードし、下記手順を踏みます。

  1. Notepad++ を起動
  2. Notepad++のメニューから [Language] > [Defined your language...] を選択
  3. [Import...] をクリックし、 "userDefineLang_BGScript.xml" ファイルを選択
  4. "BGScript.xml" ファイルを '<NPP-Install-Dir>\plugins\APIs' にコピーする
  5. notepad++ を再起動

Bluetooth Smart Software and SDK をインストール

Bluegiga の Documentation and Software のページ から

[Software Releases] > [Bluetooth Smart Software and SDK v.1.2.2] 

を選び、インストールします。


SmartRF Flash Programmer をインストール

BLE112 / 113 は Texas Instruments (TI) のチップを使用しています。このチップのFlashメモリにプログラムを書き込むためのソフトウェア、Flash Programmer をインストールします。


http://www.ti.com/tool/flash-programmer


CC Debugger を Windows 側に認識させる

CC Debbuger は、BLE112 / 113 (で使用している TI のチップ)のデバッグを行ったり、プログラムを書き込んだりするためのデバイスです。


f:id:shu223:20140419214117j:image:w600

(CCデバッガをBLE112開発キットに接続した状態)


CC Debugger を USB で接続し、VirtualBox メニューから

[Devices] > [USB Devices] > [Texas Instruments CC Debugger [xxxx]]  

を選択します。


Windows(仮想マシン)側でデバイスドライバのインストールが開始され、完了すると、デバイスマネージャーで Cebel controlled devices が確認できるようになります。


動作確認

BGScriptのビルド

BGScript をビルドします。

下記のように bgbuild.exe をコマンドプロンプトから実行するだけです。

C:\Bluegiga\ble-1.2.2-100\bin\bgbuild.exe {プロジェクトファイル.bgproj}

BGScriptのプロジェクトは、C:\Bluegiga\ble-1.2.2-100\Example にいろいろとあります。

ビルド成功すると、 .hex ファイルが生成されます。これがチップに流し込むファイルです。


プログラムを書き込む

注意!!!License KeyがないとBLEのアドバタイジングが停止します。


前述した手順で作成した .hex ファイルを、下記ページのように Flash Programmer から書き込むことができます。


が、冒頭に書いた通り、この方法だと、BLEのアドバタイジングが停止します。


このページ に書いてある通り、

If you're using SmartRF to flash your project, that may be causing a problem with your license key. Using SmartRF does erase the license key from the module, which is specified in the third paragraph of this Knowledgebase article: https://bluegiga.zendesk.com/entries/22442106--HOW-TO-Using-the-BLE...

TI's SmartRF software can flash firmware to BLE113, but the license key is proprietary to Bluegiga, and SmartRF does not and cannot include the key while re-flashing firmware. The easiest way to pull your current key is to connect your module to your CC Debugger, open BLEUpdate, and click Info. If you could post the module's serial and license key, someone from Bluegiga could verify it, or provide you with a valid license key.


というわけで、ライセンスキーを入手して、Flash Programmer ではなく Bluegiga BLE SW Update Tool で書き込みを行うのが正しい手順のようです。。


ライセンスキーを入手する

ライセンスキーは Bluegiga BLE SW Update Tool の "Request license key" をクリックして申請フォームに飛ぶことができます。


f:id:shu223:20140419215011j:image:w488


申請したらすぐに送付されるわけではなく、Bluegigaからの返信を待つ必要があります。。(僕はイマココ)


工場出荷時のファームに戻す

Bluegiga の Documentation and Software のページ からダウンロードできる Examples の中に、DKBLE112_factory というプロジェクトが入っています。全く同じものかはわかりませんが。。


ただ、このファームを Flash Programmer で書き込んでも ライセンスキーがないとBLEのアドバタイジングは開始されない ので、とにかくライセンスキーを入手するまではファーム更新しないのが良さそうです。


[Bluetooth][電子工作][iOS][デバイス連携]【改訂版】BLE112 / 113 の開発環境を Mac に構築する

$
0
0

iOSデバイス同士とか、既製プロダクトと BLE で通信する場合は Core Bluetooth フレームワークが扱えれば問題ないのですが、新規でウェアラブルデバイスや、iOSと連携する何らかのガジェットとかを開発しようとすると、プロジェクト内の立場上は「iOS エンジニア」だとしても、ある程度 BLE モジュール側のことも知っていないと、ハード屋さんとの意思疎通がなかなか難しい場合があります。(相手がCore Bluetooth等、iOS側に精通していれば話は別ですが。。)


メジャーな BLE モジュールである Bluegiga の BLE112、BLE113 は、「開発キット」 (Development Kit) というものが販売されています。



これらは、ディスプレイ・USBインターフェース・バッテリーボックス・デバッガ・確認用のセンサ等々、BLEモジュールの開発・検証に必要な諸々がボードにビルトインされており、細々と部品を集めて回路を組んだりしなくても、買ってすぐに BLE モジュールのファームウェア開発を始められるようになっています。


ここでは、このDevelopment Kitを使ってBLEファームウェアを開発するのに必要な環境を Mac 上に構築する手順をまとめておきます。


工場出荷時点の Development Kit

BLE112 / BLE113 Development Kit は、購入して電源を入れるだけで、下記のように ディスプレイに温度が表示されます。


f:id:shu223:20140419213520j:image:w400

(工場出荷状態の BLE112 Development Kit)


アドバタイジングも開始されているので、BLExplr や自前 Core Bluetooth 実装等で確認することもできます。


Windows の仮想環境を用意する

関連ツールの何もかもが Windows 版しか用意されてないので、とにかく Windows 環境が必要になります。


ここでは 無料 の仮想化ソフト VirtualBox を用いて、Windows の仮想環境を Mac OSX 上に構築します。


基本的に下記ページの手順通りでうまくいったのですが、


一点だけ違ったのは、 初回起動時に Virtual Disk Image を求められる ことでした(ちなみに私が使用したVirtualBoxのバージョンは 4.3.10 です)。


インストールメディア(Windowsのインストールディスク)の Virtual Disk Image は下記のように作成します。

  1. OSのインストールメディアをドライブに入れる
  2. Disk Utility を起動して [New Image] (→ .dmg ファイルが生成される)
  3. 2で作成した .dmg ファイルを `~/Library/VirtualBox` に置いておく。

あとはダイアログで上記 .dmg ファイルを選択すれば、インストールが始まります。


BGScriptの開発環境を用意する

BGScript 専用のIDE、みたいなのはないので、既存の Windows 用テキストエディタ "notepad++" をカスタマイズして使用します。


notepad++をインストール

ググれば本家ダウンロードサイトも出てきますし、Bluegiga の Documentation and Software のページ からもダウンロードできます。


途中でPlugin フォルダを有効にするかどうかのチェックボックスがあるので、有効にしておきます。


シンタックスハイライトやコード補完が効くようにする

notepad++で、BGScript 編集時にシンタックスハイライトやコード補完が効くようにします。


Bluegiga の Documentation and Software のページ から

[PC Tools] > [BGScript Syntax Highlighting for Notepad++]

をダウンロードし、下記手順を踏みます。

  1. Notepad++ を起動
  2. Notepad++のメニューから [Language] > [Defined your language...] を選択
  3. [Import...] をクリックし、 "userDefineLang_BGScript.xml" ファイルを選択
  4. "BGScript.xml" ファイルを '<NPP-Install-Dir>\plugins\APIs' にコピーする
  5. notepad++ を再起動

Bluetooth Smart Software and SDK をインストール

Bluegiga の Documentation and Software のページ から

[Software Releases] > [Bluetooth Smart Software and SDK v.1.2.2] 

を選び、インストールします。


USBドングルを認識させる

Development Kit に付属している BLE112 USB ドングルを Mac に接続します。


VirtualBoxのWindows環境をシャットダウンさせた状態で、 [Settings] > [Ports] の USB タブを選択し、USB Device Filters に Bluegiga Low Energy Dongle を追加します。


※これをやらないと、仮想環境側にドングルを認識させようとしたときに "USB device in use by someone else" とエラーが出ます(参考記事:linux - Virtualbox: "USB device in use by someone else" error, how to make (mac) host let go? - Stack Overflow


いったんUSBドングルを抜いて、仮想環境を起動し、USBドングルを挿し直すと、ドライバのインストールが開始されます。


デバイスドライバのインストールに成功したら、ドングルは抜いてもOK。


CC Debugger を Windows 側に認識させる

BLE112 / 113 (で使用している TI のチップ)のデバッグを行ったり、プログラムを書き込んだりするためのデバイス、CC Debugger は、Development Kit にビルトイン されています。


ボードの DEBUGGER とある USB コネクタにケーブルをつないで Mac と接続し、VirtualBox メニューから

[Devices] > [USB Devices] > [Texas Instruments CC Debugger [xxxx]]  

を選択します。


Windows(仮想マシン)側でデバイスドライバのインストールが開始され、完了すると、デバイスマネージャーで Cebel controlled devices が確認できるようになります。


動作確認

ライセンスキーを控えておく

僕のように、手順を無視して TI の Flash Programmer から書き込んだりすると、License Keyが消えBluegigaにRequestを送って返信を待つ という面倒なことになるので、念のため License Key を控えておきます。


Bluegiga BLE SW Update Tool の "Info" をクリックすると、License Key が表示されます。


f:id:shu223:20140422065155j:image:w482


ビルド&プログラム書き込み

C:\Bluegiga\ble-1.2.2-100\example フォルダか、Bluegiga の Documentation and Software のページ からダウンロードできる Examples から、適当なプロジェクトを選び、BGScriptのプロジェクトファイル(拡張子 .bgproj)を Bluegiga BLE SW Update Tool で開きます。


諸々問題なければ Update ボタンをクリックすればビルド&プログラム書き込みが行われます。


[制作実績][iOS][雑記]独立して最初の3ヵ月間にやったお仕事のまとめ

$
0
0

フリーランスのiOSエンジニアになって早3ヵ月経ちました。個人になると自らアピールしていかないと世の中的には何もしてないことになってしまうので、この3ヶ月間(2月〜4月)にやったお仕事について書いておこうと思います。


(※まだ4月の途中なので、追記する可能性大です)


実店舗へのiBeacon導入

火鍋専門店『小肥羊』をチェーン展開している ウェブクルー 社よりお話をいただき、実店舗へ iBeacon を導入するサービス検討/検証 のお手伝いをさせていただきました。



iBeacon+実店舗の初仕事がリリースされました(&独立のご報告) - Over&Out その後



具体的には、本番アプリ開発の前段階として、下記のような機能を持つ実証実験用アプリ(非公開)を開発し、

  • 店に近づくと通知が来て地図が出て道案内してくれる
  • 入店するとメニュー等のUIが有効になる
  • 入店後しばらくするとおすすめメニューを通知
  • 退店するとありがとうございました通知&クーポン付与

このプロジェクトの関係者一同のiPhoneに入れ、お店に iBeacon モジュールを配置し、

→ みんなで実際に店に行ってサービスを体験(火鍋を食べてビールも飲む)

→ 実運用するアプリ/サービスの仕様策定・設計を行うための知見を得る

というお仕事でした。


関連記事:


PV撮影アプリ

Perfumeの演出サポート等々で有名な、Rhizomatiks(ライゾマティクス)とのお仕事。


f:id:shu223:20140422080501j:image:w242


詳細は書けないのですが、さすがライゾマさん、という技術アイデアで勉強になりました。


あと、一緒にライゾマオフィスで作業してたのですが、朝の4時に完成、そのまま始発で現場へ、という感じも ワークスタイルとしてすごく好み なのでぜひ今後ともお仕事をご一緒したいと思いました。


新しいウェアラブルデバイスの開発

僕が新卒で入った会社がNTTデータで、そこの研究開発部門で4年間、音声認識まわりの研究開発職についてたのですが、そのときの知見を活かせて、かつ 最近の一番の興味分野 である「iOSアプリ x 外部デバイス using BLE」という、完全なる俺得案件でした。


さらには、技術的な着眼点もおもしろく、そのプロダクトによって解決される問題も素敵で、座組も最高、という。


ただ諸事情あって、要素技術のフィージビリティがとれ、これからハードと合わせたプロトタイプ開発、というところで止まっています。どうにか再開して形にしたいところ。


とあるユーティリティ系アプリ

2月中盤 〜 4月序盤まで、ほぼこの案件にかかりっきりでした(他の案件は、土日とか、深夜とか)。事情により実績として公開はできないのですが、iOSエンジニアとしてものすごく学びの多い案件でした。


なによりも一番大きいのが、ひさびさにがっつりUIをカスタマイズする(UIKitの標準コンポーネントをあまり使えない)アプリだったこと。


ここ4年ほどほぼ専業でひたすらやってきたので、iOSアプリなら結構何でもうまくつくる自信はあったのですが、よく考えてみると2012年はほぼゲームアプリ(主に cocos2d 製)ばかりつくっていたし、2013年はほぼ書籍執筆とAppSociallySDK開発だけだったので、UIをがっつりつくりこむような「いかにもiOSアプリ」を「本格的に」つくる仕事は数年ぶりだなぁと。


UIまわりの実装力というか具現化力は、iOSアプリエンジニアとして期待されることが多いところなので、独立してすぐのこのタイミングでキャッチアップできて良かったです。


あと、この案件では iOS 7 の新機能を積極的に使用できたのも良かった。


具体的に、使用した/試した iOS 7 の API とその用途としては、

  • カスタム画面遷移/インタラクティブ画面遷移
    • 「縦に引っ張って移動」など。
  • UIImage の renderType
    • 素材は一つだけ用意して、これで各色使い回し。
self.imageView.image = [image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
  • スクリーンキャプチャ
    • 投稿、画面遷移アニメーション等。
[view drawViewHierarchyInRect:rect afterScreenUpdates:YES];
  • UICollectionView + UIDynamics
    • スクロール時に、引っ張る指の位置に応じて各セルがほんの少し抵抗を受けるようなインタラクションに使用(Message App の UICollectionView版)。
  • UICollectionViewController の layout-to-layout アニメーション
    • 試してはみたものの、色々合ってボツに。

などなど。


AnimatedTransitionGallery

これは仕事ではなく OSS ですが、上記ユーティリティアプリ案件でカスタム画面遷移を初めて使ったのがきっかけで、その「まとめアプリ」である『AnimatedTransitionGallery』をつくって公開しました。



【iOS7】53種類のカスタム画面遷移を試せるサンプルコードを公開しました - Over&Out その後


僕自身が実際にアプリ開発をする中で「こんなのあったらいいのに」と思いつくったものなので、日本だけでなく海外からも評判が良く、おかげさまで GitHub の Trending repositories で 1位 (today, this week両方)にもなりました。


WHILL

昨年、AppSocially メンバーとして 500 startups の batch 6 に参加 した際に同期だった WHILL。


次世代車椅子を開発しているスタートアップで、Mountain Viewに行って初めてその存在を知ったときは、「マジで??これ自分たちでつくってるの!?スゲーーーーー!!!!」と驚き、リスペクトしまくりなプロダクト&チームでした。


そんな WHILL と BLE で連携する iOS アプリ を開発するお仕事。


(初WHILL @町田にあるWHILL工房)


といってもBLE基盤がまだできてないので、本格始動は5月から。


3月、4月はまだ2日ほどご一緒しただけで、

  • 投資家向けデモ用アプリ1本
    • バックエンドをParseで構築
  • WHILLと連携するアプリのプロトタイプ2本
    • BLE接続なしの、UI/UXイメージを共有するためのプロトタイプアプリ

といった実装を行いました。


ちなみに先日書いた『BLE112開発キットの開発環境をMac上に構築する』という記事は、WHILL側の基盤完成に先立ち iOS 側のプロトタイピング を開始するためにやった作業のメモです。



AppSociallyサポート

昨年お世話になった シリコンバレーのスタートアップ、AppSocially。自分はその iOS SDK を開発したので、何か問い合わせ等があった場合に技術的な部分で回答する等のサポートを引き続き行っています。


gihyo.jp連載原稿執筆

連載『iOSアプリと連携させて使えるデバイスたち』の原稿執筆。



年初の目標 で書籍化を目指し数値目標を立てたものの、結局提出できたのは1回分のみ(現在 gihyo さんで html 作成中)。


途中まで書いて頓挫しているのがプラス2回分ほどあります。。


IRKitを使った何か

「こういうことは可能か」というアイデアの打診があり、フィージビリティ調査を行いました。


IRKit
IRKit
posted with amazlet at 14.01.14
maaash.jp

実際に現場に行く必要があったので、こういうもの をつくったり。


で、結果的には、対象機器の仕様として、そのアイデアそのままでの実現は無理ということがわかり、別の方法を探りましょう、という結論になりました。


関連記事:


所感

どうにかこうにか、食いっぱぐれることなく、しかも楽しいお仕事ばかりいただいて最初の3ヶ月を過ごすことができました。


「5年後、10年後を見据えましょう」と、ものの本にはよく書いてありますが、独立した当初は「この仕事が終わったあと、自分は何をやってるのだろうか。。」と、5年後・10年後どころか、半年先も見えてない状況に、不安を覚えたことがないわけでもなかったです。


が、とりあえずこの3ヶ月間だけでいうと、上述したように僕にとって楽しくて勉強になるお仕事ばかりでしたし、ありがたいことに、もうしばらく先も楽しすぎるお話をいろいろといただいています。


ビギナーズラックかもしれませんし、先のことはわかりませんが、この三ヵ月で思ったのは、

  • 目の前のおもしろい仕事にがっちり食いつく
  • がんばっていい仕事をする
  • 得られたスキルや実績をブログ等でアピールする
  • よりおもしろい仕事のお話をいただく

というサイクルをしっかり回していく「わらしべ長者方式」がやっぱり自分にあったやり方であり、生命線だなと。


そんなわけで引き続きがんばってまいります!


[雑記][ライフハック]おもしろく働くための「わらしべ長者方式」

$
0
0

昨日書いた記事 『独立して最初の3ヵ月間にやったお仕事のまとめ』 で、


  • 目の前のおもしろい仕事にがっちり食いつく
  • がんばっていい仕事をする
  • 得られたスキルや実績をブログ等でアピールする
  • よりおもしろい仕事のお話をいただく

というサイクルをしっかり回していく「わらしべ長者方式」こそが、(企業からすると吹けば飛ぶようなフリーランスという立場である)自分がこうしておもしろい仕事に恵まれている理由であり、生命線である、ということを最後の方にちょろっと書きました。


で、書いたあと思ったのですが、上記サイクルは当たり前のことすぎて、本当の「わらしべ長者方式」のポイントはそこじゃなかったなと。


自分で再認識するためにも、これこそが「わらしべ長者方式」でおもしろい仕事のサイクルを回して行く重要ポイントだ!と思う点を書いておきます。


間違った交換をしないこと

これです、これに尽きます。


どういうことかというと、実際のわらしべ長者というお話では、


藁しべ→アブが結び付けられた藁しべ→蜜柑→反物→馬→屋敷


と交換が進んでいきますが、たとえば 「反物 → 馬」と交換できるところを、「反物 → 魚」みたいな交換をしてはいけない、ということです。


そもそも藁しべから来てるので、魚でもいずれリカバリは可能かもしれませんが、 この流れの速い業界において、交換価値の後退 は命取りになります。腐ってしまいます。


また「魚 → 網 → 船」みたいに、それはそれで価値が上がるかもしれないけど、 自分が欲しかったものとは違う ものにたどり着いてしまうというリスクもあります。


やはり、

  • 「より価値の高いもの」
  • 「自分が欲しいものにつながりそうなもの」

と交換するのが得策ではないかなと。


仕事の話に戻すと

で、上記はたとえでしかないわけですが、現実の仕事の話でいうと、たとえば、現状の僕にとってのゲームの案件。


しっかりフィーは出るし、僕はゲームをプレイするのもつくるのも好きなのですが、

  • もう十分に ゲームアプリ実装の実績はつくった し、ちょっと今はゲームつくるのはお腹いっぱいになっている
  • ゲームは実装要件を満たしたあとでもおもしろくするまでの試行錯誤が結構あって、工数が結構かかる
  • いまの興味は iOS + 外部デバイス連携で、この分野における自分の実績や知見はゲームと比べるとまだ足りない

となると、ゲーム案件に1ヵ月、2ヵ月携わるのは僕にとっては「間違った交換」だなと。


逆に、「報酬ゼロでもおいしい」と思う案件もあったりします。


そういう感じで、仕事をするときには、 わらしべ長者的にこれは正しい交換か ということを考えるようにしています。


おわりに

個人エンジニアごときがえらそうなことを言ってすみません!いつもお仕事ありがとうございます!



関連記事


[iOS][ガジェット][デバイス連携][iBeacon][Bluetooth]iOSエンジニア in ハードウェア・プロジェクト

$
0
0

本日開催された「yidev 恵比寿勉強会」にて、 ハードまわり(メカや電子回路)の知識やスキルを持たない iOS エンジニアが、ハードウェア関連プロジェクトにどのような立ち位置で関わるのか、という内容の発表をしました。



一般論ではなく、あくまで僕が入ったプロジェクトはこうでした、という個人的経験談でしかないのですが、ガジェット開発に興味はあるけど電子回路とかわからない、という僕と同じような方々の参考になれば幸いです。



・・・というテーマのつもりだったのですが二日酔いの状態で資料をつくり、発表したので、何が言いたいのかよくわからない散漫な感じになってしまいました。。


結論としては、最後の「まとめ」スライド *1 に書いたように、


ハードの知識がない iOS エンジニアでも、ハード関連プロジェクトに楽しく関われます!

  • Core Bluetooth / BLE まわりの知識は大事
  • BLEモジュールのファームまわりもできると捗る

という感じです。



以下に参考記事/関連記事をズラズラと載せておきます。


iBeacon 関連記事


BLE, CoreBluetooth 関連記事


konashi 関連記事


*1:発表時にはこれがなく、アップする際に追加しました

[参考書籍][iOS][Xcode][Objective-C]Xcodeの「全機能」を網羅した全752ページの超大作『Xcode 5 徹底解説』書評

$
0
0

先日 yidev 恵比寿勉強会 に行った際、隣の席にいらっしゃった @es_kumagai さんより、すごいプレゼントをいただきました。



この本を手に取ってまず驚くのが、その 752ページ(!!!!) という超特大ボリュームです。世の中に「徹底解説」を謳う解説本は数あれど、 本当に「全機能」を網羅している本 は初めてみたかもしれません。


f:id:shu223:20140430102540j:image

(iPhone5sとの比較。分厚さが伝わりますでしょうか)


対象読者:入門者から上級者まで!

目次を見てみると、「Xcode とは」「Xcode をインストールする」から始まるので、Xcodeを未ダウンロードな入門者 から読めますし、「xcodebuild コマンドを使ってビルドする」「ユニットテストを実現する XCTest」「Xcode サーバーと Bot でテストを自動化する」といった 中級者向け の内容もがっつり解説されています。


また、Xcode を使いこなしている上級者といえど、なかなかこの 752 ページの内容を全て把握してる人はいないんじゃないかなと。そういう意味では、それこそ入門者から上級者まで、iOSアプリ開発に携わる人全員に何かしらのお役立ち情報があるのでは、と思います。


Xcode5徹底解説 for iOS/OSX
熊谷 友宏
秀和システム
売り上げランキング: 31,269

全ページを通して読んでみた感想としては、全項目の冒頭に「◯◯とは」「この機能はどんなときに役立つのか」という説明があるので、 目次だけではなく、各項の冒頭だけでも一通り目を通す という読み方をするといいんじゃないかなと思いました。


勉強になった項目

以下には、自分が全項目に目を通してみて勉強になった項目を書いていきます。


※重要な機能でも、自分が知ってたものについては書いてないので、書籍の魅力を要約するものではありません。


7.2.3 スコープ内の変数名をまとめて編集する

コード内の変数名にカーソルを合わせて、▼ マークをクリックして出てくるメニューから [Edit All in Scope] を選択すると、同じスコープ内のその変数が全て選択された状態になり、同時編集できる、というもの。


Refactor メニューでも同様のことができるけど、知りませんでした。


7.2.8 カーソル位置のスコープを自動でハイライトする

これは地味ながらも個人的に「おお!」と思った機能。


[Editor] > [Code Folding] > [Focus Follows Selection] を選択すると、カーソルがあるスコープだけがハイライトされる というもの。


規模の大きいコードを書いていると、意識があっちこっちにいってしまいがちなので、これは助かるかも。


8.6.4 レイアウトをプレビュー画面で確認する

アシスタントエディタのプレビュー機能で、iOS6 / iOS7, 3.5 inch / 4.0 inch でのストーリーボードの見え方をビルドなしで確認することができます。


8.7.4 アウトレットコレクション

@property (strong, nonatomic) IBOutletCollection(UIButton) NSArray *buttons;

みたいにやると、複数のコントロールをアウトレットとして連結できる。


8.8.3 コントロールの表示テキストを言語環境に応じて変化させる

Object IDを使ったローカライズ方法。


9.4.5 Build Phases 設定

Run Script フェイズの

  • Run script only when Installing オプションにチェックを入れると Build Settings の Deployment Postprocessing がONのときだけスクリプトが実行される
  • Input Files / Output Files オプションがそれぞれどの環境変数に渡されるか

9.4.6 Build Rules 設定

ここいじったことないなぁ。。


10.4 スキームの設定項目

"Parallelized Build", "Find Implicit Dependencies" といった Build Option の効果や、Arguments タブ、Options タブの各設定項目について説明があります。


f:id:shu223:20140430105529j:image

(↑このへんの話です)


10.5 スキームにカスタム実行スクリプトを登録する

各アクションを実行する前後で、任意のスクリプトを実行できる(Pre-actions / Post-actions)とのこと。たとえば アクションの前後にメールを送信 したり。(奥が深い。。)


13.3.4 OpenGL ES フレームキャプチャによる一時停止

アプリの実行を一時停止して、OpenGL ES の描画状況を確認することができる機能。


13.4 ブレークポイントの設置と扱い方

すごく昔の記事 にちょろっと書いたことがありますが、Xcode のブレークポイントって奥が深いんですよね。。本項では、[Edit Breakpoint] から設定できる項目ひとつひとつについて解説されています。


13.4.6 ブレークポイントに停止条件を設定する

「3回このブレークポイントを通過したら停止させる」みたいなことができます。


13.4.7 ブレークポイントでログメッセージを出力する

ブレークポイント通過時に、コンソールにログメッセージを出力できます。このメソッドを通ったかどうかみたいな確認のときには、ソースにNSLogとかを直接書くよりも、こっちの方法を使った方がソースを汚さずに済むので良さそうです。


13.4.8 ブレークポイントで変数に値を設定する

ソースをいじることなく、一時的に変数の値を差し替えられます。UIImage とかでも差し替え可能。


13.4.9 特殊なブレークポイント

ソースコード内に置く通常のブレークポイントだけではなく、

  • 例外が発生したときに処理を行うブレークポイント
  • 指定したシンボルが実行されるタイミングで処理を行うブレークポイント
  • OpenGL ESエラーブレークポイント
  • テスト失敗時ブレークポイント

といったものも作成できます。


シンボルブレークポイントはソースコードが公開されていない外部ライブラリ内のメソッド実行時に止めたいときとかにも使えるので、便利そうです。


13.4.10 ブレークポイントを他の制作者と共有する

[Share Breakpoint] でワークスペース内の "Shared Data" に保存されるようになるとのこと。


13.5 ブレークポイントで停止した状況を把握する

以前書いた Quick Look や [Print Description] についても触れられています。


13.5.2 の、スタックトレースの表示の精度を調整できるスライダー、知らなかった。。


13.6 ステップ実行で原因箇所を特定する

Step Over / Step Into / Step Out の違いの解説から、それぞれを使いこなしてどのようにデバッグしていくか、という具体的な方法が解説されています。


13.6.4 の、デバッグエリアの変数ビューの右クリックメニューから [Edit Value] で変数の値を書き換えられるのは知りませんでした。ステップ実行していて見つけたクサイ部分を詳しく検証する際に使えそうです。


13.6.8 の後半にある、「ステップ実行時に、自分のスレッドだけ動かして、他スレッドは中断させる」方法も初めて知りました。なんと control + shift で GUI からもこの操作を行えるとのこと。。


Chapter15 ユニットテストを作成してソースコードを検証する

XCTestフレームワークを用いてユニットテストを実行する方法が解説されています。最近は iOS アプリのテストに特化した技術書 も出ていますが、後述の Chapter 16 と合わせると約50ページと、テスト部分だけ見ても相当なボリュームがあります。


標準フレームワーク/環境を使用した基本的なテスト手法だけでも知りたい、という場合にも本書は買いだと思います。


Chapter16 XcodeサーバーとBotでテストを自動化する

OS X Server をインストールして Xcodeサーバーを稼働させる方法から、それと連携して

  • テスト
  • ソースの静的解析 (static analyzerの実行)
  • ビルド (archive)

を自動実行する Bot を作成して運用する方法 がステップバイステップで詳しく書かれています。


まとめ

というわけで、Xcode 5 を本当に徹底解説した書籍『Xcode 5 徹底解説』オススメです!


Xcode5徹底解説 for iOS/OSX
熊谷 友宏
秀和システム
売り上げランキング: 31,269

関連記事

iOS7の新機能を軸とした解説本。こちらも書評を詳しく書いたのでぜひご覧ください。


拙著の紹介。こちらは中級者向けのレシピが100個載っています。ライブラリを使うレシピでもそのソースコードにも触れており、ある程度アプリ開発に慣れてきた方々には何かと参考になる項目があると思うので、ぜひ目次だけでも目を通していただけると嬉しいです。


[iOS][Objective-C][ライブラリ][アニメーション]Facebook Paper のアニメーションエンジン「pop」のソースコードを読んでみる

$
0
0

先日公開されたFacebookのpop、アニメーションライブラリですよとリリース前から言われてたものの、popについて語られるときは大抵「Paperアプリのテクノロジーをオープンソース化」という枕詞がつくので、Paper風UIコンポーネント(ジェスチャーでヌルヌル操作できる)もライブラリに含まれてたらいいなとか、せめてサンプルが Paper 風だといいなとかうっすら期待してたのですが、まったくそんなことなく、やっぱり純粋なるアニメーションライブラリでした。サンプルプロジェクトすらつかない硬派っぷり。。


じゃあ今まで実現が難しかったような何か(ド派手なアニメーションとか?)ができるようになってるのか、というとそういうわけでもなくて、


In addition to basic static animations, it supports spring and decay dynamic animations, making it useful for building realistic, physics-based interactions.


ベーシックなアニメーション以外には、 spring (バネ風にボヨヨーンとなる)と、 decay (スーッと速度が減衰する) アニメーションをサポートしている、ってことで、正直地味です。


バネっぽいアニメーションに関しては iOS 7 で標準サポートされた し、イージングについてはCore Animation で自由に数式や関数の曲線を指定できるので、このあたりはどうとでもできるし、そのあたりを いい感じにラップしてくれてる OSS もいくつかあります。


そんなわけで pop の神髄はそこ自体ではないはず、この記事 にあるような、パフォーマンスへの配慮 とかカスタマイズ性 にあるはず、で、それって具体的にどういう実装になってるんだろう、とソースを見てみることにしました。


popクラス群の依存関係

`POPVector` とか `TransformationMatrix` とかどうアニメーションに活かされてるのかパッとわからなかったので、 objc_dep でクラスの依存関係を出力 してみました。


f:id:shu223:20140502192405p:image:w600


・・・相当入り組んでますが、局所的にみればこのクラスはこれとあれに参照されてるのか、とかいろいろわかります。


(つづく・・・)


[音声処理][iOS][Mac][Objective-C]Audio Unit 再入門

$
0
0

Core Audio においてもっとも低レベルに位置する Audio Unit。リアルタイムで高度なオーディオ波形処理を行いたい場合や複雑なルーティングによるオーディオ処理を実現したい場合、これを使用する必要が出てきます。


が、このフレームワーク、個人的には使用頻度があまり高くない *1 ので、ひさびさに触ってみた際にとっつきにくさを感じました。ただ慣れてしまえば 全体的なコンセプトはシンプル で、単に関数の引数がやたら多かったり、構造体の要素がやたら多かったり、慣れてないC言語APIだったりするだけだなと。


そんなわけで、次に久しぶりに Audio Unit をいじるときに、「シンプルな全体感」と、「複雑に感じてしまう部分」を切り分けて見ることができるよう、メモっておきます。


基本的な考え方

Audio Unit の基本コンセプトは、「いろいろなユニットを複数接続し、オーディオ処理を実現する」というもの。


で、そのひとつひとつのユニットがノード(AUNode)、それらが繋がっている全体がグラフ(AUGraph)。この考え方や呼称は直観的にもわかりやすいです。


そして実際の実装手順としても、下記のように非常にわかりやすいです。この流れさえ把握しておけば、後述する「一見複雑そう」な諸々が出てきても全体感は見失わずにすむかと。


1. グラフ(AUGraph)作成

NewAUGraph(&graph);
AUGraphOpen(graph);

2. ノードをグラフに追加する

AUGraphAddNode(graph,
               &ioUnitDescription,
               &ioNode);

3. ノードを接続する

AUGraphConnectNodeInput(graph, ioNode, 1, ioNode, 0);

4. グラフを初期化して処理開始

AUGraphInitialize(graph);
AUGraphStart(graph);


で、これに、下記要素が絡んできます。

  • AudioComponentDescription
  • Audio Unit のプロパティ設定
  • AudioStreamBasicDescription (ASBD)
  • コールバック
  • Audio Converter Sevices や Extended Audio File Services 等の関連サービス

このあたりが絡んでくることによって、コードも長く複雑になり、オーディオフォーマットC言語の知識も必要になってきて、そのあたりの知識の乏しい自分が久々に Audio Unit に触るとうわー難しいってなるのかなと。そんなわけで、整理のため以下にひとつひとつ紐解いておきます。


AudioComponentDescription

前述した基本手順の「ノードをグラフに追加する」手順において、 「どのユニットをノードとして追加するか」 を指定するものが AudioComponentDescription という構造体。


たとえば Remote IO ユニットの場合は下記のようになります。

AudioComponentDescription cd;
cd.componentType            = kAudioUnitType_Output;
cd.componentSubType         = kAudioUnitSubType_RemoteIO;
cd.componentManufacturer    = kAudioUnitManufacturer_Apple;
cd.componentFlags           = 0;
cd.componentFlagsMask       = 0;

AUGraphAddNode(graph, &cd, &ioNode);

こうやって書いてしまうと全然難しいものではないのですが、構造体の要素の数が多く、各定義名も長いので、パッと見のコードの複雑さを助長している気がします。


そんなわけで TTMAudioUnitHelper という Audio Unit のヘルパーライブラリでは、下記のように サブタイプだけ指定すれば AudioComponentDescription を取得できる ラッパーメソッドを用意してあります *2

+ (AudioComponentDescription)audioComponentDescriptionForSubType:(OSType)subType;

Audio Unit のプロパティ設定

グラフに追加した各ノード(のユニット)にプロパティをセットするには、まずノードから AudioUnit 構造体を取得します。

AudioUnit ioUnit;
AUGraphNodeInfo(graph, ioNode, &cd, &ioUnit);

で、取得した AudioUnit 構造体を引数に渡しつつ、プロパティをセットします。

AudioUnitSetProperty(ioUnit,
                     kAudioOutputUnitProperty_EnableIO,
                     kAudioUnitScope_Input,
                     1,
                     &flag,
                     sizeof(flag));

引数が多いですが、関数の定義を見ればわかるかと。

AudioUnitSetProperty(AudioUnit              inUnit,
                    AudioUnitPropertyID     inID,
                    AudioUnitScope          inScope,
                    AudioUnitElement        inElement,
                    const void *            inData,
                    UInt32                  inDataSize)

プロパティのgetも同様です。

AudioUnitGetProperty(AudioUnit              inUnit,
                    AudioUnitPropertyID     inID,
                    AudioUnitScope          inScope,
                    AudioUnitElement        inElement,
                    void *                  outData,
                    UInt32 *                ioDataSize);

プロパティを set / get する実装は、引数が多いので何となく難しい感じに見えてしまうところがありますが、上記の通りやってることはシンプルです。


AudioStreamBasicDescription (ASBD)

オーディオデータフォーマットを表現するための構造体。

struct AudioStreamBasicDescription
{
    Float64 mSampleRate;
    UInt32  mFormatID;
    UInt32  mFormatFlags;
    UInt32  mBytesPerPacket;
    UInt32  mFramesPerPacket;
    UInt32  mBytesPerFrame;
    UInt32  mChannelsPerFrame;
    UInt32  mBitsPerChannel;
    UInt32  mReserved;
};
typedef struct AudioStreamBasicDescription  AudioStreamBasicDescription;

ユニットごとにサポートしているオーディオデータフォーマットが違うため、ノード間で滞りなくオーディオデータを流すためにこれをプロパティからセットしてやる必要があります。


この ASBD、以下の点を個人的に整理できてないので、また別途記事を書こうと思っています。

  • どのノード間において明示的に get / set する必要があるのか
  • どのノード間において AUConverter ユニットや後述する Audio Converter Sevices で ASBD を変換する必要があるのか
  • ASBD が合ってなければ AUGraphInitialize 実行時にエラーを返してくれる?

コールバック

再生するにしても録音するにしてもこのコールバックの実装は不可欠だし、リアルタイム波形処理もここで行うことになるので、Audio Unit のキモになる部分といえます。が、下記理由により個人的にはややこしく感じてしまいます。

  • いろいろなコールバックの登録方法がある
  • いろいろなコールバックの種類がある
    • 後述する Audio Converter Sevices もコールバック内で処理を行う
  • 引数それぞれの役割を把握してないとAudioUnitのキモである波形処理を書けない
  • C言語的な知識がしっかりと要求される

ここでは、コールバックの何がややこしいのか、という把握だけにとどめておいて、コールバックの詳しい話は別記事で行いたいと思います。


Audio Converter Sevices や Extended Audio File Services 等の関連サービス

サウンドファイルの再生は、AVAudioPlayer を使用すれば恐ろしく簡単にできるのですが、Audio Unit を使う場合、オーディオデータを RemoteIO で再生できるフォーマットに変換するために、Audio Converter Sevices や Extended Audio File Services を利用する必要があります。


高レベルAPIに慣れてしまった僕のようなゆとりiOSエンジニアからすると「たかがファイル再生」と油断しているところに、Audio Converter Sevices では変換用コールバックが再生用とは別途必要だったり、マジッククッキーなるよくわからない概念が登場したりするので、「Audio Unitこわい」という印象を持ってしまう要因のひとつになってしまっている気がします。


また Audio Converter Sevices を使うにしろ Extended Audio File Services を使うにしろ、この手の実装はファイルから読み込んだオーディオデータを保持しておくために独自の構造体を定義して取り扱うことが多く、他人のサンプルコードを参考にしようとしても、「パッと把握しづらい」というつらさもあります。


このあたり、AUConverter ユニットや AUAudioFilePlayer ユニットを使用すればもっとシンプルにできるのかなと期待しつつ、また別途記事を書こうと思います。


参考記事

Audio Unit を含む、iOSのオーディオ処理に役立つ参考書籍を下記記事にまとめています。


Audio Unit のユニット種別は AudioComponentDescription 構造体の componentSubType によって規定されますが、その一覧を下記記事にまとめています。


参考になるサンプルコードのまとめ。使用されているユニットも付記してあるので手前味噌ながら便利です。

*1:自分の場合は1年3ヵ月ぶり2回目

*2:まだ全てのサブタイプをサポートしていませんし、オプションは考慮できていません。pull request大歓迎です。

[Bluetooth][iOS][Objective-C]Core Bluetooth のラッパーライブラリ『LGBluetooth』の使い方

$
0
0

Core Bluetooth はそれほど規模の大きいフレームワークではないので、最初は全容を把握するためにライブラリに頼らずそのまま使ってみるのがおすすめなのですが、ペリフェラルのスキャンやコネクト時のタイムアウト処理等、結局毎回書く必要があって面倒だなーと思う部分もあります。


そのあたりいい感じに書かれているOSSがないかなとGitHub検索してみたところ、次の2つが良さそうでした。


どちらも block-based を売りにしています。


ヘッダだけ見ると YmsCoreBluetooth の方がペリフェラルの保存まで考慮されていて高機能そうな気もしたのですが、どっちも試すのは面倒なので、

  • 更新日が新しい
  • スター数が多い
  • タイムアウト処理が実装されている

という理由からまず LGBluetooth の方だけ試してみました。


ペリフェラルをスキャンする

LGCentralManager の `scanForPeripheralsByInterval:services:options:completion:` メソッドでスキャンを開始します。第1引数に スキャンする時間 [秒] を NSUInteger で指定できるようになっています。

[[LGCentralManager sharedInstance] scanForPeripheralsByInterval:5
                                                       services:services
                                                        options:options
                                                     completion:^(NSArray *peripherals) {
                                                         
                                                         // スキャン完了後の処理
                                                     }];

が、この処理、ソースコードを読んでみると、タイムアウトというよりは、指定時間が経過したら completion ブロックを実行するという実装になっていました。つまり、たとえば scanInterval に10秒を指定したらその間にいくつペリフェラルが見つかっても完了ブロックは実行されません。


これじゃあ使い物にならない、ということで、次のプロパティを追加して Pull Request を送りました。

@property (assign, nonatomic) NSUInteger peripheralsCountToStop;

たとえば下記のように1をセットしておくと、scanInterval 経過前でも、ペリフェラルが1つ見つかった時点で stopScan してスキャン完了ブロックが呼ばれます。

[[LGCentralManager sharedInstance] setPeripheralsCountToStop:1];

既に Merge されています


ペリフェラルに接続する

[peripheral connectWithCompletion:^(NSError *error) {

// 完了処理
}];

サービスを探索する

[peripheral discoverServicesWithCompletion:^(NSArray *services, NSError *error) {
    
    // 完了処理
}];

キャラクタリスティックを探索する

[service discoverCharacteristicsWithCompletion:^(NSArray *characteristics, NSError *error) {

    // 完了処理    
}];

データをwriteする

[self.characteristic writeValue:data
                     completion:^(NSError *error) {
                         
                         // write完了後の処理
                     }];

接続が切れたときに処理を行う

CBCentralManagerDelegate は内包されてるので、たとえば切断時の処理とかはどうするかというと、 `centralManager:didDisconnectPeripheral:error:` のタイミングで `kLGPeripheralDidDisconnect` という名前の通知が発行されるので、それを監視しておきます。

[[NSNotificationCenter defaultCenter] addObserver:self
                                         selector:@selector(peripheralDidDisconnect:)
                                             name:kLGPeripheralDidDisconnect
                                           object:nil];
- (void)peripheralDidDisconnect:(NSNotification *)notification {
    
    // 切断時の処理
}

所感

以上のように API はわかりやすいし、ソースも読みやすいし、プルリクにもすぐに対応してくれるので、結構いい感じです。



[電子工作][Arduino]Eagleを使った回路設計/基板作成のワークショップに参加してきました

$
0
0

FabLab鎌倉にて開催された『Rapid Prototyping Lesson03 : Circuit Design』という回路設計/基板切削のワークショップに参加してきました。


Eagle という CAD ソフトを使って回路図データをつくり、「MODELA」という切削加工マシンで基板を作成、はんだ付けしてプログラムを書き込むところまでを体験できるワークショップです。


きっかけ

最近 WHILLMoff といったハードウェアスタートアップをお手伝いしてるのですが、iOSエンジニアとしての立ち位置 ではあるので、なかなか回路設計まで自分でやる機会はありません。


とはいえ「回路設計ってどんなもんなのか」というのを一度体験してみたいとは思っていたので、こんなレアなワークショップはなかなかないかも、と参加した次第です。



以下、ワークショップでやった内容です。(+Eagleの使い方のメモなど)


Eagleを使って回路設計

パーツを置いていって(add, copy)、名前をつけて (label, name)、結線して (net) こういう回路図をつくりました。


f:id:shu223:20140517171953j:image:w600


回路部品のライブラリや、回路図はあらかじめ用意されたもの。



で、実際の基板を設計します。


f:id:shu223:20140517172106j:image:w600


route っていうコマンドで配線していくのですが、当然のことながら線同士が重なってはいけないので、部品を move コマンドで動かしたり回したりしつつ試行錯誤するのですが、これがコツをつかんでくるとなかなか楽しい作業でした。


「堤」って大きく書いてあるように、text コマンドで文字列も入れられます。


基板切削

MODELA で基板を切削します。


こんなのが出来上がりました。


f:id:shu223:20140517172137j:image:w500


自分で結線して、名前を入れたら愛着湧きまくりです。


はんだ付け

コンデンサ、抵抗、マイコン、電池ボックス、LEDをはんだ付けします。


f:id:shu223:20140517172237j:image:w500


プログラミング

Arduino UNO を書き込み器にしてプログラムを書き込みます。


とりあえずLチカの定番、Blink を書き込みました。


f:id:shu223:20140517172429j:image:w500


以上で出来上がり!



シンプルな基板ですが、マイコンがついてるので、余ってるピンに他のセンサやらアクチュエータやらつなげてプログラム書き込めばいろんなことができます。


Eagleの使い方メモ

以下作業しながらメモったもの。


※人に伝えるように書いたものではなく、内容の精査もしてないのでそのあたり差し引いてご参照ください。

新規回路図作成
  • 新規プロジェクト作成
  • 新規設計図(schemetic)生成
部品配置
  • コントロールパネル の [Libraries] > [use none] 選択(既存ライブラリの部品を使わないので)
  • useコマンドでライブラリを読み込む
  • addで部品を追加する(さっき読み込んだライブラリの部品も出てくる)
    • CAPA(キャパシティ)を置く
    • 置いたらesc
    • CR2032(電池ボックス)
    • Tiny138p3
    • 回転は2本指タップ
  • deleteで部品を消せる
  • move
  • copy
  • 全部いっぺんにうごかしたいときは group で選択して move 、右クリックで move group
結線
  • 線に名前をふる
    • label
    • name
    • 同じ名前をつけると、接続するかのダイアログがでる
  • 抵抗値をふる
    • value
    • 単位も入れる
      • 1uF
      • オームは opt + z で出てくる
      • (デフォルトがオームなので、入れなくてもよい)
  • ERC(Electric Rule Check)
    • エラーあるとダイアログが出る
    • うまくいくとダイアログでない(下部にNo errors/warningsって出る)
基板設計
  • 左上のほうにある [Switch to Board] ボタンをおす
  • ワークサイズを決める
    • gridコマンド
      • display onにする
      • size10mmにする
    • moveコマンド
      • 50x50の正方形にする(5マスx5マス)
    • gridコマンドでdefaultに戻す
      • 0.5inchごとのグリッドに戻る
    • この枠の中にあるものをイメージデータとして出力して切削することになる
  • moveでパーツを枠内に移す
  • mirrorで緑のパーツは反転させる
    • 実際は2列になってるの以外は変わらない
  • ratsnest
  • route
    • ripupで消す
    • moveで回転させつつ線がかぶらないようにする
      • 電池ボックスの白い線のとこはまたがってもよい
  • DRC(Design Rule Check)
    • Clearance
      • ドリルが通るかのチェック
      • 8milを0.4mmに変える
      • エラーがあればダイアログが出る
      • なければ下部にNo errors
  • 文字を入れる
    • textコマンド
  • polygon
    • 48 Document レイヤーを選択(使わないのでいつもこれを使ってる)
エクスポート
  • export(top)
    • displayでいったんnone選択 -> top, padsを選択
    • image
    • 800dpi
    • monochromeにチェック
  • displayでpads, dimentionを選択してまたエクスポート(holes)
  • displayでdocumentを選択してエクスポート(outline)

top, holes, outlineの3つのpngファイルができる


Arduinoからのプログラム書き込みのメモ

  • Arduinoで追加ハードウェアを認識させる
    • スケッチブックのフォルダ配下にhardwareフォルダをつくり、attinyフォルダごと置く
    • これでArduinoがattinyを認識できるようになる
    • attiny13が今回のボード
  • 配線
  • Arduinoを書き込み器にする
    • Arduinoの [File] -> [Example] > [ArduinoISP]
    • [Tool] -> [Board] -> [Arduino UNO]選択
    • [Tool] -> [Serial Port] USBポートを選択
    • 書き込むと、ArduinoUNOが書き込み器に変わる
  • 書き込む
    • [Tool] -> [Board] -> [ATTINY13] 選択
    • [Tool] -> [Programmer] -> [Arduino ISP]
    • [Tool] -> [Burn Bootloader]
    • エラーが出なければ書き込み準備完了

その他メモ

  • Eagleのライセンス
    • フリー版では10cm x 10cmまでの基盤をつくれる
  • Eagleの独自ライブラリを作成する
    • 既存ライブラリを開くと編集画面になる
    • ライブラリは パッケージ デバイス シンボルの3つにわかれている
    • デバイス 外装やレイアウトを定義するもの
    • シンボル 回路図用のファイル
    • パッケージ デバイスとシンボルを関連づける
  • 基板設計ソフト、KiCad ていうのを使う人も多い 有料

所感

my基板は我が子のようにかわいいです。プログラムや電子回路の知識は一切必要なかったので、ハードをつくる予定がなくてもとりあえず体験してみるのおすすめです。


次回 Lessone04 も同様に「Eagleで回路設計 〜 基板切削」とのことなので、興味のある方はぜひ参加してみると良いかと思います!


Rapid Prototyping Lesson04 : Circuit Design [Actuator] | Peatix


[雑記][iOS][海外就職]WWDCに初参加してきます!

$
0
0

6/2〜 サンフランシスコで開催される WWDC 2014 に参加すべく、また 久しぶりのアメリカ を満喫すべく、いままさに成田に向かっています(電車の中でこれを書いてます)。


iOS アプリ開発を始めて早4年、ついに憧れの WWDC に参加できる!ということでワクワク・・・できておりません。まだ。


まぁよく言われてる通り基調講演は全世界でストリーミング放送されるし、セッション動画はほとんどタイムラグなく公開されるし、そもそも 2012 や 2013 の動画だってほとんど見てないし(どっちかというとスライドPDFの方を見る)、ラボで今のところ聞きたいことは思い当たらないし、チケット高いし。。


とか冷めた感じだと非常にもったいないしずっと一度は参加してみたいと思っていたのは確かなので、最初で最後だと思って精一杯WWDCを満喫してこようと思います。


また帰ったらブログに書きます。では行ってきます!


[iOS][雑記]WWDC 2014 いまさら予習(と予想)

$
0
0

WWDC に参加するため、約1週間前からサンフランシスコに来ております。


f:id:shu223:20140602085755j:image:w400

(5/28、絶賛準備中の図)


初参加なのではりきって早めに現地入りしたわけですが、この1週間で気付いたこと。



そう、そうなのです。もともと日本でも最新情報に遅れ気味なのに、こっちに来るとネットに繋がってない状態がほとんど *1 なので、夜、宿に帰ってFacebook見て「iOS 8 が発表されるの?マジで!?」という感じです。


というわけでWWDC開催直前の今日、いろいろと記事を読んでキャッチアップしていこうと思います。


以下、調べたことなどを雑多にまとめていきます。


Appleが最近買収した企業

新機能が追加されたときに、それに関連する(と思われる)買収企業/サービスの前提知識があると新しい概念がスッと入ってきやすいので、まずはここを調べてみました。


『シリコンバレーによろしく』さんが、Appleが過去に買収した企業をすべてまとめた記事を書かれています。


そのうち、iOS 7 正式リリース以降のものを書き出してみると、

  • October 3, 2013Cue秘書ソフト
  • November 24, 2013PrimeSense半導体
  • December 2, 2013Topsy分析ソフト
  • December 23, 2013BroadMap地図
  • December 23, 2013Catch.comソフトウェア
  • January 4, 2014SnappyLabs写真編集ソフト
  • February 21, 2014Burstlyソフトウェア
  • May 2, 2014LuxVue TechnologyマイクロLEDディスプレイ
  • May 9, 2014Beats Electronicsハードウェア

こんな感じです。


うち、いくつか個別に調べてみました。

PrimeSense

一番上の記事見て思い出しましたが、そういえば話題になってたな。。


Cue

インストールしてたけど起動したことなかったアプリ。なるほど、

同社の検索サービスは、Facebook、Twitter、LinkedInなどのソーシャルメディアや、Gmail、Google Calendar、Dropbox、Evernoteなどのクラウドサービスのユーザーアカウント内の情報を横断的に検索できるというもの。パーソナルアシスタントのアプリケーションではこうした情報を分析し、スケジュールやリマインダーをパネル形式で表示していた。

という機能を提供してたのか。。


Burstly

聞いたことない企業名だと思ったら、「Testflight」の運営会社でした。



ちなみに『シリコンバレーによろしく』の Facebookの買収企業一覧Googleの買収企業一覧 という記事も勉強になります *2


メディアによる予想記事

こんな感じの内容が予想として挙がってきているそうです。

  • iOSの新バージョン「iOS 8」の発表
  • 次期Mac OS「OS X 10.10」の発表、開発コード名が明らかに
  • VoLTE(Voice over LTE)のサポート
  • iTunesがハイレゾ音源に対応し、6月に配信開始
  • iTunes Radio専用アプリのリリース
  • Beatsのドクター・ドレとジミー・アイヴォンが登壇
  • iCloud/iWork/iLifeの改良
  • スマートホーム分野への参入
  • ヘルスケア/フィットネス分野への参入
  • iWatchなどウエアラブルデバイスの発表
  • CarPlay続報
  • iPhone 6の発表
  • ハイレゾ対応デバイスの発表
  • 新型Apple TVの発表
  • 新型Thunderbolt Displayの発表
  • 12型Retinaディスプレイの新MacBook Airを発表
  • 教育市場向け低価格iMacの発表

10ページにわたる記事。ボリューム多いので未読。


エンジニアによる予想記事

iOSエンジニアとしてはやっぱりこのあたりの記事(APIレベル/開発者目線での予想)が一番読んでておもしろかったです。


ハッシュタグ #expectWWDC ツイートのまとめ


個人的予想(願望)

僕もやってみました。Appleのビジネス戦略とか、上でわざわざ調べた買収企業の技術とか、時代の流れとか一切考慮しておりません。単に開発していて不自由に思ったこと等をつらつらと書き並べた感じです。


  • UIActivityまわりの強化

最近触ってないのですが、AppSocially SDK つくってたときに、かゆいところに手の届かない API だなーと何度か思ったので。


  • Audio Unit のユニット増

Mac で使えて iOS で使えないユニット(Sub)がたくさんあるので。


あと、Custom Audio Unit も Mac で使えて iOS で使えない機能。


(参考記事)Audio Unit 再入門 - Over&Out その後


  • CIFilter のカスタムフィルタ作成/使用

Mac でできて iOS でできない。


  • Social.framework, Accounts.framework

iOS 7 で UIActivityType に Vimeo や Flickr が追加されたのに、Accounts.framework の ACAccountTypeIdentifier や Social.framework の SLServiceType には追加されてない。


  • カスタムフォントのプレビューをIBでサポート

(参考記事)IB上でカスタムフォントを選択してプレビューできるXcodeプラグイン『MoarFonts』 - Over&Out その後


  • Siri の API解放

音声認識機能の追加、という意味でもあるし、自然言語解析機能の追加、という意味でもあります。


もしこれやってくれたら個人的にすごく嬉しいところ。


(参考記事)iOS SDK用音声認識機能ライブラリVocalKitの使い方 - Over&Out その後


  • SceneKit を iOS でもサポート

Mac では使えて iOS では使えないフレームワーク。3Dをどうこうできるらしい。触ったことない無責任なイメージを書くと、Unity的なことを Xcode + Objective-C でできるのかなと(全然違ってたらすみません)。


  • パノラマ撮影のAPI解放

並行度合いを検知するのとか、画像をつないだりとかの処理。


  • Save as template機能

ファイルテンプレートはすごく効率化に寄与すると思うんですけど、記法を覚えづらくてつくるの面倒だし、ちょっと時間経つと古くなってしまうし、人によってよく使うテンプレートは違うので他人と共有しづらい。


という意味で、Xcodeで、編集中のクラスファイルをテンプレートに自動変換してくれたらすごい嬉しいなぁと。


そもそもテンプレートのフォーマットを公式には公開してないのでまずやってくれないだろうけど。。


(参考記事)Objective-C - Xcodeのファイルテンプレートを自作する - Qiita


  • AVSpeechSynthesizerの日本語サポート強化

僕がどういうことを望んでいるか、というのは下記記事から思いが伝わるかと思います。


iOSで使える日本語OKな音声読み上げエンジン8種(TTS,音声合成) - Qiita


  • 深度センサー搭載、API追加

上述した PrimeSense はそういうのが得意な企業らしいので、iPhoneに深度センサが乗って SDK から値取れたら開発者的には夢が広がるなーと。



以上、こういうのを書き始めると無限に出てくるのでこのへんで。。


おわりに

まーiOSエンジニアとしてはなんといっても iOS 8 ですね。なんとなく「ついこないだ 7 出たばっかりだからまだだろう」ぐらいに構えてたので、完全に油断してました。しっかり聞いて勉強してこないと・・・!


*1:入国初日だけ諸々不自由があって禁断のデータローミングに手を出しました。

*2:ちなみにちなみに、このブログを運営されているサトル氏に現地でお会いしましたが、とても親切で爽やかなグッドルッキングガイでした。

Viewing all 317 articles
Browse latest View live