子供向けアニメ『ブルーイ（Bluey）』を大人も観るべき理由 - マルシテイア
最高に面白いけど日本ではあまり知られていない子供向けアニメ『ブルーイ』について、大人だけどほぼ毎日観ている僕が魅力を解説します。 皆とブルーイの話がしたい！ 『ブルーイ』ってどんなアニメ？ 公式Webサイト (https://bluey.tv/) より抜粋 『ブルーイ（Bluey）』は、オーストラリアに住む犬の女の子ブルーイの日常を描く、未就学児向けのショートアニメ。 妹のビンゴや両親と一緒に過ごしたり、友人たちと遊ぶようすが様子が描かれています。 1話7分程度のため、サクッと観られるのも魅力の一つ。 人気エピソードの一つ「プール」がYouTubeで全編公開されているので、ぜひ試しに観てください。 www.youtube.com 制作はオーストラリアのLudo Studio。当初はオーストラリア国内で放送され、その後Disney+で全世界に配信されました。 そのクオリティの高さから子供だけ
色、ムズ〜〜〜〜 - マルシテイア
本記事は、先日開催されたKyoto.js 19のために用意したLT資料に加筆したものです。 kyotojs.connpass.com こんにちは、天城です。 最近はWebGLで動画編集アプリを開発しており、Webでの色の扱いについて日々苦しんでおります。 この記事では、僕が最近知った色関連の小ネタを共有します。 目次 話題1: mix-blend-modeにaddがない そもそもBlendingって何？ Webでは基本的にsource-over compositingしか使われない Canvasではsource-over以外のCompositingが使える PDF Reference 一方その頃WebGLは…… 話題2: Display P3 CSS Color 4でDisplay P3が使えるようになった Display P3 CSS Color 4 CSS Color 4 で導入された
インドのスタートアップ企業に日本からフルリモートで参加している - マルシテイア
入金通知に落書きする娘 9月から、InVideoというインドのスタートアップ企業で週3日/フルリモートで働いている。 たまたま声をかけてもらったレアケースなので再現性はないと思うけど、誰かの参考になるかもしれないし、現在までの経緯や感想を書いておく。 誰？ 経緯 働き方について スタートアップってこういう感じなのか〜 インド企業の面白さ 海外企業にリモートで参加する難しさ 英語 時差 手続き系 まとめ 追記 (2021-11-25 11:16) 書きそびれた小ネタ コメントへの返信 誰？ 天城孝義、京都在住のフリーランスプログラマーです。 Webサービスのプログラマー、Unityプログラマーを経て、2020年4月からフリーランスとして働いています。 最近では、主にReact/Next.jsを使ったSPAの開発や、WebGLアプリ開発などの業務を行っています。 Twitter: @amagi
Ethics Processing Unit - マルシテイア
AIの事なんもわからんけど暑くて眠れないのでメモ 今日の計算機はアートを行うところまで来た 3DCG, GAN,トゥーンレンダリング 創るためのAI 古典的な計算機/AIは、答えや目的のある問題を解く アートや「面白い」AIは、人間が評価できる問題に挑戦する アートの美しさ、面白さは人間が評価する では、人間が評価できない問題については？ すなわち、善悪、倫理について いわゆるAI倫理（AIの使い方の倫理的側面についての議論）ではなく、AIが倫理をやる 倫理をやる、とは 人間は、ある行動/問題の倫理的側面について議論を行う AIが倫理について議論を行えればよい 人間は結論だけをみて評価を行えないので、AIの思考経過を見て、人間社会に合致するかどうか判断を下すことになる とはいえ、功利主義に則れば倫理も定量的な評価が可能になる？ 倫理ベンチマークを回すことになる トロッコ問題みたいな倫理クイ
VIRTUAL ART BOOK FAIR 2020のWebGL開発を担当した - マルシテイア
2020-11-16〜2020-11-23 に開催された VIRTUAL ART BOOK FAIR の Web サイト開発を担当した。 また、イベントの一環として、開発の裏側についてYoutube Liveで話したりした。 https://2020.virtualartbookfair.com/ www.youtube.com この記事では、プロジェクト参加の経緯や開発のすすめ方、僕が技術的に頑張ったことについて振り返る。 VIRTUAL ART BOOK FAIR とは 世界観ができるまで 開発の体制 技術的な構成 技術的に頑張ったこと 文字表示 パフォーマンス調整 ロード時間短縮 並列ロード 画像を GLB にまとめる やってないこと GPU インスタンシング Tree Shaking 感想 VIRTUAL ART BOOK FAIR とは 毎年開催されている TOKYO ART B
娘を1024回揺らすと寝る - マルシテイア
娘を1024回揺らした— 𝘼𝙈𝘼𝙂𝙄 (@amagitakayosi) 2020年3月7日 娘、1024回揺らすと大体スヤァ……と眠ってくれる。 僕は娘を寝かしつける時に何回揺らしたかを数えている。歩数計や加速度センサーを使うなんてハイテクな事はしておらず、すべて手で数えている。 とはいっても、1回1回指折り数えている訳では無い。娘は子守唄を歌うと安心して寝てくれる確率が上がるため、基本アドリブでオリジナル子守唄を歌いながら揺らすことになるのだが、この子守唄を何回ループしたかを数えて計算している。 1024回だとこんな感じ。 一番よく使うオリジナル子守唄はこんな感じ。 飽きるので適当にアドリブで歌ったりするんだけど、なんだかんだいつもと同じ歌を歌うと安心してくれる気がする。 回数を数えるメリット・デメリット 子を揺らした回数を数える事で、以下のようなメリットがある。 イライラしな
OSSのJSONエディタをElectronアプリに移植した - マルシテイア
josdejong氏作のJSONエディタを、Electronでデスクトップ用アプリに移植しました。 github.com 元のJSONエディタはこちら。めちゃ高機能で便利。 僕が書いたコードはたった200行くらいです。 github.com なぜ作った 仕事でイベント用のUnityアプリを作る事が多い 現場でパラメータを調整するために、パラメータをJSONやCSVファイルに出しておくことが多い SRDebuggerとかでアプリ内に設定画面を作る事も多いけど、その時間すらない事もある プログラマー的にはJSONを使いたい プログラマー以外の普通の人にとっては、JSONの編集は難しい CSVはエクセルで編集できて便利という世界観 普通の人が使えるJSONエディタがほしい オンラインJSONエディタは良い奴がたくさんある exeで欲しいんだが！！！ Electronでラップしたら良いのでは？ E
Reactで画像やテキストにWebGLエフェクトをかけるライブラリ作った - マルシテイア
amagiです。先日React用コンポーネントライブラリのREACT-VFXをリリースしました。 REACT-VFXを使うと、画像や動画、テキストにWebGLでエフェクトをかけることが出来ます。 ⚡𝙍𝙀𝘼𝘾𝙏-𝙑𝙁𝙓 released！⚡ I created React components to add WebGL effects to images, videos and plain texts in your app. It also supports animated GIFs...😎 Visit website for details:https://t.co/mlnmExpUVZ#REACTVFX #WebGL #React #Threejs #GLSL pic.twitter.com/uDUQ8MKNcK— 𝘼𝙈𝘼𝙂𝙄 (@amagitakayos
Kyoto.js 17を開催しました - マルシテイア
2020-01-11 (土)、Kyoto.js 17を開催しました。 少し時間が空いてしまったけど、僕の個人的な振り返りを書いていきます。 Kyoto.jsとは 資料まとめ 僕の発表について 個人的振り返り 良かった所 問題点 まとめ Kyoto.jsとは Kyoto.jsは京都のWebプログラマーやデザイナーのためのコミュニティです。 年1～3回のペースでゆるりと開催しています。 .js と言っているとおりJavaScriptがメインですが、あんまりJavaScriptに関係ない話でも面白ければOKという体でやっています。 開催は京都ですが、毎回なぜか大阪や神戸、名古屋、たまに東京の人も来てくれています（本当にありがとうございます！） 今回は株式会社はてなの京都オフィスで開催しました。 資料まとめ kyotojs.connpass.com Twitterで補足できた分だけまとめました。
サマソニでVJしてきた - マルシテイア
8/17(土)、SUMMER SONIC OSAKAでTOKiMONSTAのVJを担当しました。 随分時間が経ってしまったがメモ。 誰？ 天城孝義 (@amagitakayosi) 元Webプログラマー、現Unityプログラマー 趣味 / 副業でVJやってます。 KUAN🇨🇳 x amagi🇯🇵 #dommune #livecoding #veda pic.twitter.com/6nGRVY7rIV— BRDG / VRDG (@tokyomax) 2019年3月21日 経緯 8月某日、BRDGのF氏からオファーがあった。 👮「8/17ひま？」 ぼく「はい！」 👮「サマソニでVJしない？」 ぼく「はい！！！！！！！！！！！！！！！！！！！！！１１１」 聞けば、Keijiro氏(@_kzr)がTOKiMONSTAのVJをするのだが、もう一人サポートでVJを探している、とのことだ
はてなブログのテーマを自動リロードしながら開発できるツールを作った - マルシテイア
Sass/Lessでテーマを書いて、リアルタイムで確認しながら開発できるツールです。 github.com 目次 インストール 使い方 hbt の使い方 0. 開発用ブログを作成する 1. テーマの雛形を作成する 2. 開発用ブログにCSSが読み込まれるようにする 3. テーマを開発する 4. 完成したテーマを出力 インストール 動作にはNode.jsが必要です。 未インストールの方はこの辺からインストールしてください。 https://nodejs.org/ja/ ターミナルで以下のコマンドを実行すると、 hbt コマンドがインストールされます。 npm install -g @fand/hatena-blog-theme-boilerplate 使い方 hbt の使い方 0. 開発用ブログを作成する テーマの開発には、開発用のブログを開設しておくと便利です。 既存のブログをエクスポート
Kyoto.js 13開催レポート & 次回予告 - マルシテイア
こんにちは！ Kyoto.js主催の id:amagitakayosi です。 先日開催した Kyoto.js 13 のレポートをお届けします。 kyotojs.connpass.com 今回は京都だけでなく、なんと東京や長野から来たという方もいらっしゃいました（ありがとうございます！！）。 発表内容もユニークなものが揃っています！ 当日の様子はTwitterのハッシュタグ #kyotojs でご覧になれます。 発表資料 「Live Coding on Atom」amagitakayosi 「煩悩の数だけRefluxを回そう(仮)」kamiyam 「type of typing typescript type」hiroqn 「煩悩レスなコンポーネントテストを目指して」bokuweb 「Reason」kuy 「Gyazoのフロントエンドから煩悩を取り払えているのか」pastak LT資料 「
スクリーンショット/GIFアニメ作成技術が集まるスレ - マルシテイア
お題「スクリーンショット/GIFアニメ作成技術が集まるスレ」 最近、仕事でも趣味でもスクリーンキャプチャしまくっている。 結構いろいろツール使ったりしてるので、メモっとくと需要あるかなって。 マイお題も作ったので、皆さまのGIFアニメ作成技術やこだわりを投稿してくれると助かります！😸 目次 キャプチャツール GIF Brewery 3 Quicktime Player Licecap 編集/軽量化 Gifsicle ezgif.com ffmpeg その他小技 キャプチャデバイス買おうか迷ってる キャプチャツール GIF Brewery 3 gifbrewery.com macOS向けの高機能なGIF作成/編集ツール。 スクリーンを撮影するだけでなく、Webカメラや動画ファイルからGIFアニメを作成できる。 フレームレートやスピードを簡単に設定できる上、軽量化もできる。 仕事で開発中の画
AtomでVJできるパッケージを作った #GLSL #livecoding - マルシテイア
GLSLでVJやライブコーディングができるAtomパッケージを作りました。 その名も VEDA !!! atom.io この記事では、VEDAの使い方や機能を説明します。 目次 このパッケージでできること 機能一覧 インストール glslangValidatorのインストール VEDA本体のインストール 使い方 今後の開発 このパッケージでできること AtomでこんなVJができちゃいます！ My first VJ live coding pic.twitter.com/j66MFGZfFO— amagi (@amagitakayosi) 2017年7月31日 この動画は、先日僕が VEDA を使ってVJした時のものです。 動画素材や画像素材をロードしつつ、GLSLで加工したり動きを付けたりしています。 動画素材をロードしてMIDIコントローラーで操作きるので、コードをほぼ書かずにVJするこ
TidalCyclesでライブコーディングに挑戦しよう⚡ - マルシテイア
とにかくこの動画を見てくれ！ TidalCycles、めっちゃ簡単にBreakcore/Mashcore作れてテンション上がってきた pic.twitter.com/kVpnxE9u3T— amagi (@amagitakayosi) 2017年6月23日 ライブコーディングでフレンチコアもできる時代@tidalcycles pic.twitter.com/hgFHfY7rNW— DJ SHARPNEL@VR (@sharpnelsound) 2017年6月25日 たった20~30行くらいのプログラムで音楽がつくれる！ それがTidalCycles！ この記事ではTidalCyclesについてザッと紹介し、さっきの動画で演奏している内容について解説します。 僕自身もTidalCyclesに入門したばかりなので、TidalCycles仲間が増えたらいいなって思ってます😸。 対象読者 音楽が
毎日GLSLでアニメーションを作ってる - マルシテイア
最近GLSLやWebGLの世界に入門して、毎日こんなアニメーションを作っている。 4月末、東京に出張する機会があり、ついでに何か面白いイベントや展示がないか探していると、チャネルというイベントを見つけた。 以前から気になっていたBRDG/VRDG方面のイベントらしい。 会場は六本木のSuperdeluxe。出張先のオフィスからも近いので、少し早退して行ってみる事にした。 そこではハードな電子音に合わせて、GLSLやHaskellのライブコーディングによるVJが行われていた。 先週末に開催したチャネル#16 のライブ映像を公開しました。 https://t.co/YgpC3YYC0B #unity3d #tidal #maxmsp #tokyo #BRDG #livecoding #kodelife pic.twitter.com/rWaHodipUA— BRDG / VRDG (@toky
シェーダーからGIFアニメを生成するツール作った - マルシテイア
github.com シェーダーは、本来は3Dプログラムで物体に影をつけたり、視覚的なエフェクトを与えるための仕組みだ。 しかし、シェーダーだけで複雑なグラフィックを表現する事もでき、GLSL SandboxやShadertoyには大量の作品が投稿されている。 今回は、フラグメントシェーダーのファイルからGIFアニメを生成するツールを作成した。 これを使うと、冒頭のGIF動画のようなものが作ることができる。 また、npmパッケージになっているので、フロントエンド開発のフローに沿ってシェーダーのサムネイルを作成できる。 実装はgistに転がってたスクリプトを参考にしている。 offscreen rendering with three.js and headless-gl, in coffee-script · GitHub 使い方 npm install -g glsl2img すると、
expo.ioを使ってリアルタイムにReact Nativeアプリを開発する - マルシテイア
1年ぶり3度目のReact Native入門してるんだけど、expo.ioっていうサービスがメッチャ便利そうだったので紹介します。 何がどう便利かっていうと、 ケーブルなしで、実機の動作確認ができる もちろんコード変更も即座に反映される 開発版アプリの配布がワンタッチでできる 便利なReactコンポーネントもついてくる youtu.be expo.io とは React Nativeでのアプリ開発を支援するサービスです。 公式サイトはこちら。めっちゃ素朴…… expo.io expoは create-react-native-app XDE expo client といったツールを公開しています。 create-react-native-app: アプリの雛形を作るCLIツール XDE: アプリ開発を支援するデスクトップアプリ。実機のログをみたり、アプリを再起動したりできる expo cl
Scala入門としてCLIツールを作り、Scala.js, React, ScalaCSSでサイトを作った - マルシテイア
fand.github.io 今年2月からScalaのチームに異動し、Scala入門している。 2月中はゆっくりコップ本を読んでいたのだけど、やっぱり手を動かさないと自信が付かないので、何かツールを作る事にした。 ついでにGitHub PagesもScala.jsやScalaCSSで実装してみた。 つくったツール github.com !!! 実用性は度外視しています !!! レポジトリをまるごとコピーしてくれるやつ。 ブランチを移動する度にコンパイルで時間かかるのを回避するため、ブランチ毎にコピーしたらいいのでは、という発想（上手く行ってるかはわからない……）。 手で cp -r するのが一番はやいし、ツールを作るにしても普段だったらJSで書くとこだけど、今回はせっかくなのでScalaでCLIツールを作ってみた。 使い方 brewでインストール可能。 $ brew tap fand/cl
ハンズオンを円滑に進めるテク - マルシテイア
新人教育の時期ですね。 みなさん研修資料の準備は大丈夫ですか？ 僕はこの前Reactのハンズオンをやったんだけど、そこで心がけた事や学んだ事を共有します。 ハンズオンの内容については既に記事を書いたけど、細かい所を書ききれなかった。 amagitakayosi.hatenablog.com 新人研修やインターンでも使えるテクでなので、ご参考に。 やったこと 最初に完成形を提示する ハンズオンで作るアプリについて、動画で説明した。 最終的な目標がわかると、今やっている作業の意味がわかりやすくなる。 いくつかのステップに分けて説明する 今回のハンズオンでは、8つのステップにわけて実装を進めた。 ステップ毎にテーマを与える事ができるし、ハンズオン自体の進捗もわかりやすくなる。 ステップ毎に足並みを揃える ハンズオンでは、一度置いていかれると追いつくのが難しい。 参加者の進捗は頻繁に確認すること。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
