離島プログラマの雑記

島根県の離島、隠岐・西ノ島に移住して子育て中のフリープログラマです。

ディープラーニングことはじめ

最近はやりの人工知能で注目されているディープラーニングですが、どんなものか良く知らなかったので本を一冊読んでみました。

TensorFlowなどのフレームワークをいきなり触るのはなんだか難しそうだなー、と思っていたところに「ゼロから作る」というコンセプトの本を見つけたので手に取りました。結論から言うとわかりやすくて良い本だったので、入門にはおすすめです。

読んでみて理解したことを備忘録として羅列しておきます。

必要な前提知識

数学

数学の知識としては行列と微分が分かればOKという感じです。行列や微分の定義についてもちゃんと説明されているので、なんとなく分かってる程度でも読み進めることはできます。そこそこ数式も出てきますが、Python のコードを動かしながら進んでいくのでそんなに躓くことはありませんでした。

プログラミング言語(Python)

Python はほとんど使ったことないですが、演算や関数の定義などから説明があるので、他の言語をかじっていれば問題ないレベルです。 多次元配列や行列の計算には NumPy という数値計算ライブラリを使うので、ややこしい演算などはライブラリ側でやってくれます。

理解できたこと

自分が理解した内容の覚書なので、間違っているところもあるかもしれません。 本ではもう少しアルゴリズムの実装寄りの話が詳細に説明されており、実際にコードを動かして手元で確認しながら進みます。

パーセプトロン

ニューラルネットワークのもととなるアルゴリズム。 以下の特徴がある。

  • 複数の信号を入力として受け取り1つの信号を出力する
  • 信号の総和がある閾値を超えると発火(=1を出力)
  • 入力信号に重みバイアスというパラメータを設定
    重み
    各入力信号の重要性をコントロールするパラメータで。各入力信号にそれぞれの重みを乗算する。
    バイアス
    ニューロンの発火しやすさをコントロールするパラメータ。重みを乗算した入力信号の総和にバイアスを加算する。
  • 重みとバイアスを調整することで AND、NAND、ORのような単純な論理回路を表現できる

単層のパーセプトロンでは非線形な表現(XORゲートなど)ができない。
パーセプトロンを重ねることで非線形表現ができる

ニューラルネットワーク = 多層パーセプトロン

パーセプトロンの出力を次のパーセプトロンの入力信号とすることで、多層化することができる(多層パーセプトロン)。 多層化により、XORゲートなどの非線形表現が可能になる。 ニューラルネットワークは多層パーセプトロンとほぼ同じで、以下の特徴を持つ。

  • 入力層、中間層(隠れ層)、出力層に分類される層からなるニューロンのネットワーク
  • 各層には複数のニューロンが存在し、入力層〜中間層(1層以上)〜出力層の順に信号を伝達する(順方向伝播)
  • ある層の各ニューロンが出力する信号は、次の層の各ニューロンの入力となる
    • 例えば、ある層に存在する2つのニューロンの各出力(x1, x2)と重み(w)の和にバイアス(b)を足した値が、次層の3つのニューロン(y1, y2, y3)にそれぞれ伝播する
    • ニューロンから次層のニューロンへの各経路には、それぞれ異なる重みを設定する
    • 重み付き入力信号とバイアスの総和には活性化関数(h)を適用する
    • x1 → y1、x1 → y2 などの経路ごとに重みが違うため、y1, y2, y3 のニューロンへの入力はそれぞれ異なった値となる
      • y1 = h(x1 * (x1 → y1の重み) + x2 * (x2 → y1の重み) + b)
      • y2 = h(x1 * (x1 → y2の重み) + x2 * (x2 → y2の重み) + b)
      • y3 = h(x1 * (x1 → y3の重み) + x2 * (x2 → y3の重み) + b)
  • 活性化関数 入力信号の総和を出力信号に変換する関数 = 活性化関数 → 閾値を境にして出力が切り替わる性質を持ち、非線形関数である必要がある

出力層の設計

機械学習は分類問題と回帰問題に大別されるが、ニューラルネットワークはどちらにも使える。 出力層の活性化関数は問題に合わせて使い分ける必要がある。

  • 出力層の活性化関数
    • 恒等関数 → 回帰問題
    • シグモイド関数 → 2クラス分類問題
    • ソフトマックス関数 → 多クラス分類問題
      • 出力の総和が1になる = 確率として解釈可能
      • 出力層のニューロン数 = 分類したいクラスの数

ニューラルネットワークの推論(順方向伝播)

MNIST データセットを例に推論処理を実装する。

  • MNIST データセット
    • 0ら9までの手書きの数字画像
    • 訓練画像60000枚、テスト画像10000枚を含む
    • 画像データは 28 x 28 のグレー画像(256階調)
    • 各画像には対応するラベルが与えられている

ニューラルネットワークの設計は以下のようにする。

  • 前処理
    • ピクセルの値を 255 で除算(0.0〜1.0の範囲に正規化)
  • 入力層
  • 中間層(隠れ層)
    • 層の数やニューロン数は任意
      • 2つの隠れ層で、1層目が50個、2層目が100個、など
  • 出力層
    • ニューロン数 = 分類するクラス数
      • 10クラス(数字の0から9)に分類 = 10個
  • バッチ処理
    • NumPyなどの数値計算ライブラリは配列の計算を効率良く処理できるように最適化されている
      • 入力データをまとめて処理(バッチ処理)すると効率が良い
      • 入力データから100枚ずつ取り出してNumPy配列として処理する(NumPy配列の演算は配列のすべての値に適用される)

ニューラルネットワークの学習

特徴量 + 機械学習のアプローチでは問題に応じた(人力での)特徴量の設定が必要だが、ニューラルネットワークでは特徴量も機械が学習する。 ニューラルネットワークでは損失関数の値が小さくなるように最適なパラメータ(重みとバイアス)を探索する。

ニューラルネットワークでは、パラメータ解空間の探索方法として勾配法(確率的勾配降下法 = SGD)がよく用いられる。

  • 勾配法
    1. 偏微分により現在のパラメータにおける損失関数の勾配を求めて、最小値の方向を予測する
    2. 勾配から予測した最小値の方向へパラメータを更新する(移動する量 = 学習率)
    3. 1と2を繰り返して最小値へ向かって降下しながら、最小値を探索する

ただし、勾配が指す方向に必ず最小値があるとは限らない(極小値の可能性が高い)。 また、数値微分による勾配の計算は非常に時間がかかる。
誤差逆伝播(バックプロパゲーション)による勾配算出の高速化

誤差逆伝播法については、簡潔に説明するのが難しいので省略しますが、数値微分より大幅に少ない計算で勾配を算出できます。
本では一章丸々使って、計算グラフという表現方法で説明されています。

学習のテクニック
  • パラメータの更新方法
    パラメータの更新方法は学習の効率に大きく影響する。
    • SGD
      • シンプルだが関数の形状によっては探索が非効率
    • Momentum
      • 物理法則に従ってパラメータの移動場所を決める(お椀にボールを転がすイメージ)
    • AdaGrad
      • 学習率を徐々に減衰させる
    • Adam
      • Momentum + AdaGrad
  • 重みパラメータの初期値
    重みパラメータの初期値はモデルの表現力や学習の効率に大きく影響する。
    • Xavier の初期値
    • He の初期値
      • 活性化関数が ReLU の場合に特化した初期値
  • 過学習対策(正則化)
    • Weight decay(荷重減衰)
      • 大きな重みに対してペナルティを課す
    • Dropout
      • 訓練時に隠れ層のニューロンをランダムに消去しながら学習する
      • 実質的に複数のモデルに個別に学習させた平均をとることと同義なので、アンサンブル学習に類似
  • Batch Normalization
    • 2015年に提案された新しい手法
      • 学習の効率が良い
      • 初期値に依存しにくい
      • 過学習の抑制
    • 重みのパラメータの分布を強制的に分散させる
      • 活性化関数の前か後にデータ分布の正規化処理を行う
  • ハイパーパラメータの検証と最適化
    • 自動で学習できない(手動で設定する必要がある)パラメータ = ハイパーパラメータ
      • 各層のニューロン
      • バッチサイズ
      • パラメータ更新の学習率
      • Weight decay 係数
      • その他手法に応じて設定が必要なもの
    • 検証方法
      • ハイパーパラメータがテストデータに対して過学習を起こさないように、ハイパーパラメータ調整用の検証データを用意して検証
        • 訓練データから一部分離するなどして検証データを用意しておく
    • 最適化方法
      • ハイパーパラメータはモデルの認識精度で評価する
      • 試行を繰り返しながら良い値の範囲を絞り込んでいく
