\\ uto //

UX Engineer at note inc. /Songwriter/Prev. Condé Nast 🇯🇵 WIRED-VOGUE-GQ

\\ uto //

UX Engineer at note inc. /Songwriter/Prev. Condé Nast 🇯🇵 WIRED-VOGUE-GQ

メンバーシップに加入する

手帳にささっと書きそうなことを書いていきます。 メモとか日記とか書きとめるところがないなあって思っていて。 暮らしのはなしとか、作ったもののこととか、むかしばなしとか。

  • メモのプラン📝

  • 猫のプラン🐈 🐈‍⬛

    ¥222 / 月

リンク

マガジン

  • noteエンジニアチーム 公式マガジン

    • 443本

    noteエンジニアの技術記事をまとめたマガジン。さらに技術記事を読みたい方はこちら→ https://engineerteam.note.jp/

  • デザインとAI活用 記事まとめ

    • 63本

    デザインとAI活用などの記事をまとめていくマガジンです。noteではプロダクトデザイナーを募集しています→https://open.talentio.com/r/1/c/note/pages/34186

  • デザインオプス 記事まとめ

    • 78本

    デザインオプスなどの記事をまとめていくマガジンです。noteではプロダクトデザイナーを募集しています→https://open.talentio.com/r/1/c/note/pages/34186

  • 作業用BGMみたいな

    作業や勉強のおともに、いろんなチルアウトを作ってみます。

  • UXライティング 記事まとめ

    • 49本

    UXライティングなどの記事をまとめていくマガジンです。noteではプロダクトデザイナーを募集しています→https://open.talentio.com/r/1/c/note/pages/34186

ウィジェット

  • 商品画像

    世界で一番美しい猫の図鑑

    タムシン・ピッケラル

記事一覧

PRベースのビジュアルリグレッションテストをStorybookとPlaywrightで実装する noteUIDev#3

Playwrightでスクショを自動保存してマスターデータの代替する noteUIDev#2

PRベースのビジュアルリグレッションテストをStorybookとPlaywrightで実装する noteUIDev#3

前回はPlaywrightでスクリーンショットを撮ってアーカイブする話をしました。 今回はPlaywrightのスクショ撮影を、Storybookに登録したStoryにおこなって、ビジュアルリグレッションテスト(VRT)をPull Request(PR)に対して実行して、コメントとして変更を通知する話です。 はじめに新しい機能の追加や既存のコードのリファクタリングなど、開発の過程でUIに予期しない副作用が発生することがあります。VRTはそういった副作用のうち見た目上の変化

Playwrightでスクショを自動保存してマスターデータの代替する noteUIDev#2

前回はFigmaでDesign Tokenを抽出する話を書きましたが、 今回は、UXエンジニアとしてプロダクトの課題解決に取り組んだ話です。 マスターデータがないnoteのデザインチームではFigmaでデザインデータを管理しています。デザイナーはそれぞれの施策をひとつのFigmaプロジェクトで作業して、4半期ごとに新しく作り変えています。施策ごとにそれぞれがページを作っていくので、手が入ったページやセクションのみがそのFigmaファイルに残されている状態になっています。