Blog

  • グルシェフの奇蹟を求めてを読んで、全く意味がわからなかった人の読書感想文

    グルシェフの奇蹟を求めてを読んで、全く意味がわからなかった人の読書感想文

    スピリチュアル界隈に対して特に興味もなかった。

    ある時友人からその本の存在を教えてもらった。スピルちゅある界隈の元祖みたいな本だという。『奇蹟を求めて』と言うタイトルにも惹かれて中古で買った。

    数年放置していたが金欠で手放すことになったので、勿体無いから売る前に読んでしまおうと思った。

    この本ではグルジェフと言う神秘主義者をウスペンスキーと言う記者が彼にまつわる話をまとめている。偉大な人物の話は本人が書くのではなく伝記として書かれることもあって、この構成はグルジェフの神秘性を高めるのに一役かっていると感じた。

    この本で初めて出てくる時系列は1914年のことだった。著者のウスペンスキーは東洋に旅をしていた。その後ロシアに戻り東洋で体験したことを話したりしていたようだ。そして15年にグルジェフにであう。グルジェフも東洋の神秘的な現象に触れておりそういったことを話していたようだ。

    ここまでで思ったのは西洋で産業革命が始まり急激に身の回りに機械的なモノが増えていく中で、人間が元々持っていた魔力性みたいなものに幻想を抱くようになったのではないかと思った。私は2023年の日本に住んでいるが、映画や漫画等のエンタメの中でアマゾンの秘境には超人的な身体能力を持っていたり謎の呪術が使えたりする描かれ方があるような感覚が、世界の情報を得るのが難しかった時代にその感覚が増幅されたような感じなのだろうかなと思った。

    この本で紹介されていくグルシェフの思想や論理展開は全く理解できなかった。アストラル体という概念があったり、ドレミファソラシドの音階を宇宙と照らし合わせて何かを紐解こうとしていた。

    グルシェフは教えの中で科学と言う言葉を繰り返し用いていた。20世紀の初頭の西洋の一般の人々の中には今では疑似科学というようなものを漠然と信じているような状況だったのだろうなと思った。

    グルシェフの言葉の中で不死性への道といった話もあった。これは昔は苦行や瞑想、植物といった身体機能の拡張、人からより高位な存在になるための手段を模索していたが、それが技術の発展によってその手段を科学、薬へ求めるようになったのではないかと思った。そしてそれが現代ではコンピュータの発展をその手段にしているのではないかと思った。

    グルシェフの神秘性を増やすための行動も面白かった。わざと急に会合の時間を決める(当日とか)ことによって、他の予定をキャンセルしたり、たまたま運よく近くにいたりしないとみられない状況を作ることで講演に貴重性を持たせていたらしい。グルシェフは「人は簡単に手に入るものを有り難がらない」的なことを言っている。

    全体を通して、今も昔も人の悩み、地位や死後のこと性的なことなど生きていると関わってくる悩みはずっと変わることなくさまざまなものに救いを求めているのだと思った。また神秘的な振る舞いで人を先導させるような術は故意に作り出せるのだなというのも改めて思わされる本だった。

  • Swift Ui で音楽再生をするには?

    Swift Ui で音楽再生をするには?

    やろうとしたこと

    アラームの機能やBGMを設定で変更できる動作を実装したい!

    解決方法

    Bundle .main.urlを使う。

    以下のような感じでOK

    @State private var alarmSoundName: String = "bell"    
    var endAlarm: URL {
        return Bundle.main.url(forResource: alarmSoundName, withExtension: "mp3")!
    }
    func playAlarm() {
        do {
            alarmPlayer = try AVAudioPlayer(contentsOf: endAlarm)
            alarmPlayer?.play()
        } catch {
            print("Sound playback failed.")
        }
    }

    この方法だとAssets.xcassetsの中にあるものは呼び出せないのが注意

    ワイはSounds みたいな名前のフォルダを作ってそこにまとめて格納したよ。

    試したこと

    最初は画像の取り出しと同じようにAssets.xcassetsにmp3を保存して NSDataAsset で呼び出そうとしていた。

    以下コードのように実装しようとしたところアウト⚠️

    @State private var alarmSound: String = "bell"
    let endAlarm = NSDataAsset(name: alarmSound)!.data

    Swiftのコードでは、NSDataAssetを動的に生成する際に変数(Variable)を使うことはできないらしい。

    NSDataAssetの初期化はコンパイル時に行われる必要があるため、変数を使用して動的に生成することはできない。

    そこでBundle.main.urlを使った呼び出しではStateを使えたのでうまくいった。

  • Cooking with ChatGPT 01

    Cooking with ChatGPT 01

    冷蔵庫の残り物でChatGPTにレシピを提案してもらったよ。
    基本そのままにちょっとだけ改変しました。

    質問内容は下に書いた感じです。鶏肉って書いたけど、豚肉だったのに後で気づいた。

    冷蔵庫にトマト、ナス、えのき、卵、鶏肉があります  一品だけメインの料理を作ろうと思います、どのようなメニューを作れば良いでしょうか。食材は使わないものがあっても良いです

    材料

    • えのき
    • トマト 中1個
    • ナス 大1個
    • 豚肉
    • にんにく
    • 唐辛子
    • リーリエ 一枚
    • 塩少々
    • 胡椒少々

    手順

    下ごしらえ

    豚肉は塩をまぶします。
    ナスは1cm代の輪切りに、トマトは粗めのサイコロ状に、えのきは軸をフォークでほぐして3等分にします。

    肉を炒める

    少量のオリーブオイルで豚肉を炒めます。

    野菜を炒める

    ナスは多めのサラダ油を引いて焼き目をつけます。

    良い感じに油を吸い取ったら他の野菜とみじん切りにしたニンニクを加えます。

    混ぜる

    肉と野菜に軽く焼き目がついたら混ぜ合わせます。

    水100ccとちぎった唐辛子、塩2つまみ、胡椒少々、ローリエ一枚を加えます。

    蓋をして5分弱火〜中火で煮込みます。

    完成!

    写真は Fujifilm X Pro2, XF35mm F2 で撮影

  • 鯉が泳ぐアニメーションを作る

    鯉が泳ぐアニメーションを作る

    AfterEffect で先日制作した鯉を泳がしてみました。

    制作工程

    Youtubeで鯉が泳ぐ動画のシークバーを戻したり進めたりを繰り返して
    鯉が泳ぐ動作をよく観察してから制作に取り掛かりました。

    完成品はこんな感じです。

    Illustratorでレイヤーを分ける

    のびの動作をした時の鯉をパスで制作していきます。
    斜め上からのビューを再現するために、おびれを上と下のパーツに分けることにしました。

    AfterEffects でアニメーションを作る

    動きを作る

    動きの動作を制作します。
    体、前ひれ、おびれの順に制作していきました。
    体は背骨に当たる箇所に沿ってパペットピンを打ち動きをつけていきます。

    一通りできたら繰り返しの処理をして泳ぎ続ける動作にしました。

    移動させる

    ペンツールで泳ぐ道筋を決めて、
    パスをコピーしたら
    鯉のトランジションに当てはめます。

    あとは書き出したら完成!

  • Character Animator でVtuberを作ってOBSで配信する

    Character Animator でVtuberを作ってOBSで配信する

    Character Animator で制作したものをOBSで配信するまでの制作の流れや作業について解説します。

    会社のマスコットやアプリのマスコットの制作およびアニメーションの作成、
    さらにはその後の生配信まで承っております。

    ご依頼はお問い合わせフォームでお願いします。

    制作の流れ

    簡単な動きのマスコットの場合下記工程で作っていきます。
    今回は1,2番の詳細は省略します。

    1. マスコット制作(Illustrator, Photoshop など)
    2. Character Animator で動きを設定する
    3. NDIツールの設定
    4. OBSの設定

    完成系は下のような感じです!

    マスコット制作

    今回はペンギンを作ってみました。レイヤーをきちんと分けておけばこの後の制作が簡単になります。

    NDI ツールのインストール

    下記リンクからNDIツールをダウンロードしてインストールします。M1 Mac での動作も確認済みです。

    NDI Tools: https://ndi.video/type/ndi-tools/

    Charactor Animator での設定

    Character Animator に取り込み動きの設定を行います。今回は動作の設定に関しては解説しません。

    配信を行う場合はシーンパネル右下の”ライブストリーム”のアイコンをクリックしてONにします。
    ライブストリームのアイコンを Cmd + Click で環境設定を開き、上記画像のように Mercury Transmit を有効にしてください。 また NDI Tool が正しくインストールされていればチェックボックスも表示されているはずです。

    また”ライブストリーム”のアイコン右にある背景のアイコンをクリックしてグリーンバックを設定しておきましょう。

    OBSで配信に Character Animator の映像を取り込む

    OBSのプラグインを使用してNDIを読み込もうとするとOBSのバージョンとプラグインのバージョンの相性によって上手く動作しない場合があるので、OBSのプラグインを使用しない方法を解説します。

    NDI Virtual Input の起動

    NDI Virtual Input を起動してください。
    NDI Virtual Input は NDI Tools をインストールすると一緒にインストールされるアプリケーションです。

    起動するとMacの場合メニューバーに”NDI”という表示がされますので、クリックしてください。
    クリックすると パソコンの名前.Local(Character Animator) という表示がされますのでそれをクリックして選択します。

    OBSで背景透過した映像を受け取る

    OBSを起動したらソースの追加ボタンを押下して、画像キャプチャデバイスを選択します。
    設定が開いたらNDI Video という項目が表示されているはずです。
    NDI Videoを選択しましょう。

    このままだとグリーンバックが表示されたままなのでクロマキーの設定をします。
    OBSでの背景透過はソースを右クリックしてフィルタを選択します。

    設定のポップアップが表示されたら、エフェクトフィルタに”クロマキー”を追加します。
    ここで色キーの種類を緑に変更したら背景が透過されるはずです。

    これで全ての設定は完了です。お疲れ様でした!

  • ロゴデザインの制作工程

    ロゴデザインの制作工程

    こんにちは!

    ロゴデザインの制作を請け負った場合の制作工程について紹介します。
    サンプルのためにロゴをデモで作ってみました。

    名刺やノベルティ、Webなどの媒体で使う場合はコーポレートデザイン(Corporate Identify)として詳細をまとめたガイドラインを納品いたします。

    制作の大まかな流れ

    大まかの流れは以下のように進みます。ご予算によって提案数や修正回数などが変わります。

    • ヒアリング
    • ラフスケッチ
    • 仮清書
    • 打ち合わせ
    • 修正(ご予算によって回数は変わります)
    • 最終調整
    • 様々広告媒体に対応したパターンのロゴの納品

    1 着想を集める

    今回は私の屋号のコイアイの文字遊びから始めます。

    濃藍、鯉、恋、愛

    など言葉に含まれてるシンボルや色のイメージ、企業であれば理念などから様々なイメージを集めていきます。
    この段階では本やインターネットからその事象にまつわる副次的なものまで探索していきます。

    2 スケッチ

    集めたイメージを紙にラフスケッチをしていきます。
    今回は鯉の柄をモチーフにすることにしましたので、抽象化してシンボルとして成り立つように特徴をとらえていきます。

    3 PCで再現

    イラストレーターを使ってスケッチしたロゴをベクターにします。
    また色や書体の構成などもシンボルに合わせて用意します。
    この段階でお客様にご確認いただき、問題がなければ次の工程に進みます。

    コイアイの場合は”鯉 eye”という言葉遊びから、歌川広重の浮世絵での鯉の目の描き方をモチーフにしました。
    他にも鯉の柄や目から着想を得たものも数案ベクター化します。

    またここで作ったものをGoogle Lensなどを活用して他企業等との被りがないかなどを検索していきます。
    今回作ったロゴの場合”真向い月に星”という家紋に使われるモチーフに類似していましたが、丸の大きさ等が違うことや商標として使われていないことから、このロゴで決定しました。

    利用場面の耐性を考慮する

    • 背景色の明度が低い場合のパターン
    • 白黒印刷のパターン
    • SNS等で正方形に収めるパターン
    • タイプ(文字)の組み合わせのパターン
    • 印刷時やWebでの色のパターン
    • 看板等にした場合破綻しないこと
    • グラデーションを用いた場合、単色でのバリエーション
    • ロゴアニメーションのバリエーション

    などお客様がロゴを活用する場面を想定して、様々な場面で破綻しない耐性の高いロゴになるように設計します。

    書体選定

    欧文書体と和文書体でそれぞれに合わせた書体を選定します。書体の制作された年代や制作者、国、制作された目的などを紐解きケースに最適なものを選定します。

    今回はパンフレットやWebで本文で使う書体選定を行います。今回はとにかくニュートラルなデザインを目指したためJust AnotherFoundryさんの制作する JAF Bernino Sans を欧文書体に設定しました。
    この書体は見出しとしての利用や本文での利用どちらでも良い効果があり、コンデンス書体などのバリエーションの使いやすさから使用しています。
    和文書体には本文で使っていて可読性の高いヒラギノ角ゴシックを設定しました。

    参考:https://justanotherfoundry.com/bernini-sans

    色彩

    複数色使う場合はカラーハーモニーを元に設計します。
    ボタンやタイトル等に使った場合などでも扱いやすいものを選定します。RGBやCMYKでの数値も設定します。

    今回は濃藍という和色を元にしています。

    4 微調整

    目の錯覚や黄金比、角の処理など細かな点を最適化していきます。

    5 おまけ

    ポールランドがIBMでの仕事の中で”IBM”の言葉遊びで”eye bee M”という目と蜂でロゴを表現したポスターがあります。

    参考IBM:https://www.ibm.com/design/language/ibm-logos/rebus/

    今回私が制作したシンボルも抽象度が高すぎるため、遊び心あるデザインとして藍色の鯉のシンボルも制作しました。

  • chrome のテーマ

    chrome のテーマ

    chrome のテーマを作ってみました。

    ウィンドウが透けてパソコンの壁紙がブラーがかかって見えたらいいなと思って作り始めたのですが、
    css とかで見た目をいじれるわけではなくJSONでプロパティに値を埋めていく形だったのでFigmaで画像を作ってよしなにしました。

    困っているのが検索バーのアイコンの色の指定のプロパティがよくわからず、みづらいこと……。 解決策がわかったら更新しようかな。

    テーマを公開するにあたり、クロームのデベロッパー登録をしたのですが5ドルだったので意外と安くて良かったです。

    作り方はZennにあげました、簡単だから公式のドキュメント見ればいいので要らなそうだけど、、

    https://zenn.dev/coiai/articles/fcdc3206488db5

  • HeadTower

    HeadTower

    コピー用紙にボールペンで書いたものをPCに取り込んでハイコントラスト化したイラスト。

  • heads.png

    heads.png

    顔がいっぱい重なったイラストです。

    https://suzuri.jp/coiai?locale=en
Home
About
Blog
Works
Contact