Baku Hashimoto

橋本 麦

Displacement Effectsが楽しいアーティスト

メモ. 書き足していく.
ビデオ, 写真, ジェネ問わず.

Arnaud Laffond

Mau Morgo

Kenta Cobayashi

Nic Hamilton

Phillip Stearns

WordPressのテーマをJadePHPで開発

最近Web作る調子上がってきたのでポートフォリオを一新したんですが, gulp, webpack, stylus, ES6, JadePHPあたり使ってつくりました. Jade自体がテンプレートエンジンなんで, WordPressのphpテンプレート関数との相性が悪かったりしますが. そのあたりメモ.

インストール

npmから. gulpで使ったんで, 僕はこっち使った, gulp-jade-php. 書いてある通りだけど, コンパイルしたら拡張子もjade→phpに変わります.

テンプレート

WP側のテンプレート階層を使わず, index.phpから全切り替えしてる. 考え方としては, JadeになるたけPHPを入れず, こまいのは全部関数として別途phpにまとめる. グローバルヘッダーとか, メタ情報とか, 全ページ必ずインクルードするって分かりきってるとこは, Jade側でまとめてやって, 動的に切り替える部分だけget_template_part()使う.

index.jade

- require('includes/view.php');
doctype html
html
    head
        include ./jade/_meta.jade
    body
        include ./jade/_gheader.jade

        .content
            - if (is_page('about')) :
                - get_template_part('page/about');
            - elseif (is_home()) :
                - get_template_part('page/work-list');
            - else :
                - get_template_part('page/post');
            - endif;

        footer.gfooter
            - if (is_single()) :
                - edit_post_link();
            - endif;

        script(src='#{template_path}/js/highlight.pack.js')
        script(src='#{template_path}/js/bootstrap.js')

_meta.jade

meta(name='twitter:image:src' content='<?= og_image(); ?>')

title <? title() ?>

view.php

<?
// ...
function title() {
    echo wp_title('|', true, 'right')  . '麦 : Baku';
}

function og_image() {
    if (is_single() && get_post_type() == 'work') {
        $path = MultiPostThumbnails::get_post_thumbnail_url('work', 'wide');
    } else {
        $path = "/wp-content/themes/baku89-2016/img/ogimage.jpg";
    }
    echo "http://$_SERVER[HTTP_HOST]$path";
}
?>

テンプレート関数使えよ, って感じだけど面倒いからそのまま.

Shortcode

あんま, HTMLの文字列とPHPのコードを "<dl>" . $title . "</dl>"みたいな感じで繋げたくなかったから, Shortcodeも無理やり分離. 例えば.

functions-shortcode.php

<?
// ...
function shortcode_vimeo($atts) {
    extract( shortcode_atts( array(
        'id' => '',
        'src' => null
        ), $atts ));

    $embed_url = "//player.vimeo.com/video/$id?title=0&byline=0&portrait=0&color=ffffff";
    $is_work = get_post_type() == "work";

    ob_start();
    include(locate_template('partials/vimeo.php'));
    return ob_get_clean();
}
add_shortcode('vimeo', 'shortcode_vimeo');
?>

vimeo.jade

一部省略.

a(class='embed embed--vimeo <? if ($is_work) echo "wide" ?>')
    img.full(src='<?= $src ?>') 
        iframe(data-src='<?= $embed_url ?>' frameborder='0' allowfullscreen='' webkitallowfullscreen='' mozallowfullscreen='')
        .center-button
            .center-button__body
                .center-button__text PLAY

phpが公開側フォルダ, jadeがソース系まとめたフォルダに分離しちゃうんは気持ち悪いし, phpもsrc側置いてコピーするのもアリだけど, めんどかったからそのままにした.

OUT OF DOTS

3年振りのOUT OF DOTSでPARKGOLFさんのVJさせて頂きました. DOMMNUEでSetsuya Kurotaniさん, Beyond Code #2でlycoriscorisさんのVJもしつつ, ちょくちょくバージョンアップさせてった感じです.

最近実験してた, Feedback Displacementを無理やりVJしてます. MPYNic Hamiltonリスペクト. 基本VJ用の動画素材作るのが苦痛なので, 僕のiPhoneに入ってた写真を適当に投げ込んでます. どんな画像でも, いい感じに抽象的なグラデーションになるんで面白い.

仕組み的にはoFとGLSL. カメラワークや3DモデルはC4Dから書き出してる. GLSLのビルドをGlslifyってWeb向けのツールでやってみた. Web向けなんで, oFのGLSLで動く組み込み関数で弾かれたりして, まだちょっとやりづらいけど, stackglのリソース使えるんでデカイ. gulpで監視して, ビルド終わったらgulp-oscでoFに通知出してofShaderでリロードしてたら, 比嘉さんに, 普通にファイルの最終更新日時引っ張ってた方が早いって教えてもらった.

