ガレージ暮らしのトライタム

プログラムやツールの解説や技術を公開する場所

iPhone5の簡易修復

iPhone5を廃棄すると別の方が仰られたので、譲って頂きました。
ただ、スマホ上部のタッチパネルが浮き上がっておりガムテープで無理やり止められている状況だったので、それを修復しました。
この記事はそのメモ書きのようなものです。


予想された問題

タッチパネルが浮き上がる問題では、最初にバッテリーが膨らみが原因で起きると想定されます。
そのため分解用に以下のキットを購入しました

DIGIFORCE LPB-DIGI5 互換バッテリー 説明書・工具付 PSEマーク表示
Amazon CAPTCHA


想定していた問題と違った

分解に関する記事は沢山あるので割愛します。
f:id:traitam:20180808205348j:plain
f:id:traitam:20180808205513j:plain

画像のようにどんどんと分解していきます。
赤枠内はメインボードとタッチパネルを繋ぐフラットケーブルなので外さないように、壊さないように気を付けながら作業します。

が、想定していた「バッテリーの膨らみ」が全くなかったので別の問題でパネルが浮き上がったみたいです。

落下衝撃による歪みが原因だった

前の持ち主はそういえば落としてパネルが浮き上がったと言ってました。
どうやら、iPhoneが歪みその結果、接着剤が負けて浮き上がったようです。
また、接着剤も経年劣化で粘着力が落ちていたようです。
そのため、新規に接着剤で接着しました。


対策

自宅に手ごろな粘着テープが無かったので以下の接着剤を使用しました。

セメダイン 瞬間接着剤3000ゼリー状速硬化 P3g CA-154
https://www.amazon.co.jp/%E3%82%BB%E3%83%A1%E3%83%80%E3%82%A4%E3%83%B3-%E7%9E%AC%E9%96%93%E6%8E%A5%E7%9D%80%E5%89%A4-3000-%E3%82%B7%E3%83%AA%E3%83%BC%E3%82%BA/dp/B0751GGK7L

塗る前に汚れを取ります。その後に接着剤を塗る流れです。
接着剤は、一度爪楊枝に付けてから塗るようにしました。
塗る場所は、左上部はガラスパネルとくっ付いているアルミフレーム。右上部は筐体側にある接着部分です。

これで接着を待った後、組み立てればOKです。
もちろん歪みは直して無いので左右中央は少し浮いてます。
ただ、ガムテープに巻かれているよりかは幾分もマシになりました。

ガムテープで巻かれいた部分は、接着剤の残りがくっ付いていたので除光液で取りました。


残っている問題・やってしまった失敗

破損していたタッチパネルの修復

落下による破損で歪みだけでなく一部タッチパネルが効かなくなっていました。
これは直していません。別にそこまでコストかけても…。

本体の歪み

歪みも同様に直していません。
直す場合も内部のパーツをすべて取り外し、歪みを補正する必要が出てくるのでコストが…。

液晶内部にゴミが混入

ガラスパネルとフレームがくっ付いていないタイミングで掃除をしたので、そのゴミが内部に入り込んでしまったようです。
ただ、背景が暗いと全然見えないし、操作にも問題無いのでOKとします。

f:id:traitam:20180808210941j:plain


おわりに

こうして無事にiPhone5が復活しました。SIMは入ってないのでWi-fi専用機です。
今回みたいな簡単な機器の修理は楽しいですね。蘇ってくれる楽しさを味わえます。

VTuber向けLive2Dモデルについての思案

発端

このモデルが大変素晴らしく、また可能性を考えるきっかけになりました。

先のモデルの何に感銘を受けたか

まずはテンプレートになりつつある正面絵では無い事。
Live2Dモデルでは手始めに正面絵を作成することが多いです。
公式チュートリアルしかり、既存のモデル状況しかり。
実際、特定のポーズや状態を表すと汎用性に欠けるため正面モデルが無難なのかもしれません。

けれども先のモデルは汎用性を備えつつ正面モデルではない、ユニークに仕上がっています。
加えてFaceRigでのアニメーションやパーツ切り替えを駆使してより高品質になっています。
そして何より、角度Xのパラメータで2つの顔を動かすという発想が、あるようで無かった発想で驚きました。
すごい。

ほかにどのようなユニークモデルが作れるか?

では、先のモデルを参考にどのようなモデルが作れるか考えてみたいと思います。

操り人形型

f:id:traitam:20180804192517p:plain

糸によって吊られている人形が演じる実況。
正面モデルを踏襲しつつ、動きを人形にすることで独特な雰囲気が作れると思います。
ダークカラーの服を着れば怪しくも出来るし、パステルカラーのロリータを着ればふんわりした印象に。
糸の動かし方と、人形っぽい動きを入れることができれば、正面モデルを作ったことがある方なら作成可能かもです。
…というか操り人形は別にロリータモチーフじゃなくてもいい気が

