アーカイブ
-
Three.jsでWebGPUを使う|WebGPURendererへの移行ガイド
みなさんこんにちは。フロントエンドエンジニアのしゅん(@shun_webdesign)です。 前回、TSLとは?WebGPU時代の新しいシェーダーの書き方という記事で「これからはWebGPUの時代だよ」という話をしました …
-
TSLとは?WebGPU時代の新しいシェーダーの書き方
みなさんこんにちは。フロントエンドエンジニアのしゅん(@shun_webdesign)です。 最近、僕はXでThree.jsのシェーダー作品をちょこちょこ投稿しているんですが、その多くを「TSL」というもので書いています …
-
【まとめ】Three.js入門完全ガイド|記事一覧・学ぶ順番つき
みなさんこんにちは。フロントエンドエンジニアのしゅん(@shun_webdesign)です。 僕は普段、Three.jsを使ってブラウザで動く3D表現を作っていて、その作品をXでも発信しています。最初は「3Dってなんか難 …
-
ブログをリニューアル。Astro + WordPress headlessに移行した理由と技術スタック紹介
はじめに このたびブログ「ShunNote」をリニューアルしました。 見た目のデザインを一新しただけでなく、裏側のシステム構成も大きく変えています。以前はWordPressをそのまま使っていましたが、今回は Astro …
-
【完全ガイド】Webデザインのアイデアを収集する方法【2026年版】
みなさんこんにちは。フロントエンドエンジニアのしゅん(@shun_webdesign)です。 「良いデザインが作れる人」と「そうでない人」の差は、センスよりもインプットの量と仕組みにあると僕は思っています。引き出しが多け …
-
Lottieでグラデーションを使ってアニメーションを作る裏技2つ
みなさんこんにちは。しゅん(@shun_webdesign)です。 皆さんはLottieをご存知でしょうか?なめらかなアニメーションをサイトに実装でき、手軽にリッチな表現を取り入れることができます。 LottieはAft …
-
【インタビュー】フロントエンドエンジニアのリアルな実情を聞いてみた
みなさんこんにちは。しゅん(@shun_webdesign)です。 今回はフロントエンドエンジニアのyukiさんにこれまでのキャリアやお仕事などのお話をお伺いしました。 Web3大アワードと言われるFWAを受賞しているエ …
-
Next.jsとReact Three Fiberのポートフォリオを公開するまでの裏側
みなさんこんにちは。しゅん(@shun_webdesign)です。 先日、作成したポートフォリオサイトをSNSで公開しました。(※現在は非公開) 今回は僕が公開したポートフォリオについて紹介していきたいと思います。 ※コ …
-
プロトタイプで作るインタラクションアイディアXDUFes2022【XDデータ有】
みなさんこんにちは。しゅん(@shun_webdesign)です。 12/3(土)に開催された「XDUFes2022」に私が登壇しました。 今回は当日のセッション内容について紹介させていただきます。 当日視聴できなかった …
-
Lottieの作成からコーディングまで実装方法をまるっと解説
こんにちは。Webデザイナーのしゅん(@shun_webdesign)です。 軽量のWebアニメーションが作れる「Lottie」をご存知でしょうか? 近年、Adobe XDでも使用できるようになりリッチなアニメーションを …