DEV Community

Cover image for 😎✨ My UX Portfolio: The Real Me, Unfiltered!
Satty
Satty

Posted on

😎✨ My UX Portfolio: The Real Me, Unfiltered!

Hi DEV Community! πŸ‘‹

I'm Satty, a UX Engineer from Japan.

As someone who works at the intersection of UI/UX design and engineering, I often find that resumes alone don’t fully communicate my thinking process or design intent.

So, I decided to create a portfolio site β€” not just to show what I’ve built, but to share the why behind it.


πŸŽ‰ Here’s My Portfolio!

πŸ‘‰ satty-portfolio.vercel.app

It’s mobile-friendly, lightweight, and yes β€” it’s in English, as I hope to connect with people around the world!


πŸ› οΈ Tech Stack

Purpose Tool
Framework Next.js (App Router + TypeScript)
UI Library MUI (Material UI)
Deployment Vercel (GitHub integrated)
Contact Form Google Forms (serverless setup)
Analytics GA4 (Google Analytics 4)

The goal was to keep the structure lightweight and easy to maintain.

By using Google Forms, I created a functional contact form without needing a custom backend.


✨ Highlights & Design Choices

πŸ”Ή UX-first Structure

Before writing any code, I mapped out the goals:

Who will visit this site? What do I want them to know?

Whether you're a hiring manager, a fellow developer, or someone looking for UX ideas β€” the site is structured to guide you smoothly.

πŸ”Ή UI Consistency & Mobile-first

The entire site is styled using customized MUI themes.

From typography to spacing and color palette, everything follows a consistent logic. It’s also fully responsive, with a mobile-first hamburger menu.

πŸ”Ή GA4 Integration

I implemented Google Analytics 4 to track key user actions:

page transitions, scroll depth, form submissions, and more β€” so I can continue improving based on actual behavior.

πŸ”Ή Adding a Bit of Fun

While keeping things clear and functional, I also wanted the site to feel fun β€” not overly formal. You’ll find little bits of humor scattered throughout.


πŸš€ What’s Next?

  • I plan to write articles sharing my UX decisions and implementation tips
  • I’ll be experimenting with UI tweaks based on user behavior
  • Eventually, I hope to turn this into a mini UX case study series

πŸ’¬ Feedback is Welcome!

Thanks so much for reading.

The site is still evolving, so if you have feedback, suggestions, or even just reactions β€” I’d love to hear them.

Feel free to reach out via the site’s contact form or drop a comment here!

πŸ‘‰ satty-portfolio.vercel.app

Let’s keep making the web more thoughtful, one experience at a time.

β€” Satty

Top comments (0)