畳み込みニューラルネットワーク(CNN)

前述のニューラルネットワークでは全結合層を用いていたため、データの形状は無視されていた。 CNN ではデータの形状を維持する畳み込み層とプーリング層が追加される。 多段の畳み込み層では、前層の情報を元に段階的に高度な情報を認識することができるため、画像認識等の精度が向上する。

  • 畳み込み層

    • 入力データに対してフィルターを適用する
      • 入力データとフィルターの要素を乗算して和を求める(積和演算)
      • 3次元データ(奥行き = チャンネル方向が存在する)の場合、チャンネル毎に畳み込み演算した後、結果を合算して1つの出力を得る(チャンネルは1つになる)
    • パディング
      • 入力データの周囲に固定データを埋め込むことで、出力サイズを調整する
      • パディングを大きくすると出力サイズは大きくなる
    • ストライド
      • フィルターを適用する位置の間隔
      • ストライドを大きくすると出力サイズは小さくなる
  • プーリング層

    • 学習するパラメータがない
    • チャンネル数が変化しない

ディープラーニング(= 多層構造のニューラルネットワーク)

層を深くした多層構造のニューラルネットワークディープラーニングと呼ばれている。

  • 層を深くする意味
    • 理論的にはあまり分かっていないが、実践的には意味のある結果が出ている
      • (コンペティションの結果から)層が深まるほど認識精度が向上している
      • 層を深くすることで、パラメータ数を少なくできる
      • 層を深くすることで、学習データを少なくできる(=学習が高速化する)  
  • ディープラーニングの実装

  • 高速化

  • 実用例

    • 物体検出
      • R-CNN
    • セグメンテーション
      • FCN (Fully Convolutional Network)
    • 画像キャプション生成
      • NIC (Neural Image Caption) = Deep CNN + RNN (Recurrent Neural Network)
    • 画像スタイル変換
    • 画像生成
      • DCGAN (Deep Convolutional Generative Adversarial Network)
    • 自動運転
      • SegNet
    • Deep Q-Network (強化学習)

五線譜ノートアプリ PhraseNote ver1.2 リリース

iPhone/iPad向けアプリ PhraseNote を久々にアップデートしました。

BlueNotation - 音楽帳

BlueNotation - 音楽帳

  • Eiji Koyama
  • ミュージック
  • ¥490

ちゃんとブログに書いたことがありませんでしたが、PhraseNote はフレーズのメモやリードシート(メロディ+コード譜)の作成に特化した音楽ノートアプリです。ピアノ鍵盤でささっと音符が入力できたり、コードから伴奏を自動生成できたりするのが売りです。

f:id:k-aeg:20161203044443j:plain

ピアノ鍵盤に慣れている方なら、手書きタイプの記譜アプリよりスピーディーに入力できます。フルスコアなどきっちりとした譜面を作るのには向いていませんが、コードを入力すれば伴奏を自動生成するので、ジャズやポップス曲の作曲には役立つかと思います。 また、シラブルの表示機能(移動ドのドレミを表示)など、楽器の練習やソルフェージュ向きの機能もあります。

詳細はApp Storeの説明をご参照ください。

バージョン 1.2 の新機能

今回はリードシートの作成に必要な機能を中心にアップデートを図りました。

  • iPhone6/6 plus/7/7 plus 対応
    • スコアの解像度が上がって前よりきれいに表示されます
    • 小節幅も固定だったのを自動調節するようにしました
    • 小節数が増えると動作が重くなる問題を解消しました
  • 歌詞入力
    • それぞれの音符の位置に歌詞をつけられます
    • 最大で5番まで入力できます
  • 小節単位のコピー/カット/ペースト
    • テキストのメモ帳のような感じでコピペできるようになりました
    • 音符単位でもコピペできるようにしたいですが、今のところ未対応です
  • PDFエクスポート
    • 画像エクスポートも合わせてプレビュー表示がつきました
  • ヘ音記号
  • ダイアトニックコードの簡単入力パレット
    • 入力頻度の高いメジャー/マイナーのダイアトニックコードをボタンで簡単に入力できるようにしました
    • トライアドまたは7thコードを選択できます f:id:k-aeg:20161203044930j:plain
  • コードの入力履歴
    • 一度入力したコードは履歴ボタンに登録されて再度の入力が簡単になります
  • 繰り返し記号およびリハーサルマーク
    • 1カッコ、2カッコなどの繰り返し記号やリハーサルマークを追加しました
  • 付点音符入力の改善
    • 付点音符が選択中の音符の半分の長さの位置からも置けるようになりました
    • 小節からはみ出す場合は音符を自動分割して配置できるようになりました
余談

もともとはジャズのアドリブ練習用にフレーズをストックするために作り始めたアプリなので、それっぽい機能が備わっています。ご活用ください。

  • コードのルート音からのインターバル表示
    • インターバルがぱっと分かるのでフレーズのアナライズがしやすくなります
  • キー相対のシラブル表示
    • 移動ドでフレーズを覚えたりするのに便利です
  • 移調機能
  • 管楽器のための移調機能
    • Bb管、Eb管などの管楽器向けに曲のキーは変えずに表示上だけ移調できます

隠岐のフェリー乗換案内アプリを作ってみた 〜Webアプリ編〜

前書き

久々にブログタイトル通りのプログラマっぽい記事です(笑)。

リリースから3ヶ月ほど経ちましたが、島根県の離島、隠岐諸島地域のフェリー乗換案内アプリを作ってみました。本土⇔隠岐(島前/島後)をつなぐフェリーと、島前3島をつなぐ内航船が対象です。最初にブラウザで動作するWebアプリ(もどき)版を開発して、それをベースにハイブリッドアプリ化して iPhone/iPad 版、Android版を作りました。

隠岐航路案内

f:id:k-aeg:20160601163638p:plain

Webアプリ版 http://naturebot-lab.com/ferry_transit/

iPhone/iPad

隠岐航路案内

隠岐航路案内

  • Eiji Koyama
  • ナビゲーション
  • 無料

Androidplay.google.com

普段はiPhoneアプリ開発を中心にやっていて、Webアプリベース(と言っても、ほとんどフロントエンドで処理するので、Webアプリと呼べるか怪しいですが...)のものを作るのは初めてだったので色々と調べながら作りました。Android は昔少しさわったことがありますが、Google Play ストアでのリリースは初めてです。それぞれの開発の記録やハマったところなどを書き残しておきます。3本立ての予定で、今回は Webアプリ版です。

開発の経緯

島根県隠岐諸島では、本土と隠岐をつなぐ大型フェリーと隠岐諸島の島前各島をつなぐ内航船が就航しており、それぞれ隠岐汽船隠岐観光が運営しています。隠岐に関係する港は全部で6つだけですが、大型フェリーと内航船の乗り継ぎルートも含めるとわりと複雑です。