ソファでくつろぎ美少女(斜め向き)

f:id:traitam:20180804192526p:plain

基本的には正面を見ないで画面見ていますよという印象を与えるモデル。
時折こちらを向いてドヤったり笑ったり、隣で美少女がゲームをしているという印象を与えるかもしれないモデルです。
顔の角度Xは0~30に作成して、0のデフォルトを斜めにすることで実現が可能だと思います。
またパーツの有無で以下のようにシチュエーションも変えられます。
  「これ?今日はコンタクトじゃなくてメガネしてるんだよ~」とか
  「今日はすぐ外出なので身支度整えるんだ~」とか
  「今日はOFF!飲み物お菓子携えてゲーム三昧!」などなど

2つ目は衣装変更なのでモデル制作のコストが上がりますが、眼鏡付けたり、横に飲み物お菓子を置く位ならパーツの有無で低コストで変化を付けられます。

これは
【セミナー】なぜ彼女たちは“こんなにも魅力的で可愛いのか…?” 開発者が語る『アイドルマスター』におけるイラスト制作の工程とは | Social Game Info
という記事内で言われている「1mの近さで見ている感覚」をイメージして構想が練られています。
特にVTuber界隈では「ガチ恋」という言葉もあるくらい、モデルに併せてその中の人に恋をしてしまう現象もあります。
ここでは、1mの近さで見ている感覚、というのが肝です。

斜め向きではなく真横~正面というモデルが作れるのならより良いのですが難易度がかなり高いです。
行った事ある方、挑戦してみたい方はいいかもです。
もし実現できれば、左右の動きが「前のめり/仰け反り」の動きになります。そうすることで顔だけでなく体を使って感情を表現できます。

その他モデルについて

正直「顔が正面、もしくは浅い角度で斜めを向いているモデル」であれば実況用などで使えると思っています。
特に「1mの近さで見ている感覚」はアイドルマスターの魅力で証明されているため、魅力的なモデル作成で有用と考えられます。
普通の正面モデルを作るのに飽きた方は、是非に。見てみたいです(他力本願)

それではみなさん、楽しい創作ライフを!

Cubism3SDKUnity内に含まれるサンプルの簡易説明

Cubism3SDKUnityにはR8時点で9つのサンプルが同梱されています。
シーンを再生すればすぐにフィードバックがあるサンプルから、コードを変更する必要のあるサンプルがあったりと色々なので簡素に内容をまとめようかな。という記事です。

Cubism3SDKUnityに同梱されているサンプル(バージョンR8時点)

f:id:traitam:20180728155953p:plain

R8時点では上記画像のように9つサンプルが同梱されています。
すぐに何をやってるのか分かりやすいのがAnimation、AsyncBenchmark、LookAt、Raycastingの4つだと思います。
この4つはシーンを開いて再生すれば、何をすればよいのか、何が行われているのか端的に分かりやすいと思います。

ほかの5つはソースコードを変更したり、エディタ上で変更を行うことで変化が得られる、Unityを触っている人向けのものになっています。
おそらく、全くUnityを触ったことが無く、かつCubism3SDK初挑戦だと、この5つのサンプルを弄っても“何のためのサンプルなの?”と首を傾げる可能性があります。

“とりあえず動くものを見てみたい”という方は、先に挙げた4つのサンプルのいずれかを閲覧すると良いかもしれません。
以下は各サンプルの概要です。

Animation

f:id:traitam:20180728155806p:plain

シーンを再生するとキャラクター(こはるちゃん)がアニメーションしてくれます。
可愛いですね。

AsyncBenchmark

f:id:traitam:20180728160627p:plain

ボタンを操作することでベンチマークを行うことが出来ます。
また、HierachyにあるSpawnerをクリックし、[ModelSpawner]->[Model Prefab]を変更することで表示するモデルを変更することが出来ます。

ほんの少し追加解説

Asyncと銘打たれている通り、Asyncで非同期処理を行って表示しています。
Unityで広く使われているコルーチンではメインスレッドを活用して非同期処理を実現していますが、Asyncの方は実際にスレッドを分けて処理しています。

Editor

このフォルダに説明テキストとImportCustomization.csの2つのみとなっています。
ImportCustomizationはモデルをインポートした際、モデルに独自変更を行う機能が書かれています。いわばモデルインポートにおける拡張機能のサンプルです。
使用の際は33行目の、コメントを外します。
f:id:traitam:20180728161541p:plain