VJネタとしてシンプル過ぎてキツかったんと, もっと照明的に気持ちよく効いてくるような作り方をしたいって反省はあるけど, もう少しこの手法を発展させて形にしたいなー思ってます.

SOURCE


Twitter投稿してくれてる人いた.

April 10, 2016

世の中の結構な割合のマナーが, 「別に知らなければ守られなかろうが何とも思わなかったけど, そういうものだと教えられて表面的に従っているうちに, 感情としてマナー違反を見るとムカつくようになってしまった人達」をムカつかせないために維持されているし, それがマナーを守る根拠たりえるのがこわい.

結構な割合の性的魅力も, それ自体が直接もたたらす「 天敵にくわれない程度に足が速い」みたいな実利的効用以上に, 「その形質がその社会において性的魅力としてみなされている」ということ自体が性的魅力を性的魅力たらしめている, ってのも似てる気がする.

こういうのをうまく抽象化して説明できる知識がないから辛いのだけど, なんてか, 最初は何か直接意味のある所から始まった概念が, フィードバック性を持ってその概念を補強し続けるうちに形だけが残って一人歩きしていくような現象が全体的にこわい.
非常識な行為を, 「非常識である」ということを根拠に批判するのとか, よくよく考えたらすごく奇妙なことで.

とはいっても, クチャラーへの嫌悪感が, たまたまそういう文化に生まれたから後天的に形成されたものに過ぎないんよって説明されたとしても, クチャラーが嫌なんは変わらないけど.

好きな地形の一覧

ベルチャー諸島

Belcher Islands

「島を描け」って言われても絶対描きそうにないフォルム暫定1位.

Shishaldin山

世界で最も円錐形に近い山. 競合としては「世で界最も円錐形に近い活火山」のMayon Volcanoがあるけど, こっちのほうが氷河に覆われていてなめらか感があって好き.

トレジャー島

Treasure Island

世界で最も大きな, 湖の中にある島の中ににある湖の中にある島. (the world’s largest island in a lake on an island in a lake.)

バロー岬周辺

ポイント・バロー – Wikipedia

北北西方向に揃った楕円の湖が無数. 永久凍土が溶けて出来たものらしい.

フィンランド湖水地方

フィンランドっぽい風景といったら湖水地方なんだけど, 地図でみるとすごく気持ち悪い.

ミシシッピー・デルタ

高校地理でも出てきた気がするので, メジャー. 世界で最も有名な鳥趾状三角州.

アフステルボス

アムステルダムの南. この辺りはこういうしましまが多い.

区画系

アメリカ的には,よくある住宅街だったりするのかもしれないけど, 根本的に区画設計の思想が違う所が好き.

ソウル. 敷地内の私道が毛細血管めいていて凄い.

平壌の風景といったらラウンド・アバウトのイメージがあるけど(偽凱旋門とか), こうやって見ても結構多い感じがする.

海上橋系

デンマークとスウェーデンが陸路で繋がっているのをどのくらいの人が知ってるんだろう, って思った.

有名なAtlantic Road. 世界のヤバイ道路のまとめ記事では常連だったりするけど, 上からみてもヤバイ.

海岸系

ロシアの飛び地. StreetViewで見た所ジメジメした森の狭い道なんで, 全然砂州感が無い.

最近NYの知人に教わった, Fire Island.

小学生の頃に行ったことがある. 結構先の方まで車で行けて, 先っちょの方は, 侵食されて枯れた森が海面から突き出しててかっこ良かった.

「腐海」. 実際にそういう名前の海で, 平均水深1mという浅さ故に夏場は暖まってとても臭いらしい. 衛星写真の毒々しさもすごい.

ストックホルムの東側. タービュレントディスプレイスメントを感じる.

向きの揃い方が好き.

好きな一覧の一覧

一覧の一覧 – Wikipedia.
Wikipediaカテゴリに限らずリストのあるページも含めて.

読み応え十分

おすすめ順に大体のランキングにしてある.

  1. 世界の極と端の一覧
  2. 心の哲学のトピックス一覧
  3. 雲形の一覧
  4. 数量の比較の一覧
  5. インターチェンジの種類の一覧
  6. 橋の種類の一覧 (英語)
  7. 子音の一覧
  8. 幽霊文字の一覧
  9. 効果の一覧
  10. 地図記号の一覧

次第点

個人的には好き

USBCNCの使い方でハマったポイント

Fusion 360のCAM機能で吐き出したツールパスをUSBCNCで読み込む際にハマったポイントをメモ. KitMill RD 300を使用.

参考記事

データより深く削り込まれる

Fusion 360での退避高さが必要以上に高く設定されていた. エンドミルが+Z軸方向に脱調したまま, (つまりソフトウェア上ではエンドミルがより高い位置に正しく移動していると認識された状態で)エンドミルが下がりはじめることが原因.

こちらの記事を参考に, 退避高さがフライス盤の制限高さを超えないように設定するか, ソフトウェアリミットを利用して, 自動で停止するようにする.

