istyleハッカソン出たよ。+何したのか(技術)

こんばんはのっぺです。
istyleハッカソンに出てきました。初めてのハッカソンだったけどハッカソン面白かったです(小並感

istyleって何

@cosme等を運営している会社。@cosmeはイケイケ女子なら誰でも知ってるコスメ通販サイトダゾ★

お前はistyle知ってたの?

正直知らんかった。イケイケ女子じゃないからしょうがないね

istyleハッカソンは何するの?

社内APIを使って好きなもの作れ!ってやつ
詳細は→
code for infinity ~istyle Hackathon 2014~[株式会社アイスタイル]

チーム2名「化粧予報アプリ」を作った

f:id:noppefoxwolf:20140902211310p:plain

リコメンド*コスメということで外出先の天気情報を取得して最適なコスメをリコメンドするアプリを作った。
2時間くらいで紫外線とか湿度とかでコスメ変わるよねっていう感じでアイデアを出し合って開発開始。
担当はフロント。相方はサーバーサイド。

開発フェーズ

何より時間が無いので面倒なところは全部フレームワークに投げた。
フレームワークの管理はCocoaPodsに出来るだけやらせた。
CocoaPods.org - The Dependency Manager for Objective C.

通信はHerokuと通信。GETリクエストにはNSURLSessionを使ってゴリゴリ書いても良かったけど時間無いし、そもそも見えない部分なのでAFNetworking2.0を使った。
AFNetworking/AFNetworking · GitHub

タイトル画面はスライドショー風にした。
KASlideShowをStoryboardから登録して3分くらいでリッチな見た目にした。
kirualex/KASlideShow · GitHub

地図部分はOSSのノウハウが無かったのでゴリゴリ書いた。
iOSのMapKitでMKMapViewを表示し、カスタムアノテーションを作成。
YOLP(Yahoo! Open Local Platform)を利用し、入力された地名から緯度経度を取得しピンを刺して強制的にコールアウトを表示させた。

  • (void)mapView:(MKMapView *)mapView annotationView:(MKAnnotationView *)view calloutAccessoryControlTapped:(UIControl *)control

がdeplicateしててマジでわけわからんかった。かわりのメソッドも無いしここで3時間くらい食った気がする。
結局ピンの位置を保持してコールアウトにUIButtonを埋め込んで無理やり実装した。

商品検索では追加読み込みの必要があったのでSVPullToRefreshを利用。
iOS6からPulltoRefreshはUIKitに含まれているが、引き下げのみで下まで行った時の読み込みが必要だったのでこれを使った。
samvermette/SVPullToRefresh · GitHub

UITableViewCellはカスタムクラスを作って位置をStoryboardで作ったモックの数値をコピーした。

所持コスメはjsonをNSDataに変換してNSUserdefaultに登録した。

基本的にはUIKitでUIを書きつつ、随所AFNetworkingで通信処理をした。

二人でリコメンドのアルゴリズムを考えながらもアルゴリズムの実装はサーバーサイドでやってもらって本当にやりやすかったです。

2週間ほどインターンしててObj-c書いてなかったので、解き放たれた感じでがっつり書きました。
1000行くらいだったのでだいぶStoryboardとかフレームワークで効率化が測れてていい感じだと思う。

f:id:noppefoxwolf:20140902213951j:plain
f:id:noppefoxwolf:20140902213954j:plain
f:id:noppefoxwolf:20140902213948j:plain