コメントを外した後にモデルをインポートするとモデルが緑がかってインポートされるようになります。
右のモデルはコメントを外した後に、モデルをインポートした例です。(自動的にモデルはインポートされないので手動で行う必要があります)
f:id:traitam:20180728162126p:plain

もし、ロードタイミングが分かりにくい場合は36行目の下にDebug.Logで読み込まれたことを確認すると良いと思います。
注意:コメントを外した部分は確認が終われば、再度コメントアウトするようにしましょう。以降のモデルインポートで全てのモデルが緑色になります。

LookAt

f:id:traitam:20180728162504p:plain

キャラクターがLive2Dのロゴを見つめ続けるサンプルシーンです。
実際にこのように実装したい場合は以下の公式記事をご覧ください。
視線追従の設定 | Live2D Manuals & Tutorials

Masking

MaskTextureは原則共有されているから、もし独自に作りたい場合はMaskTexturePreviewから変更を行うと独自の変更が出来るよ。
…というサンプルシーンなのですが、イマイチ変更が上手く行きませんでした。

すいません、よく分からないので変化が見れる画像もありません。

Models

Maskingで使われているモデルと、サンプルシーン全般に使われているモデルが含まれています。
特にサンプルシーンも特別追加されたスクリプトなどは、ありません。

MultipleModels

f:id:traitam:20180728163126p:plain
f:id:traitam:20180728163130p:plain
複数モデルが存在するときにモデルの描画順についてのサンプルシーンとなっています。

基本状態ではキャラクターが前になっていますが、HierarchyのClippingを選択し
[Cubism Render Controller]->[Sorting]->[Order In Layer]の数値を変更することで描画順を変更することが出来ます。
例としてはCrippingモデルの方を“2”にすることで前面に来るようになります。
キャラクター(Koharu)と同じ数値である“1”を選択すると2つが混ざったような見た目になります。これは期待されない処理なのでそうならないように気を付けましょう。

PerspectiveCamera

f:id:traitam:20180728164052p:plain
f:id:traitam:20180728164049p:plain
Live2DではCamera設定はorthographic(Unity 2Dモードの標準設定)で活用されることが原則となっています。
しかしperspective(3Dモードの標準設定)で活用したい人に向けたサンプルになっています。

Live2Dモデルをperspective上で正しく描画させるには[Cubism Render Controller]->[Sorting]->[Mode]を[Back To Front Order]に変更する必要があります。
このサンプルシーンで[Back To Front Z]に変更すると描画が乱れることが確認できると思います。
ちなみにカメラ設定は[Camera]->[Projection]から確認することができます。

RayCasting

f:id:traitam:20180728164209p:plain

マウスでクリックした時に、マウス上にあったものを一覧で表示するサンプルです。
専門的に言うと、マウスクリック時にレイを射出し、レイにヒットしたDrawablesの一覧を表示するサンプルです。

おわりに

これでR8時点で含まれているサンプルの紹介は終わりです。
サンプルの詳細をもっと知りたい、という方は公式SDKチュートリアルへアクセスすれば大体は乗っていると思います。
TOP | Live2D Manuals & Tutorials

半分はUnity経験者向けのサンプルなので、割とハードルが高いサンプルですがこの記事がヒントになると嬉しいです。
それではみなさん、楽しい創作ライフを!

UnityのLive2DCubism3SDKでUserEvnetをインポートする時の注意点

motion3.jsonに設定されたユーザデータを取得 | Live2D Manuals & Tutorials

上記リンクのある通り、公式のSDKチュートリアルの通り行えば基本的には問題ありません。
ただ、「厳密に」上記の順番で行わないと問題が起きます。
今回はモーションにユーザーイベントを登録して検証をしています。

目次

どのような問題が起きるのか

f:id:traitam:20180725223051p:plain

順番を間違えると画像のようにイベントが登録されていないとエラーを吐かれます。

なぜこのような問題が起きるのか

Eventのハンドルもモデルをインポートした段階で登録されます。
そのため「Live2Dモデルのインポート」→「スクリプトにイベント登録処理を追加する」順番で行うとインポーターがイベントを拾えるが上手く追加できないという事態になります。

解決策

解決策としては「スクリプトにイベント登録処理を追加」→「Live2Dモデルをインポート」という順番を守ればOKです。
また先にモデルをインポートしても「モデルフォルダクリック」→「Reimport」で再度インポート処理を走らせれば対策できます。
モデルを再インポートした場合はアタッチが外れているので再度付け直しましょう。
解決されれば無事にDebug.Logが走ります。(例ではモーションの2か所にUserEventを登録しているため2つ出ています)
f:id:traitam:20180725224243p:plain