f:id:k-aeg:20160901112300g:plain 西ノ島町観光協会HPより引用

さらに時期によって船がドック入りしたり、運行ルートが変わったりするので、紙の時刻表で確認するのはちょっと骨が折れます。また、内航船は大手の乗換案内サービスでは検索対象外です。

隠岐汽船公式サイトには時刻表検索機能があり、内航船を含めた乗り換えルートも検索できるのですが、スマホに対応していなかったり、時刻表の一覧はPDFベースだったりとちょいちょい不便なので、スマホで簡単に見れる時刻表/乗換案内アプリがあると便利そう、ということでWebアプリの勉強がてら作ってみることにしました。

アプリの仕様

  • いわゆる電車乗換案内アプリのフェリー版
    • 指定した港から出る船の時刻表(主に島民向け)
    • 指定した出発地〜目的地の乗換ルート検索(主に観光客向け)
  • 指定された日時に応じた時刻を表示する
    • 駅順が決まっている電車と違い、時期や時間によってルートが異なる
  • オフライン動作に対応できるようにする
    • 島内は電波が悪いところが多くしばしば圏外になるので、観光中などにネットにアクセスできないケースを想定
    • Webアプリ版では対応せず、ハイブリッドアプリでのオフライン動作を想定して設計
  • 外国人観光客向けの英語表記対応
    • 表示する言語はブラウザの言語設定から自動判別

配布形態の検討

HTML5のオフライン動作向けの機能は各ブラウザに普及してきたので、Webアプリで完結することもできそうですが、とりあえずHTML5 + JavaScriptで機能を作ってWeb版としてリリースした後、iPhone/Androidのハイブリッドアプリを作る方針としました。Webアプリは一般的なユーザにはあまり浸透していない(と思っている)形態なので、ブックマークやトップ画面への追加などができないユーザも多そう、という意味でスマホアプリとしてパッケージングしたほうが良さそうと考えました。広告の表示回数をアクセス解析代わりに使っていますが、実際にスマホアプリ版、特にiPhone/iPad版のアクセス数がダントツに多いです。

使った言語とフレームワーク

言語

オフライン対応のハイブリッドアプリ前提で作るので、なるべくフロントエンドで色々と処理してやる必要があります。なので基本的にはブラウザが実行できるJavaScript一択となりますが、昨今はAltJS(JavaScriptコンパイルして使う、JavaScript の代替となる言語の総称)が全盛ということで、その中でも定番になりつつあるTypeScriptを使ってみることにしました。

TypeScript は名前の通り JavaScript + 静的型付けが基本的なコンセプトですが、ECMAScript 6 に準拠した機能を取り入れており、クラスベースのオブジェクト指向的な書き方がしやすいのでObjective-C、Swift 使いとしては馴染みやすかったです。

qiita.com

エディタは atom を使っているので 、atom-typescriptプラグインをインストールしました。TypeScriptで書いたファイルを保存するだけで、文法チェックとJSへのコンパイルを自動でやってくれるので非常に便利です。

qiita.com

なお、TypeScript で JavaScript のライブラリを使う際は、型定義情報が必要になります。有名どころのライブラリに関しては型定義情報が提供されています。型定義情報は Typings という型定義管理ツールで取得することができます。以前はTSDというツールが使われていたようですが、現在は非推奨になったようです。

qiita.com

バックエンド側はほとんど処理がないので、PHPで適当に書きました(^^;)

フレームワーク

フロントエンドで時刻表データを整形するのにMVC(MVW?)フレームワークAngularJSのフィルタ機能が便利そう、ということでAngularJSを使ってみることにしました(後継の Angular 2 も開発されていますがまだ色々変わりそうなので...)。AngularJSは色々モジュールを組み込んで拡張できるので、多言語対応も angular-translate でできそうです。

デザイン方面は疎いので、素人でもそれなりにそれっぽい画面になると噂のTwitter社製 Bootstrapを今更ながら使ってみようかな、と思っていましたが、AngularJS と組み合わせて使えるようにポーティングされたUI-BootstrapがAngularJS開発チームによって提供されていたので、それを使ってみることにしました。

環境構築

TypeScript + AngularJS + UI-Bootstrap な環境を作ります。 色々依存があってややこしいですが、Macで一から構築する場合は以下の手順です。

  1. homebrew (Mac OSX のパッケージ管理ツール)をインストール

    qiita.com

  2. homebrew で node.js (ブラウザなしでJavaScriptを実行するためのツール)をインストール

    node.js で動作する各種ツールを使うために node.js をインストールします。 atom エディタも JavaScript で書かれているので node.js が必要です。

    qiita.com

  3. npm (node.js のパッケージ管理ツール) で bower (フロントエンド向けパッケージ管理ツール) をインストール

    (2017/10/26 追記)久々にアプリをアップデートしたら bower がお亡くなり(deprecated)になっていたので、フロントエンド系パッケージ類もnpm管理に移行しました。

  4. npm で TypeScript をインストール

    docs.solab.jp

  5. bower npm でフロントエンド向けのライブラリ(今回は AngularJS と UI-Bootstrap)をインストール

    $ npm install angular-ui-bootstrap

    ちなみに UI-Bootstrap は Bootstrap のCSSだけ流用するので、Bootstrap もインストールが必要でした。 npm では angular-ui-bootstrap パッケージだけ入れれば良さそうです。

  6. bower npm で AngularJS のモジュールをインストール

    多言語対応用モジュール

    $ npm install --save-dev angular-translate

    便利フィルタ詰め合わせ

    $ npm install angular-filter

開発

時刻表のデータベース化

時刻表は各社からPDFで公開されていますが、それぞれフォーマットが違うので扱いやすい形に統一する必要があります。 今回は Google ドキュメントスプレッドシートに各社のフォーマットをそのまま入力できるシートを作って、Apps Script で統一したフォーマットに変換することにしました。出力されたものを csv としてダウンロードして、それを SQLite の DB に取り込んだものをサーバに配置しました。

統一フォーマットは以下のように、「ある港」から「次の港」へ向かう便の情報を最小単位として時刻表を分解したものです。

便ID 接続ID 開始日 終了日 便名 出発地 出発時刻 到着地 到着時刻
1 2 2016/01/01 2016/02/29 FERRY_OKI HONDO_SHICHIRUI 9:00 SAIGO 11:25
2 3 2016/01/01 2016/02/29 FERRY_OKI SAIGO 12:00 HISHIURA 13:10
3 4 2016/01/01 2016/02/29 FERRY_OKI HISHIURA 13:20 BEPPU 13:35

便IDは各便を一意に識別するための識別子、接続IDはその便が接続する別の便のIDです。時期によって便が変わるので有効期限(開始日、終了日)があります。

バックエンド

ハード面は安いプランのレンタルサーバです。隠岐諸島の人口(約2万人)と観光客(ツアー客を除く)のキャパシティを考慮しても、大量アクセスが見込まれるサービスではないので、数百アクセス/日を捌ければ良いという見込みです。

ソフト面では、オフライン対応のために前項の時刻表DBをまとめてクライアントに渡す処理が必要です。PHP で時刻表 DB の全内容を JSON 化してクライアントに送信する処理を書きました(数行だけですが)。 DBファイルを直接クライアントに投げちゃってもいいような気もしましたが、クライアント側で SQLite3 DB が扱いにくいようなので、そのまま処理できる JSON 形式にしています。

フロントエンド

クライアント側のプログラムは TypeScript も AngularJS + UI-Bootstrap も初めてなので探り探りの開発です。 将来的な Angular2 への移行やメンテナンス性を考えると、以下のような記事を参考にするのが良さそうです。

