西原 翼 フォロー

建築関係出身のインタラクションデザイナー。デザインとエンジニアリングのつながりを探求したい。現実と虚構の狭間も好き。趣味はCG、工作、料理など。

デザインとHTMLのズレを検出! Node.jsとPuppeteer活用のビジュアル校正テストで実装時のケアレスミスを防ぐ

デザインとHTMLのズレを検出! Node.jsとPuppeteer活用のビジュアル校正テストで実装時のケアレスミスを防ぐ

グーグルが開発した画像圧縮ツールSquoosh。フロント開発向けにNode.jsで扱う方法まとめ

グーグルが開発した画像圧縮ツールSquoosh。フロント開発向けにNode.jsで扱う方法まとめ

マイクロインタラクションからクリエイティブ表現まで!Tween24.jsを使った演出表現

マイクロインタラクションからクリエイティブ表現まで!Tween24.jsを使った演出表現

HTMLにちょい足しでできる! Vue.jsでサクッと動きをつける方法

HTMLにちょい足しでできる! Vue.jsでサクッと動きをつける方法

gapの余白指定が便利! gridとflexでできる新しいCSSレイアウト手法

gapの余白指定が便利! gridとflexでできる新しいCSSレイアウト手法

Canvasだけじゃない!requestAnimationFrameを使ったアニメーション表現

Canvasだけじゃない!requestAnimationFrameを使ったアニメーション表現

API通信一切なし!Nuxt Composition APIで作る完全静的サイト

API通信一切なし!Nuxt Composition APIで作る完全静的サイト

知らないで使うとトラブルになるかも…プログラム・画像のライセンス(概要編)

知らないで使うとトラブルになるかも…プログラム・画像のライセンス(概要編)

お問い合わせフォームのウェブアクセシビリティ対応の方法

お問い合わせフォームのウェブアクセシビリティ対応の方法

CSSを活用してHTMLのセマンティックエラーを指摘する方法

CSSを活用してHTMLのセマンティックエラーを指摘する方法

君は真に理解しているか?z-indexとスタッキングコンテキストの関係

君は真に理解しているか?z-indexとスタッキングコンテキストの関係

CSS疑似クラスを活用した、モダンでインタラクティブなフォームの作り方

CSS疑似クラスを活用した、モダンでインタラクティブなフォームの作り方

1歩踏み込んでみる! CSSグラデーションのマニアックな世界

1歩踏み込んでみる! CSSグラデーションのマニアックな世界

モダンなJSとCSSで作るライブラリ不要の全画面スクロール演出(2019年版)

モダンなJSとCSSで作るライブラリ不要の全画面スクロール演出(2019年版)

JSでのスクロール連動エフェクトにはIntersection Observerが便利

JSでのスクロール連動エフェクトにはIntersection Observerが便利