材料を固定している両面テープがエンドミルに巻き付いてしまう

CAM設定の「ボトム高さ」を, 1mm程度高めることで対応した. 硬い素材の場合は, 一番最後に細めのエンドミルで輪郭加工するといいのかもしれない. あと, くっついたやつは両面テープはがしで綺麗にはがせる.

切削開始する際に, エンドミルが変な位置に移動する

エンドミル位置を移動する際, アルミハンドルを使うと, USBCNC上での位置と実際の位置がずれる. ステッピングモーターは, 時計の針の「2分進める/戻す」のように, 現在位置からの相対的な回転指定しかできないので, 指で針を回すと時計が狂うのと同じことが起こる.

また, 複数のエンドミルを使いっている場合, 最初に一度原点に移動したのち(G28), ツールチェンジの為に一時停止するようになっている. あくまで原点であって, 切削開始位置ではないのがミソ. なので, (詳しい原理はわかっていないけれど)必ず以下の手順で切削開始したら大丈夫っぽい.

  1. 原点復帰
  2. 切削開始位置まで移動. エンドミルは各軸+方向に移動するようにする. つまり, 素材はテーブルより少し内側に配置する
  3. 各軸をリセット
  4. その状態で, USBCNCのAUTO -> RESETを実行. プレビューに, 原点の×印からいくぶんオフセットされた位置に, ツールパスが表示されていたら成功

ツールチェンジの仕方がわからない

  1. ツールチェンジのタイミングで大体原点復帰する
  2. 必要に応じて, ジョグで交換しやすい位置にエンドミルを移動
  3. エンドミルを交換
  4. 素材の削られていない部分の上に交換後のエンドミルを移動 (すべて削られている場合は, 適当な場所に未加工の素材を置く)
  5. 通常の原点設定と同じく, エンドミル固定ねじをゆるめ, 素材の上面にエンドミルがそっと触れる状態で再度固定
  6. Z軸のみリセットをかける

両面テープが巻き付く

「M3」がおすすめらしい. 紙の両面テープだと, エンドミルにひっついた時うまく剥がれない.

もし巻き付いた場合は, 一時停止. エンドミルを上げて, 剥がす. 下に下げて, 再開. その際, ジョグ操作でやって, 完全に一時停止した位置に戻してやんないと, エラーが出て再開できないので注意.

KitMill RD300を買った

メモ.

造形作家の平原真さんのブログを全体的に参考にしています.

CNCフライス盤KitMill RD300を購入

注文内容

以下の通り.

超硬スクエアエンドミル D=1~4 4種入り x 2
KitMill RD300 組み立てキット
安全カバー なし
ボールスクリュー化セット なし
原点センサーセット あり
アルミハンドル あり
3段プーリー あり
スピンドルモーター用コネクタ あり
セットスクリュー式スピンドル Φ4
アルミ製加工テーブル なし
薄型マルチバイス なし
TRA150 あり

組み立て

マニュアルを読みつつ.
結構情報がバラけてる.

Fusion 360でNCデータ出力

MeshCAM使うよかいろいろ応用出来そうだったので.
この辺りが参考になりました.

3・29

MoodHutのライブイベント, VJした.

Instagram

弊社オフィスでやったんで, なんかオフィスっぽい感じにしたくて. group_inou – EYEの制作でも活躍した, ENTTEC DMX USB PROを使って, DMX経由で照明のスイッチ入れたり切ったり. 電圧がたまんないとレイテンシが発生するみたいな変な事もあったけど面白かった. 相当蛍光管に悪いことをしてしてしまったけど.

ディスプレイの方は, 全画面でブラウザ表示させて, WebSocketで色データ送るだけ. 普通にグラデーションとかの映像素材作って, 各ディスプレイ側で, 映像のどの画素をスポイトするかを位置でしてやる. 何個でもディスプレイ増やせるから, 色々発展出来そうな気がする.

SOURCE

プロジェクトフォルダ

プロジェクトフォルダをどう整理するか, って問題.

基本構造

仕事用HDD

/Volume
    + Works
        + 20xx
            + 00_everydays
            + 01_work1
            + 02_work2

プロジェクト毎

01_work1
    + doc - 資料. シンボリックリンクでDropboxで共有
    + proj - プロジェクトファイル
    + src - 素材類
    + 0b - コードとか
    + capture - 収録素材
    + itm - ソフト間受け渡しの為の中間ファイル
    + render - 3DCGソフトでレンダリングした比較的大きな画像
    + out - 書きだしたチェック映像, カンプ画像

命名規則

案件名は3-6文字程の接尾語

例) eye, fhana, 0xff, fas

できるだけ頭文字が被らないように

キーボードでナビゲーション出来るから便利.

使用文字

a-z A-Z 0-9 _ |

例) test_1

情報の優先順位

  1. 案件名
  2. 何についてか
  3. コーデック
  4. 日付

例) fhana_offline_ProRes422HQ_0124.mov

結局どういうことか