http://qiita.com/armorik83/items/5542daed0c408cb9f605qiita.com

qiita.com

が、UI-Bootstrap 公式のサンプルコードは書き方が古めかしいので、それを参考にしているうちにあまりモダンでないコードになってしまいました...。いずれリファクタリングしたい(^^;)

UI(ユーザインタフェース)

アプリの主な機能は時刻表と乗換案内なので、タブで切り替えるのが良さそうでした。 UI-Bootstrap には Tabs というディレクティブ(=独自タグor要素)が用意されていて、簡単にタブの UI を作成できます。便利。

時刻表

時刻表の処理としては、以下のような感じです。

  1. サーバの時刻表DBからJSON化したデータ(数百KB)を取得
  2. AngularJS のフィルタで指定日時と出発地/到着地に一致するデータを取捨選択
  3. ngRepeat ディレクティブで表を生成

フィルタは拡張モジュールも合わせると様々な種類が用意されており、条件に一致するデータの抽出や排除、プレフィックスサフィックスの追加などが簡単にできます。多言語対応モジュールもフィルタとして実装されており、登録したワードをフィルタにかけると言語設定に対応した文字列に置き換えてくれます。

SQLite3 や JSON オブジェクトには日時を表す型が存在しないので、時刻は文字列(mm:ss)として格納されており、JSON の文字列から JavaScript の Date 型に変換して保持しておきます。この時の変換元となる文字列のフォーマットは少し曲者で、ブラウザによって許容する表現が異なります。サポートしていないフォーマットを指定した場合、null が返ってしまうので全てのブラウザがサポートしているフォーマットを選択する必要があります。

ka2.org

というわけで、一番汎用的な"YYYY/MM/DD HH:mm:ss"フォーマットに加工してから Date 型に変換しています。

乗換案内

乗換案内のアルゴリズムは、以下のような感じです。

  1. 指定日時に従って有効期間外の便をフィルタで排除
  2. 指定出発地かつ指定時刻に最も近い便を抽出して、各経路を探索 2-1. 指定到着地にたどり着く便を抽出して結果リストに保存 2-2. たどり着けない便から接続可能な次の便を探す 2-2-1. 見つかった便から、指定到着地にたどり着く便を抽出して結果リストに保存 2-2-2. たどり着けない便から接続可能な次の便を探す ...以上を再帰的に繰り返してすべての経路をリストアップ
  3. 経路リストを優先度順にソート
  4. ngRepeat ディレクティブで経路リストから表を生成

6つしか港が無い割に、かなり色々な経路をとることができるので、隣の島に行くのに数百種類の経路が出たりします(笑)。全部いっぺんに表示するのはアレなので、最初は上位5経路を表示するようにして「もっと見る」ボタンを押すと他の経路も見れるようにしました。 となると、どの経路を優先して表示するかが問題となり、ユーザに優先したい条件(到着時刻が早い順、移動時間が短い順、値段の安い順など)を選んで貰えば解決、なのですが、それらのインターフェースも増やすとごちゃごちゃして使いにくそうなので、そこはアプリ側で優先すべき経路を勝手に判断することにしました。

多言語対応

angular-translate モジュールを使って日/英に対応しました。 使い方は以下の記事がわかりやすかったです。

http://angularjsninja.com/blog/2013/09/05/angularjs-i18n/angularjsninja.com

言語設定の自動判別は自分でやってやる必要があります。 $translateProvider.determinePreferredLanguage() に言語コードを判別して返す関数を渡します。 JavaScriptでの判別コードは以下の記事を参考にしました。

JavaScript でブラウザの言語設定を取得 | EasyRamble

デプロイ

デプロイはgitHub経由でやってみたら楽で良かったです。 手順は以下の通り。

  1. gitHubリポジトリを作成
  2. ローカル git から gitHub リポジトリに push
  3. サーバに SSH ログインして gitHub リポジトリから pull

gitHub からサーバに通知して自動 pull みたいなこともできるらしいですが、ちょっと面倒なので今回はそこまでやりませんでした。 なお、bower でインストールしたパッケージ群はgitリポジトリに含めないので、予めFTP転送ソフトでサーバにアップしておきました。

ハマりどころ

クロスドメイン通信

各ブラウザでは、クロスサイトスクリプティング(XSS)防止のため、クロスドメイン通信がデフォルトで禁止されています。つまり、JavaScript の処理からのアクセス先(今回はPHPスクリプト)が同じサーバにあるWebアプリ形態の場合は問題ないですが、ハイブリッドアプリ化した場合、JavaScript は端末のアプリ側に置かれるので、サーバに対するアクセスはクロスドメイン通信となり失敗します。

これの解決方法は、JSONP(JSON with Padding) や CORS(Cross-Origin Resource Sharing)、XDM (Cross Document Messaging)などいくつか方法があるようです。

https://blogs.msdn.microsoft.com/tsmatsuz/2011/06/24/jsonp-cross-domain/blogs.msdn.microsoft.com

JSONP は裏ワザっぽいし、XDM は大仰なので、今回は王道っぽい CORS で対応することにしました。 実装は PHP で一行追加するだけでした。

tadtak.jugem.jp

時刻入力

スマートフォンからアクセスする場合、UI-Bootstrap の Timepicker はボタンが非常に押しづらくて使いにくいです。代替として HTML5 の input type="time" を使用すると OS ネイティブの入力インタフェースが出て入力しやすいのですが、IE11、 デスクトップ版の FireFoxSafari などでは未サポートでした。

Can I use... Support tables for HTML5, CSS3, etc

解決方法としては、AngularJS の ng-hide ディレクティブで、スマホ/タブレット向け(xs, sm)は input type="time"、それ以外(md, lg)はTimepickerを表示するように切り分けました。(が、さらに Android 4.3 以下の標準ブラウザは input type="time" をサポートしていないことが判明したので、Android版では Cordova + Crosswalk でレンダリングエンジンを変更することで回避しました。詳細はAndroid版のエントリで...)

文字化け

JavaScript のコードで日本語を使っていたところ、iOSSafari で文字化けしました(charset="uft-8" を指定してもダメ)。条件文で日本語を使っていたりすると、プログラムが動作しなかったりします。 回避方法は以下の記事で紹介されているとおり、UTF-8(BOM付き)で JavaScript を保存するというものですが、atom エディタは BOM 付き保存はサポートしていないので、JavaScript から日本語を排除するようにしました。DBに格納された日本語をif文で使ったりしていたので、DB内に日本語で格納していた船名や港名も英字に置き換えが必要でした...。

d.hatena.ne.jp

また、上の問題とは別に iOS7 では英語設定でのローマ字表記に使うラテン文字がどうしても文字化けするのですが、こちらはアプリ使用上はほぼ問題にならないため、対応しないことにしました。

その他

Favicon と App Icon

Favicon はブラウザの URL の左側に表示されるミニアイコンで、App Icon はスマホでWebサイトをホーム画面に追加したときに表示されます。アプリっぽくするために、それっぽいアイコンをこさえて設定しておきました。

f:id:k-aeg:20160601163638p:plain

アイコンの作成には Affinity Designer というソフトを使っています。Adobe Illustrator の代替のベクターベースのグラフィックソフトとして人気が出ているようですが、廉価なのになかなか使い勝手が良くて重宝しています。

Affinity Designer

Affinity Designer

  • Serif Labs
  • グラフィック/デザイン
  • ¥7,000

フェリーのアイコンは以下のサイトで配布されているものを使わせてもらいました。 icooon-mono.com

以下のサイトに画像を投げると Favicon と App Icon を自動生成してくれます。 www.favicon-generator.org

3Dプリンタで模型製作 + エアブラシ塗装ことはじめ2