解決策が分かれば難しい問題ありませんが、分からないと何が原因か分からず最悪詰まる可能性があるかもしれません。
UserEventをUniyで扱う時は少し意識しておきたいですね。

それではみなさん、楽しい創作ライフを!

Live2Dにおけるアートメッシュとメッシュとポリゴンの違い

この区別が書かれたブログを見たことが無かったので記述します。(皆様知ってて実は必要なかったのかも…)

追記2019/01/27
公式が違いについての記事が追加されていました。
Live2D用語集 | Live2D Manuals & Tutorials

アートメッシュ

アートメッシュとはLive2Dで編集されるオブジェクトです。
公式では「メッシュが割り当てられた状態の画像」をアートメッシュと呼んでいます。
編集パーツ+対応したメッシュ=アートメッシュ、と考えると少しわかりやすいかもです
f:id:traitam:20180603224324p:plain

タイトルの3つでは一番大きな分類になります。
アートメッシュについて | Live2D Manuals & Tutorials

メッシュ

ポリゴンの集合体のことを言います。
実際アートメッシュに近いニュアンスになるかもです。
しかし、アートメッシュとメッシュは少し違うニュアンスになると思います。

ポリゴン

頂点3つで出来る三角形のことです。
Live2Dではこれを用いて変形をして、パラメータやアニメーションを作っていきます。

3つ違いについて

以下3つを集合で表すと図のようになります。
f:id:traitam:20180603225047p:plain

アートメッシュが一番概念としては大きく、続いてメッシュ・ポリゴンとなっています。
ポリゴンを構成するのは“頂点”となっているため、作成していく中では一番小さい概念は頂点となっています。
こまった時は「~~のアートメッシュ」と言えば問題無いと思います。

最後に

意識して使い分けたいもしくは厳密に区別する必要がある方向けという内容でした(マニュアルやリファレンスを外部に向けて書く方向け)。
が、意識すると分類が難しく感じ、また区別するための記事が見当たらなかったので書きました。
(正直通じれば何でもいい気がする)

HUION gt-220 v2(2048)でWinTab APIを使う

概要

  • タブレットの設定から「タブレットPCサポート」のチェックを外します。
  • ソフトではSAI2の場合は設定から「WinTab APIを使用する」設定にすればOKです。Photoshopは変更する必要はありません。
  • WinTab APIは解像度の違うディスプレイを使っている場合、座標がズレる問題が発生しました。もし2枚以上モニターを使用したいのであれば解像度を揃える必要があります。

WintabAPIを使用する

f:id:traitam:20180504171959p:plain
HUIONのドライバーから「タブレットPCサポート」のチェックを外します。
これだけでタブレットを使用するときにWintabAPIを使用します。
基本はこれでソフトも対応していますが、SAI2などソフトから明示的に使用するAPIを変える必要のあるものがあります。

SAI2の場合

f:id:traitam:20180504172009p:plain
ヘルプ > 設定 でウィンドウを開きます。
その後、一番上の「WintabAPIを使用する」を選択し、再起動すれば完了です。

WinTabAPI使用時にペン先がずれる

WintabAPIを使用時、SAI2やPhotoshopでペン先がずれる場合があります。
これは以下のように解像度の異なるディスプレイを使用している時に発生します。
f:id:traitam:20180504172231p:plain

もしWintabAPIを使用したい場合は解像度の違うディスプレイを外すと問題が解消されます。
f:id:traitam:20180504171855p:plain

縦横比が同じならば良いのかもしれません。片方を縦描画にしても問題は発生しませんでした。

ペンタブに使用するAPIについての概要

SAIやPhotoshop CS6 をWintabAPIで使用すると入力される情報が変になる(ペン先がずれる)ので情報を集めていました。
その中で、どうやら動作させるドライバーの種類があるようなのでまとめます。

APIとは

以下サイトではこのように記述されています。

APIとはApplication Programming Interfaceの略で、プラットフォーム側の汎用性の高い機能を外部から手軽に利用できるように提供する仕組みのこと。

www.idcf.jp

ペンタブを機能させるにもプログラミングが必要なわけで、そのプログラミングをしやすくするためのものです。
で、世の中には、このAPIが無数に存在しており、ペンタブレット周りでは2種類存在しています。それが、
WinTab API TabletPC API
です。

WinTab API

WinTab APIWACOMが提供しているAPIです。
wdnet.jp

SAI1やPhotoshop CS6 以前で、このAPIが使われているようです。

TabletPC API

TabletPC APIマイクロソフトが提供しているAPIです.
Tablet PC API Reference (Windows)

マイクロソフト全般のソフトによく使われているそうです。
SAI2やクリスタではこちらのモードが扱えるようです。