You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
この記事は、これまでにおもちゃラボで紹介してきたUnityのシェーダ入門記事40本のまとめです。 1日に5記事読めば7日間で読み切れるはず...今のところ(笑) シェーダって時々聞くけど難しそう・・・というイメージをお持ちの方も多いと思います。でも、Unityを使えばかなりのメンドウな部分はUnityにおまかせできちゃうので、本当に必要な部分のシェーダを書くだけでイメージ通りの絵作りができるようになります。 使用するシェーダ Unityで使えるシェーダにはsurfaceシェーダと頂点/フラグメントシェーダの2種類があります。ここではこの2つのシェーダの他、ライティング・ポストエフェクトの内容も解説しています。それぞれの各記事へのリンクを下にまとめておきます。また、Unity2018からはノードベースでシェーダを作成できるShader Graphという機能も提供されるようになりました。これか
80年代風作例。ユニティちゃんモデル及びシェーダーを使っています。© UTJ/UCL こんにちは! CL事業部の原です。 この記事は Tech KAYAC Advent Calendar 2019 の13日目です。 今回はUnityで80年代風を表現するということにチャレンジしてみました。 80年代風と言っても、レトロゲームを再現するという意味ではありません。 80年代風イラストの雰囲気を表現したいと思います。 80年代リバイバルブームとは ここ数年、80年代リバイバルな表現がファッションやデザイン、映画などでブームになっていたことはこれを読んでいるみなさんにも思い当たるところがあると思います。しかし、この現象を包括的にまとめたような記事文献は見つけることができませんでした。なので、個人的体験から80年代リバイバルブームを追ってみます。 80年代リバイバル表現との出会い:tofubeats
この記事はTech KAYAC Advent Calendar 2019の10日目の記事です。 こんにちは! jsdo.itでCreativeCodingの世界を知り、jsdo.itに惚れて入社を決め、jsdo.itの譲渡とともに入社し、jsdo.itの終了とともに退職した有給消化期間中の浅利(@kasari39)です! 今回はシェーダーの世界へ一歩踏み出してみませんか?という内容です。 *1 シェーダーコーディングの世界 作品例として手前味噌ですが、このような映像をシェーダーのみで生成できます。 http://glslsandbox.com/e#59292.1 http://glslsandbox.com/e#59293.0 これらは100行にも満たないシェーダーから生成されています。 こんな短いのにこんな豪華な見た目が出るなんて面白いですよね。 それでは一歩踏み出してみましょう! 開発
この記事ではUnityにおけるシェーダプログラムの読み方・書き方を解説します! その中でもUnity特有の機能であるShaderLabと、頂点シェーダ・フラグメントシェーダというものを中心に扱っていきます。 なお現在はShaderGraphなどのビジュアルエディタを利用することでシェーダプログラムを書かなくてもシェーダを作ることが可能です。 そんな時代ですがシェーダプログラムを読み書きできるようになっておくメリットも大きいので、今回はあえてビジュアルエディタについては一切取り扱いません。 Unityでシェーダの使い方は分かるけど、書いたことはないシェーダを編集しようと思ってファイルを開いたものの、ナンモワカランC#など、他のプログラムはある程度分かる(C言語が分かるとGood)ShaderGraphに対応していない環境(VRChat等)のシェーダを書きたい
画面写真をクリックするとサンプルのWebGLビルドに飛びます。 こんにちは。技術部平山です。 今日はシェーダでの精度指定について、地味なお話をいたします。 詳しいことに興味がなければ、 非常に簡潔にまとめられた記事 をLIGHT11さんが書いてらっしゃいますので、それを読めば足ります。 なお、この記事の結論を一言で言えば、「UVと位置にhalfを使うな」 です。 速度や電力も大事ですが、下手に攻めてバグる方が問題です。 サンプルのソースコードはgithubに置いてありますが、 今回に関してはサンプルを動かしていただけば十分かなと思います。 より詳細を知りたい方はご覧ください。 冒頭の写真について 冒頭の写真は、仮にシェーダでの浮動小数点数の精度が低かったらどんなことが起こるか? をシミュレートしたものです。 絵の左下がテクスチャ座標(UV)が(0,0)で、右上がだいたい(5,5)です。 右
とりあえずこの映像を見てください。 昨日の勉強会の懇親会中に20分間のライブコーディングでシェーダーを作りました! 初めて人前でコーディングをしたんですが、めちゃくちゃ楽しかったです!! (当日動かなかったpmod修正済です...) 差分 - q.x = abs(p.x ) - 10.; + q.x = abs(q.x ) - 10.;https://t.co/LH3TT4YzSU#klab_meetup pic.twitter.com/k61c3O2ZA1 — かねた (@kanetaaaaa) 2019年6月19日 20分間のライブコーディング映像フル 先日の #klab_meetup の懇親会で行った20分のライブコーディング映像を公開しました! 実況解説は@gam0022 さんと@songofsaya_さんです 突発ながら面白い実況で場を盛り上げてくださって非常に楽しかったです!
Unity でシェーダプログラミングを始めたいけど、公式の資料や散見する様々な資料では難しいという人に対し、小さく、簡単に、サンプル付きでまとめた資料です。 総ページ数:99 本文中のサンプルはオープンソースで管理しています。合わせて購入の検討に利用してください。 https://github.com/XJINE/UnityShaderProgramming_03_Sample 資料の内容この資料では、シェーダのもっとも基本的な使い方である「シェーディング」について解説します。光の当たる部分は明るく、当たらない部分は暗く描画し、反射の程度によって物体の材質を表現する技術です。 この資料の目標は、シェーディングに必要となる基本的な概念を理解し、さらに高度な資料やシェーダプログラムを読み進めることができる程度の知識を共有することです。 内容は基本的なものから始め、歴史的経緯を交えつつ、順を追っ
はじめに 「UnityShaderCheatsheet」はシェーダのチートシートです チートシート(引用)
初めに 身も蓋もないけど、これが使えるならそれが一番。 https://docs.unity3d.com/jp/460/Manual/script-EdgeDetectEffectNormals.html やろうとしてるのは、↑これと同様の手法です。 経緯 アウトライン、すなわちオブジェクトの輪郭を描くための Unity シェーダーを探していましたが、この記事を書いた時点ではネット検索の上位に引っかかるのは、「オブジェクトを膨らませて二度描きする」方法でした。 例えばこの記事の最初に紹介されてる方法です。 http://light11.hatenadiary.com/entry/2018/05/13/183314 しかし、実際やってみるとこの方法は問題があって、ちょっと複雑なシーンになるとうまく行かなくなることがわかりました。 それで、同記事にある3・4番目のポストエフェクトを使う方法を調
「Shaderって何それ?」ってレベルから、Shaderを雰囲気で理解できるレベルになりました(多分) ここまで到達できたのは、”間違いなく”先人たちの最強すぎる情報のお陰様です。 そんな役立った有用すぎるShader学習リンクを紹介していきます! 2019/3/19 追記 まんてらさんによるシェーダーの解説スライドを追加しました! シェーダーについて無知であっても、噛み砕いて解説してくださっております。シェーダー学びたい初心者は必見です! 対象レベル Vertex/Fragment Shader(頂点/フラグメントシェーダー)を一から学ぶ予定の方 Shaderやろうとして、何度も挫折した方 Shaderを雰囲気で理解してみたい方 ※注意 Geometry ShaderやCompute Shaderは含まれていません。理由は私がまだ使えないからです(^p^) こちら扱えるようになったら、ま
こんなステージで作っていきたいと思います。 完全なBaked Lightmap、リアルタイムライトは無し。 反射 ガラスに反射は必須なので Reflection Probe で反射を入れることになりますが、 よりガラスっぽく見せるためのコツがあります。 それは、反射素材に強烈な光源を入れる事です。 背面とのブレンド方法を乗算にする 赤いガラスを作ってみたいと思います。まず単純に Surface Shader の色を赤に変更すると。。。 全く変化がありません。 これは、部屋のライティングが理由です。 冒頭で述べましたが、この部屋は完全にライトマップ化されており、 リアルタイムライトが1つもありません。 Surface Shader はライトに影響するシェーダーなので、 ライトが無い = 真っ暗 となり、いくら色を変更したところで画に影響が出ないのです。 そこでポイントライトを1つ置いてみます
2018/06/26 歴戦のシェーダ強者が集った「リアルタイムトゥーンシェーダー徹底トーク」~Unite Tokyo 2018レポート(4)~ ユニティ・テクノロジーズ・ジャパン主催の技術カンファレンスUnite Tokyo 2018内において、「トゥーンシェーダートークセッション#1『リアルタイムトゥーンシェーダー徹底トーク』」と題して、トゥーンシェーダの技術的なトピックに関する講演が行われた。規定時間を大幅に超えて熱い議論が交わされた本セッションの様子をレポートする。 TEXT&PHOTO_神山大輝 / Daiki Kamiyama(NINE GATES STUDIO) EDIT_小村仁美 / Hitomi Komura(CGWORLD) ●Unite Tokyo 2018レポート記事一覧 Unite Tokyo 2018が東京国際フォーラムで開催--ゲーム分野にとどまらない広がりを見
4/10 にサポーターズCoLab勉強会で「楽しい!Unityシェーダーお絵描き入門!」という講演をしました!内容はフラグメントシェーダで2Dの絵を描くための入門的な考え方を紹介するというものです。 当初の定員20名に対して150名近い申込みをいただきました。ありがとうございます。 supporterzcolab.com スライドはGifアニメが多かったのと(Gifアニメを動く状態で公開できるスライド共有サイトが少ないことに驚きました)、スピーカー ノートで内容を追ってもらえれば資料として分かりやすいと思ったので Google スライドでそのまま公開させていただきました。 入門向けの内容になりますが、興味があればぜひご覧ください。 シェーダーお絵描き入門勉強会の資料を公開しました🙇 #spzcolabhttps://t.co/kwRANl48uC— setchi (@setchi) Ap
自己紹介 名前: notargs 作ったもの LGTM Shaders CRT Shader 今回話す内容 ?「Game Jamでプログラマーのみのチームになってしまった…」 ?「Game Jamでプログラマーのみのチームになってしまった…」 ?「音楽素材どうしよう…」 ?「Game Jamでプログラマーのみのチームになってしまった…」 ?「音楽素材どうしよう…」 @「それ、シェーダーで作れますよ!!」 メリット プログラマーだけで楽曲制作が完結できる OpenGLとPCMにさえ対応していれば動くため、移植性が高い プロシージャルなので圧縮率が高い デメリット 高度な知識と実装力が必要 めんどくさい 手法 Transform Feedback 頂点シェーダでの計算結果を頂点バッファオブジェクトに再度格納する機能 CPUからアクセス可能 Transform Feedback 頂点シェーダでの
予習復習を兼ねてスライドをまとめてみました。 4日くらいでガサッと作ったので、まだまだまとめきれていない項目やそもそも書いていない項目も多いです(途中で書くの飽た)。 なのでちょっと時間を置いてからまだ書けていない項目についてもまとめたいなぁと思います。 また、間違い等ありましたらご指摘くださると幸いです(多分めちゃくちゃ間違ってる)。 記事書いていろいろと整理できて、前よりもUnityでシェーダー書くのがとても楽しくなりました。 今後追加したいと思っている項目 ポストエフェクト Unity5のDeferred Rendering(G-Buffer) ComputeShader CommandBuffer
この投稿はUnityAdventCalender2014 14日目の投稿です。 標準シェーダーを改造しよう まずUnityのダウンロードページのここからシェーダーをダウンロード 今回やること ダウンロードしてきたシェーダーの中のデカールシェーダーを改造してみる。 標準のデカールシェーダーがやれること ・ベースのテクスチャの上に違うテクスチャを重ねられる。 やりたいこと ・3枚のテクスチャを重ねてみたい 素材はジュエルセイバーの素材を使ってます。 ここにある3つの素材を こうします シェーダーを改造する 改造元のシェーダーはこれ Shader "Decal" { Properties { _Color ("Main Color", Color) = (1,1,1,1) _MainTex ("Base (RGB)", 2D) = "white" {} _DecalTex ("Decal (RG
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く