あらまし

タイトルが変わってしまいましたが、前回からの続きものです。 前回の記事では模型の塗装用にエアブラシ環境を整えました。 ag.hatenablog.com

今回はエアブラシで塗ってみたお話です。何を塗るのかは前回の記事に書いてませんでしたが、西ノ島の名産品である活イカの模型を塗りました。モデリングから始めて、3Dプリンタで印刷した上での、仕上げの塗りなのでそのあたりの流れも記録しておきます。

塗装までの工程

モデリング

有機物なのでポリゴンベースのモデリングソフトより、スカルプトモデラー(デジタル彫刻)のほうがやりやすそう、ということで Scruptris というソフトを使ってみることにしました。

Sculptris トップ|株式会社オーク

簡便な操作性で、初心者でもそれなりの形に仕上がる良ソフトですが、ありがたいことに無償で提供されています(有償版 ZBrush の入門版という位置づけ)。

さて、できたのがこちらになります(3分クッキング風)。

f:id:k-aeg:20160802002057j:plain

これを OBJ 形式でエクスポートします。

3Dプリント

モデリングしたデータを3Dプリンタでプリントしていきます。 使っている3Dプリンタはこちらです。

今回は塗装前提なので eSUN の白いPLAフィラメントを使用しました。

[asin:B00MVKOSDW:detail]

このフィラメントはプリント温度は205〜210℃が最適なようです。200℃だと失敗してボロボロになってしまいました。 また全長30cmを超える大物のため、一回ではプリントできないので FlashPrint の分割機能で2分割しました。

f:id:k-aeg:20160615121152j:plain

f:id:k-aeg:20160615121310j:plain

さて、プリントできました(プリント直後の写真は撮り忘れました)。サポート材をニッパーやカッターで取り除き、半日ほどかけてひたすら表面をヤスって積層痕を消します。 ちゃんと研磨しないと積層痕の溝に塗料が流れたりしてうまく塗れません。 今回のような曲面の多い形状の場合、粗めのスポンジタイプのヤスリから始めると曲面にフィットして削りやすいです。

[asin:B0041JVSOI:detail]

最終的には紙やすりで #60 〜 #300 くらいまで順に研磨しました。 研磨後、分割された本体を結合します。今回は水に沈む必要があったので、内部に穴を開けて釣り用のオモリを入れて浮力を調節しました。

結合したのがこちらになります。

f:id:k-aeg:20160528181023j:plain

結合部の接着はプロ用耐衝撃というなんか強そうな接着剤を使いました。

パテ補修

結合部はどうしても段差ができてしまうので、パテで隙間を埋めます。 コスパが良さそうなこちらのパテを使いました。

橙色っぽい部分がパテによる補修部分です。結合部のほかに、研磨で穴が空いてしまった部分なども補修しました。

f:id:k-aeg:20160529003310j:plain

パテを盛ったあと、カッターやデザインナイフなどで余分なパテを削ぎ落とし、紙やすりで段差が滑らかになるように仕上げます。

塗装

さて、やっと塗装に入りますが、あまり写真がありません(^o^)

下地塗装

まず、サーフェイサーで下地を塗っていきます。 1段目は下地隠蔽力の高いグレータイプ。

2段目はクリアカラーの下地とするため、ホワイトタイプのサーフェイサーで塗ります。

[asin:B00167DCC4:detail]

下地が隠蔽されるまでそれぞれ2〜3回ほど塗り重ねます。さらに表と裏に分けて塗るので、塗装→半日乾燥を計10回ほど繰り返して一週間ほどかかりました。

エアブラシ塗装

準備については前回の記事の通りです。塗料はラッカー系塗料を使いました。 塗料の希釈具合などは以下のサイトがわかりやすかったです。

http://www.k4.dion.ne.jp/~gustav/air04.html

さて、一応失敗した3Dプリント物などで2〜3日練習してみた後、本番の塗装です。 と、思ったらエアブラシが詰まって塗料がでません\(^o^)/

ノズルのクリーニングなどいろいろ試してみましたが改善せず、2日ほど悩んで最終的にエアブラシの後ろのネジ(名前がわかりません)をゆるめたところ、ちゃんと出るようになりました。

f:id:k-aeg:20160612184209j:plain

右の写真がもらった資料で目標の色となりますが、ベースの色はクリアイエローを薄く塗ることで再現できました。 その上の茶色っぽい部分はオレンジと黒の調色です。

調色については、子ども向けですがこちらのサイトの「混ぜ合わせチャート」という表が非常に便利です。

print-kids.net

斯くして一旦塗り終えたわけですが、どうも本物はもらった資料ほど黄色くないそうで...。 実物を見せてもらってリトライです。

f:id:k-aeg:20160617150803j:plain

確かにちょっと黄土色っぽい感じですね。 というわけで、一旦色を剥がして塗り直したものがこちらです。

f:id:k-aeg:20160627190834j:plain

ベースの色はクリアイエローに黒を少し混ぜました。 目玉は筆塗りです。目の横のアイシャドウみたいな部分はクリアブルーを重ねています。

仕上げのウレタンニス

色はOKが出たので、最後にテカリと防水性(水に沈めて使うので)のためにウレタンニスで仕上げます。 今回は水性ウレタンニスというものを使いました。木工用ですが模型にも普通に使えます。

これを3層ほど塗り重ねますが、1層塗り終えるごとに#300くらいのヤスリで表面を研磨してやる必要があります(次の層の吸着を良くするため)。透明なので均一の厚さに塗るのはなかなか難しく、薄いところは研磨で下地の色ごと剥がれてしまったりしてなかなか難しかったです。

これも表裏×3層で3日くらいかかって、やっと完成です。

塗り終えた写真を撮らずに納品してしまったので、残念ながら完成品の写真はありません(^^;)

エアブラシ塗装ことはじめ

島内で依頼を受けて3Dプリンタで作った模型に塗装が必要になったので、エアブラシに挑戦してみることにしました。

必要なもの

島内にはエアブラシなど売っているところはないので、例のごとく Amazon で調達します。

エアブラシ本体

塗料

  • ラッカー系塗料

    模型でよく使われる塗料の種類はラッカー(溶剤系アクリル塗料)、水性アクリル塗料、エナメル塗料、ウレタン塗料などがあるようですが、今回はエアブラシ向きのラッカー系塗料を用意しました。

    それぞれの塗料の特徴は大まかには下記のようです。ウレタンは仕上げのクリア塗装などに限定した用途が多いらしいので省いてます。

    ラッカー 水性アクリル エナメル
    塗膜 強い 弱い 非常に弱い
    乾燥時間 早い 遅い 遅い
    塗料の伸び 良い 悪い 非常に良い
    塗り方 エアブラシが最適 筆塗り/エアブラシ 筆塗りが最適
  • うすめ液(ラッカー系塗料用) [asin:B001AZ8CDQ:detail] ラッカー系塗料専用のうすめ液です。塗料に混ぜてエアブラシに適切な濃度に調節します。

  • サーフェイサー

    下地塗り用の塗料です。今回3Dプリントした模型は素材がPLAで、あまり塗料ノリが良くないと言われているので、レビューで食いつきが良いとの評価が高い製品を買ってみました。

周辺ツール

塗装ブース製作

エアブラシは塗料+溶剤が霧状になって飛び散るので、室内でやる場合はファンで集気してフィルタで清浄化する塗装ブースは必須です。既成品の室内用塗装ブースも色々ありますが、そこそこ値段がするので今回はダンボールでしょぼめ塗装ブースを自作してみました。

材料

  • PC用冷却ファン(12V DCファン)

    前面から吸気して背面から排気する直進型のファンです。前面から吸気して上に排気するタイプのシロッコファンというのもあるようで、排気ダクトありの設計の場合は本体側にシロッコファンを配置して、排気ダクトを窓用換気扇に接続するパターンが多いようですが、シンプルに直進型のファンで直接排気するようにしました。PC用のファンは色々製品がありますが、回転数3500rpmと一般的なファンより高速な割にリーズナブルだったのでこれにしました。音はうるさいです(笑)

  • ファン駆動用AC電源 [asin:B002TOK07S:detail] PC用ファンに必要な電源はDC12Vなので、換気扇と違って直接コンセントにさせないので、ドライブ用のAC電源を流用します。電源コネクタは同じなので改造なしで使用できます。

  • レンジフード用不織布フィルタ f:id:k-aeg:20160520134917j:plain 100均で買いました。大きいので適当に切ってつかいます。

  • ハニカムフィルタ

    不織布フィルタのみだとすぐに目が詰まってしまうらしいので、ハニカムフィルタと組み合わせてミストをキャッチします。見た目のまんまダンボールを積み重ねたフィルタなので、簡単につくれるだろうと思って自作したら案外面倒くさかったです...。自作する場合は厚めのダンボールを1.5cm幅に切りそろえたものを数十本用意して、積み重ねてボンドで接着します。

f:id:k-aeg:20160517155648j:plain 地道な作業です。次からは買おうと思いました。

組み立て

f:id:k-aeg:20160520135037j:plain 見たまんまなので詳細は省きますが、ダンボールを切り貼りしてこんな感じの箱を作ります。 背面にファンの羽に合わせた大きさの穴を開けて、ファンを取り付けます。今回は木ねじで背面からファンとダンボールをぶすっと貫通させて、前面から木ねじをグルーガンで固定しました。

フィルタの取り付け

f:id:k-aeg:20160520135512j:plain 前面の角にマジックテープを貼り付けて、不織布フィルタを固定しました。

f:id:k-aeg:20160520135059j:plain 最後にハニカムフィルタをつけてできあがりです。ハニカムフィルタ側にもマジックテープを貼りつけて、不織布フィルタに固定しました。

塗装してみる

調色

塗料皿で複数の塗料を混ぜて吹きたい色を作りますが、これが実は一番難しかったです。どう混ぜて良いかさっぱりだったので、混色ガイドというアプリでざっくり配合を見てから調節していくようにしましたが、なかなか思うような色になりません。ちゃんと目的の色を得るには、色々試して経験を積んでいく必要がありそうです。

混色ガイド

混色ガイド

  • PC Garage
  • 仕事効率化
  • 無料

塗料の希釈

塗料そのままだとエアブラシにとっては粘度が高過ぎるので、うすめ液でちょうど良い具合に希釈します。うすめすぎてもダメなのでこれもコツをつかむのに時間がかかりそうです。希釈した塗料はハンドピースのカップに投入します。慣れたらハンドピースのカップ内にうすめ液を投入して、そこに塗料を入れる方法もあるようです。

試し吹き

写真を撮ってなかったですが、3Dプリンタで失敗した造形物に色々吹き付けてみました。ムラなく塗るのはやはりコツが要りそうですが、距離や吹付けの強さによって色々な塗装ができるので面白いです。もう少し練習してから本番に挑もうと思います。

後片付け

ハンドピースのカップに残っている塗料を空きビンに移すなどしてから、塗料を拭き取り、クリーナーを投入してうがい(ハンドピースの吹き出し口を抑えて、カップに空気を逆流させること)をします。細かいところは綿棒にクリーナーをつけて掃除します。吹き出し口のニードルキャップにも塗料が溜まるので、取り外して綿棒で塗料を落とします。

感想

準備やら片付けやらは大変ですが、塗るのは楽しいです。しかし、希釈も掃除もシンナーを使用するので換気はとても重要です。窓開けたりして換気しながらの作業でしたが、それでも結構なシンナー臭で、長時間作業は体によくなさそうです。ちょっと値段がしますが、有機溶剤用のマスクを買っても良いかも...。

3Dプリンタでおみやげ開発

隠岐・西ノ島に移住してから、「西ノ島お土産開発プロジェクト」と称してひとりで勝手にやっているのですが、第一弾として西ノ島町ゆるキャラ「活イカ活っちゃん」のフィギュアストラップを製作してみました。試作から量産まで一貫して3Dプリンタで作っています。

f:id:k-aeg:20151223191013j:plain

西ノ島町観光協会(西ノ島町別府港第2ターミナル1F)で販売していますので、観光などでお立ちよりの際はぜひご覧くださいませ。 (2017/7/18追記)現在は隠岐酒造(安藤本店様)、隠岐シーサイドホテル鶴丸様、国賀荘様でも取り扱っていただいています。

また、西ノ島町の地域振興課でも扱ってもらえることになったので、本土でのイベントでも販売される予定です。

f:id:k-aeg:20151224170758j:plain

というわけで、製作開始から販売までにやったことを振り返ってみようと思います。

準備編

使用したツール

  • 3Dプリンタ(FlashForge Dreamer)

    中堅クラスのパーソナル3Dプリンタ。動作も安定しており、ほとんど設定をいじらなくても一定のクオリティでプリントできます。購入当時は同価格帯で高品質プリントを謳うAFINIAと迷っていましたが、Dreamer はカバーが付いていることによるプリント時温度の安定性や、造形サイズの大きさ(特に床面積が量産に重要)などの面でアドバンテージがあるかと思います。材料はPLA・ABSに対応していますが、PLAのほうがプリントが安定している(ノズルが詰まったりしない)のでもっぱらPLAを使用しています。今回は使用していませんが、デュアルヘッドなので2色刷りもできます。

  • スライサー&プリント用ソフト(FlashPrint)

    3Dプリンタに付属のソフト。使いにくいソフトではないですが、サポート(支柱)自動生成機能はうまく生成されないことがあって苦労したので、定評のある Simplify 3D とかの有料ソフトを買ったほうが良かったかも。

    f:id:k-aeg:20160317002318p:plain

  • インクジェットプリンタ

    パッケージのラベルシールや顔デカール印刷用。普通のインクジェットプリンタですが、ラベルシールなどの特殊用紙は、対応するプリンタが限られるので注意が必要です。

  • ルーター

    プリント後、サポートを外した部分(ゲソの裏側あたり)のバリ取りに使用します。

  • ニッパー

    サポート外し&バリ取り用。

  • 防護メガネ

    サポート外し&バリ取り用。100均にも売っています。

    [asin:B00E4ASFZ4:detail]

  • キリ

    ストラップを付ける穴開け用。100均で買いました。

  • 紙ヤスリ

    サポート跡の仕上げ用。100均の紙ヤスリセットが便利でした。

  • 裁断機(ディスクカッター)

    パッケージ用のシールや活っちゃんの顔デカールの裁断用。最近の裁断機はスマートで安いですね。

    [asin:B005GICA5Y:detail]

  • モデリングソフト(Blender)

    3Dモデル作成用。高機能ながら無料で配布されている、大変ありがたいモデリングソフトです。わりと操作にクセがありますが、慣れればなんとかなります。

    www.blender.org

材料

そんなに大量生産はしないので、だいたい Amazon仕入れています。離島住まいですが、プライム会員なので送料もかかりません。

  • 3Dプリンタ用フィラメント(PLA)

    主な原料。活っちゃんは都合の良いことに白一色なので、フィラメントの色そのままで塗装はしていません。

    [asin:B00IAMOH4K:detail]

  • 転写シール(透明タイプ)

    活っちゃんの顔用。曲面にも上手く貼ることできます。Amazon の簡易パッケージ版が安いです。

    [asin:B00QHUX4XM:detail]

  • ヘッダー付きOPP袋

    パッケージ用の袋。名前が分からなくて検索が難しかったですが、OPP袋というらしいです。Amazon にはあまり種類がないので、このサイトで買いました。

    www.olpa.jp

  • ラベルシール(光沢)

    パッケージに貼る用。ノーカットなので自分で好きなサイズにカットして使います。

設計〜試作編

モデリング

まずは3Dプリントするための3Dモデルが必要なので、モデリングソフトを使って活っちゃんをモデリングします。今回は Blender というソフトを使いました。だいぶ前に一度使ってみて挫折した経験がありますが、以下の記事を参考にさせてもらったところ、一通りの操作を覚えつつ活っちゃんが出来上がりました。

初心者のための!作って学ぶBlenderの基礎:②モデリング | 日本VTR実験室

具体的なモデリング方法については記事にあるので割愛しますが、大まかには以下の手順です。

  1. ガイド絵を用意する

    こちらに活っちゃん着ぐるみの写真があったので、ガイド絵として使わせてもらいました。

    活イカ活っちゃん (姉) | 着ぐるみプラス

  2. Mirror Modifier(鏡像反転) を設定する

    活っちゃんはほぼ左右対象なので、Mirror Modifier を設定することで、左右どちらか半身のモデリングを省略することができます。

  3. 本体の大まかな形をつくる

    ガイド絵に沿って、平面をつなげて大まかな形をつくります。主に必要な操作はループカット、押し出し(Extrude)、拡大/縮小(Scale)の3つだけです。

  4. 細かい部分をつくる

    手足やエンペラなど細かい部分をつくります。主に必要な操作は押し出しと面張り(Face)だけです。

3日ほど Blender と格闘して、とりあえず活っちゃんぽいものができたので、顔のグラフィックを貼ってレンダリングしてみました。

f:id:k-aeg:20160306024441p:plain

テストプリント

さて、作った3Dモデルを試しにプリントしてみます。3Dプリントソフト(FlashPrint)に読み込ませるには、Blender からSTL形式でエクスポートする必要があります。読み込み時にポリゴンが裏返ってたりしてエラーが発生する場合がありますが、大抵は自動で修復してくれます。

脚から胴体にかけての部分は宙に浮いているので、サポート(支柱)を生成してやります。とりあえずプリントした結果がこれです(サポートは除去済み)。

f:id:k-aeg:20151010024219j:plain

顔はインクジェット紙に印刷したものを接着剤で貼り付けています。わりと上手くいっているようにも見えますが、隠れている脚が何本か折れています(笑)。考えてみれば当たり前ですが、脚の先端の細い部分から徐々に太くなる構造は積層方式の3Dプリンタが苦手とするところです。サポートを増やして色々試しましたが、かなりの確率で折れます。

また、脚の先端が尖りすぎていて危険だったので、先っちょはだいぶ丸めました。モデリング段階で意識していなかった問題も、プリントしてみることで色々と見えてきました。

産業文化祭への出展

開発期間中に、ちょうど西ノ島町が主催する産業文化祭が開催されたので、前宣伝も兼ねて出展してみました。

f:id:k-aeg:20151023143933j:plain

3Dプリンタの実演もやったので、ちびっ子からおじいさんまで色々な方が興味を持ってくれました。役場の方にも興味を持っていただいて、後にイベントでの販売のお声がけをいただきました。この時は顔を透明フィルムシールに変更していますが、曲面になじまないので切れ込みを入れており、まだちょっと微妙な感じです。

量産〜販売編

量産方法の検討

量産方法については、3Dプリンタで作ったモデルを原型としてレジンキャスト(シリコン型枠にレジンを流し込んで成形する)なども検討しましたが、費用や手間を総合して考えた結果、全部3Dプリンタでやってみることにしました。

比較項目 ジンキャスト 3Dプリント
費用 × レジンの単価が高め。型枠に使用するシリコンも単価高め、かつ寿命がある(20回程度で壊れる) ◯ kgあたり単価はPLAフィラメントのほうがレジンより若干安め程度だが、中空構造にできるため材料消費が抑えられる。
複製時間 ◯ シリコン型枠の作成はそこそこ時間がかかるが、レジンキャスト自体は1回3分程度と短い。 △ 大きさに比例するが、ストラップサイズでも一体あたり数十分と長め。
複製手順 × 型枠作成、レジンキャストともに手作業が多い。 ◯ プリント準備(3Dプリンタの水平出しなど)以外はほぼ自動。
後加工 △ バリ取り等は必要だが加工はデザインナイフなどで比較的カンタンにできる。 × サポート(支柱)のバリが多く発生する。PLAはレジンと比較して硬いので、加工はルーターなどが必要。

量産プリント向けの改良

量産にあたっては、まだ何点か改良が必要でした。

  • サポート(支柱)の改良

    自動サポートに頼っていると相変わらず脚が折れやすいので、手動で3Dモデル側にサポートをつけました。プリント時のラフト設定(土台の自動追加)と合わせてだいぶ改善はされましたが、まだたまに折れます...。

    f:id:k-aeg:20151211162723j:plain

  • 腕の位置の改良

    腕が体から離れていると引っかかったりして折れやすいことが判明したので、体にくっつけるように修正しました。ただ、くっつけすぎるとプリントに失敗するようになったので、くっつくかくっつかないかの微妙な位置に調整が必要でした。

  • 顔プリントの改良

    顔のプリントは、3Dモデルに凹凸をつけてプリントして着色したり、シールで貼るなどで色々試してみましたが、転写シート(デカール)が一番うまく行きました。活っちゃんの顔は曲面なのでシール系は貼りにくいのですが、転写シートは曲面にうまくフィットしてくれます。

改良の結果、こんなフォルムになりました。

f:id:k-aeg:20151125124431j:plain

小さい活っちゃんが実際にストラップとして販売するサイズです。 大きい活っちゃんは西ノ島町観光協会にプレゼントしました。

活っちゃんの使用許可申請

活っちゃんは西ノ島町のキャラクターなので、町の使用許可が要ります。使用許可申請の許諾条件はイラスト利用を前提としており、立体物は前例がないとのことでしたが、産業文化祭で一度お披露目していたこともあり、わりとあっさりと許可をいただけました。

量産プリント

使用許可も取れたので、いよいよ量産に入ります。

プリント中の様子。

f:id:k-aeg:20151019171915j:plain

ぎちぎちに並べたところ、同時に25体までプリントできました。プリント時間は20時間程度です。

f:id:k-aeg:20151020022453j:plain

大量にできました。

f:id:k-aeg:20151202114323j:plain

仕上げ

さて、プリント後の状態からストラップとして販売できる状態に仕上げていきます。

  1. バリ取り

    ニッパーなどで一体ずつに分解して、脚まわりのサポートを外していきます。結構飛び散るので防護メガネが必須です。

    f:id:k-aeg:20151211162539j:plain

    サポートの跡が残るので、ミニルーターで表面を滑らかに磨きます。ミニルーターで処理できない箇所は紙ヤスリで仕上げます。

    f:id:k-aeg:20151211170205j:plain

  2. ヒートン装着

    ストラップを引っ掛けるためのヒートンを挿す穴をキリで開けます。最初はミニルーターにドリルをつけてやっていましたが、回転の熱で溶けたプラスチックがドリルに引っ付いてしまうので、キリに変更しました。

    f:id:k-aeg:20151218174954j:plain

    ヒートンを穴に挿します。そのままだとずっぽ抜けてしまうことがあるので、瞬間接着剤で固定します。

    f:id:k-aeg:20151218175022j:plain

  3. 顔貼り

    転写シートに印刷した顔を貼っていきます。顔の周りのフチを少し残して切り取り、本体に貼ってから水に濡らしたティッシュなどで押さえつけます。十分に水分が浸透したら、滑らせるようにして裏紙を取り除くときれいに転写されます。印刷面が見えない状態で位置合わせが必要なので、蛍光灯で透かしながら合わせてやります。

    f:id:k-aeg:20151221230653j:plain

  4. ニス塗り

    転写シートは素のままでは耐久性が低いので、顔周辺に耐水性のニスを2度塗りします。

    f:id:k-aeg:20151222022817j:plain

  5. ストラップ装着

    ヒートンにストラップを装着して本体は完成です。

    f:id:k-aeg:20151123225020j:plain

  6. パッケージング

    布で汚れを取りつつ、バリの取り残しなど最終チェックします。

    f:id:k-aeg:20151222123822j:plain

    OPP袋にラベルシールを貼ります。ラベルシールはインクジェットプリンタで印刷して、裁断機で程良い大きさに裁断してあります。

    f:id:k-aeg:20151223190713j:plain

    袋を閉じて完成です!立体物を収めるので、キレイに閉じるのは案外コツが要ります。なるべく袋の上のほうに活っちゃんを寄せて、平らな面積を増やした状態で閉じるとうまくいきます。

    f:id:k-aeg:20151223191013j:plain

販売開始

ディスプレイ用の小物は100均で揃え、ポスター部分は奥さんが作ってくれました。 最初の販売場所は、西ノ島町観光協会さんに委託販売をお願いして、別府港ターミナルにて販売中です。

f:id:k-aeg:20160207172448j:plain

まだオフシーズンですが、わりと好評いただいているようで、第一陣は無事完売しました。

やってみた感想

比較的簡単なストラップでも、いざ作ってみると検討すべきことは沢山あるし、一工程増えるだけでもかなり作業が大変になったりします。巷にはモノが溢れていますが、そういった過程を体験すると、一見簡単そうに見えるものも様々な判断や工夫が積み重なって作られているんだろうな、と想像することができて感慨深いものがあります。一方、数十〜数百個規模の量産であれば、3Dプリンタで量産まで対応できるケースは結構ありそうだなとも思いました。素材が限定されたり、大物のプリントに時間がかかったりといったデメリットはあるものの、ロットを気にせず完全に受注生産できるので、材料のロスや在庫リスクもないため、小さく始めやすいというのもあります。また、サイズ変更や微修正が容易なので、製品のバリエーションを出しやすいのもメリットです。小型CNCフライスでの金属部品、電子基盤の切削加工などを組み合わせれば、デスクトップでもかなり幅広いものづくりができそうです。

今後の課題

  • 後工程の手作業が案外時間がかかるので、もう少し作業を最適化したい

    サポートの付け方を工夫するなどして、バリ取り作業を減らせないか思案中です。

  • 積層痕をなんとかしたい

    紙ヤスリで頑張って磨けば積層痕を消すことができましたが、かなり時間がかかるので全部手作業はさすがに採算が合いません。自動研磨機を作ろうかな...

離島子育て雑記 〜出産編〜

久々の更新となりますが、今月の頭に第一子が無事に誕生しました。 せっかくなので、隠岐・西ノ島での出産事情について記録を残しておこうと思います。

Term1: 妊娠期間中

産婦人科の妊婦検診

離島のお医者さんと言うと小さい診療所のイメージがありますが、西ノ島には隠岐島前病院があり、各科のお医者さんがローテーションで月に数回来てくれています。産婦人科医は月に2回の来島のため、検診はそのタイミングに合わせて行くことになります。お隣の海士町知夫村では診療所のみのため、島前地域の妊婦さんが全員同じ日に検診に来ます。なので、毎回けっこう混み合っていました(と言っても数人待ち程度ですが)。産婦人科の先生は夕方のフェリーに間に合うように診察を終える必要があるので、結構テキパキとした検診です。妊婦検診は全部で十数回行くことになりますが、費用は行政から配布される受診票を使うことでほとんどかかりませんでした。

行政のサポート

島前病院では出産はできないため、必然的に本土(松江)の病院または産院に行くか、里帰り出産かという2択となります。そのため、出産予定日の約1ヶ月前には本土に移動しての待機が推奨されています。このあたりが離島出産のネックですが、西ノ島では移動などの費用として出産準備金10万と、宿泊に関して補助金(または提携ホテルでの割引)が用意されており、かなり手厚いサポートが受けられます。

また、島根県からは「こっころカード」というものが配布され、本土までのフェリーでは2等料金で1つ上のランクの席(混雑していないのでゆったり座れます)に乗船できたり、協賛店で各種割引を受けたりすることができます。今回は島根県松江市に滞在しましたが、飲食店などは協賛店が多く割引率も高い印象で、なかなかありがたいサービスです。

Term2: 本土での出産待機

職業柄PC一台でできる仕事がほとんどなので、今回は夫婦で松江に渡りました。滞在先は西ノ島町と提携しているレインボープラザというホテルにしました。このホテルは妊婦滞在用の部屋(和室 or 洋室)があり、自炊設備があるので滞在中の食費も抑えることができます。部屋は広くはないですが、トイレ、風呂などもキレイで快適でした。また、妊婦滞在用にバリアフリー仕様になっていたり、緊急時の呼び出しスイッチが設置されていて安心でした。ただし、和室はインターネット環境がないので少し困った*1のと、せんべい布団だったのでちょっと背中が痛くなりますが、フロントで毛布を借りられるので敷布団の上に敷いたらなんとかなりました。がっつりインターネット使って仕事する時は、島根大近くの「たちよりkitchen」というカフェに入り浸ったりしていました。Free Wi-Fiあり、作業しやすい机でかなり居心地が良いです。ホットケーキやカレーなど、料理もおいしいです。

レインボープラザは松江駅から遠くて不便かと思いきや、数百メートル圏内にスーパーや外食チェーン、服屋などなんでもあるのでかなり便利な立地です。ちょっと足を伸ばすと松江城や県立図書館に行けるので、運動がてらの散歩コースとしてもなかなか良かったです。

http://seene.co/s/e86iLVseene.co

Term3: 入院〜出産

産院は無痛分娩ができるところに行きたい、という奥さんの希望で城北産婦人科クリニックになりました。妊婦さんは全室個室で、毎食豪華なごはんがでます。その割に費用は安く、無痛分娩費用を除くと出産育児一時金として支給される42万から少し足が出る程度で済みました。先生の診察も丁寧で、助産師さんもいろいろとサポートしてくれるので、入院中は快適に過ごせたようです。出産時は一緒に立会いましたが、出産の部屋も病院然としないように工夫されていて、なるべくリラックスして臨めるような配慮がされていました。

Term4: 帰島

出産後、自分は家を片付けるために先に帰島して、その後のサポートは出産前日に来てくれた義母にバトンタッチしました。出産後の入院期間は5日間で、基本的に母子同室です。ごはんは相変わらず毎食豪華で、お祝い膳も鯛が出たようで喜んでいました。入院期間中は助産師さんに授乳、オムツ替え、沐浴などの一通りのお世話を教わって過ごしていたようです。入院期間後、帰島のために新生児を連れてバスやフェリーで4時間ほど移動が必要なので、そこが心配点ではありましたが、義母にも交代で面倒を見てもらったりで、無事に西ノ島に帰ってきてくれました。

Term5: 自宅でお世話開始

自宅でのお世話が始まりました。奥さんは2ヶ月の産休、自分は家で仕事しているので、二人で適当に家事やお世話を分担しています。 ベビー用品は日用品的なものは島内にありますが、ベビーバスなどの大物は売っていないので、ネットで色々と揃えました。

*1:スマホ向けには Softbank の Free WiFi が飛んでますが...