명확함과 정교함, 그리고
분명한 의도를 바탕으로
인터페이스와 시스템을 구축하는
엔지니어 백승엽 입니다.
인터랙티브 3D 포트폴리오 사원증 뷰어
PrecisionEngineeringInterfaceInteractionSystemsMotionClarityPrecisionEngineeringInterfaceInteractionSystemsMotionClarityPrecisionEngineeringInterfaceInteractionSystemsMotionClarityPrecisionEngineeringInterfaceInteractionSystemsMotionClarity
© Featured Projects 프로젝트
SCENE — 02
Selected Projects
Projects.
모든 프로젝트는 추상적인 비전을 직관적이고 매끄러운 사용자 경험으로 구현해 내는 과정입니다.
분명한 의도, 정교한 구현, 그리고 서비스의 완성도를 결정짓는 세심한 디테일을 바탕으로 바닥부터 견고하게 서비스를 구축합니다.
App Review Tracker
App Review Tracker
(01)Data Pipeline
KTI 홈페이지 리뉴얼
KTI 홈페이지 리뉴얼
(04)Website Renewal
렛츠오더
렛츠오더
(05)Landing & API
팜젠사이언스 홈페이지
팜젠사이언스 홈페이지
(06)Corporate Website
PPCWIZ
PPCWIZ
(07)SaaS Frontend
OBELAB NIRSIT 데이터 관리 시스템
OBELAB NIRSIT 데이터 관리 시스템
(09)Healthcare System
바나나맵
바나나맵
(10)Map Service
바닐라펫
바닐라펫
(11)Hybrid App
© Technical Skills 기술 역량
SCENE — 03
Stack
Skills.
프론트엔드를 중심으로 백엔드, 인프라, 디자인까지 서비스의 전체 생애주기를 다루는 기술 역량입니다.
단순한 도구 나열이 아닌, 실무에서 검증된 기술 스택입니다.
Frontend
TypeScript
JavaScript
React.js
Next.js
Zustand
React Query
Redux
Recoil
Tailwind CSS
SCSS / Sass
styled-components
Framer Motion
Three.js
Storybook
React Hook Form
Backend & DB
Java
Spring
Node.js
Python
Django
FastAPI
MySQL
MSSQL
DevOps & Infra
AWS
Docker
GitHub Actions
Nginx
Vercel
Tooling & Config
Git
Turborepo
pnpm
yarn-berry
Jest
Playwright
ESLint
Prettier
SonarCloud
CodeRabbit
Lighthouse
Google Analytics
Figma
AI Tools
Cursor
Claude Code
Codex
Antigravity
© Experience 경력 / 자격증
SCENE — 04
Practice
- Product Development
- Internal Systems
경력
(주) 나비이
2020.08 - 2025.08Frontend EngineerCo-Founder
2020.08 - 2025.08
Frontend Engineer
Co-Founder
(주) 딘코퍼레이션
2019.02 - 2020.06Frontend EngineerJunior
2019.02 - 2020.06
Frontend Engineer
Junior
(주) 딘코퍼레이션
2018.12 - 2019.01Frontend EngineerContractor
2018.12 - 2019.01
Frontend Engineer
Contractor
(주) 티몬
2018.07 - 2018.08Frontend EngineerInternship
2018.07 - 2018.08
Frontend Engineer
Internship
(주) 코아리버
2017.05 - 2018.06Full Stack EngineerJunior
2017.05 - 2018.06
Full Stack Engineer
Junior
자격증
정보처리기사
2015.10한국산업인력공단취득
2015.10
한국산업인력공단
취득
OCJP
2016.03Oracle취득
2016.03
Oracle
취득
© Help Center 도움말
SCENE — 05
Information
FAQ.
작은 결정들이 모여 더 나은 서비스를 만듭니다.
개발 과정에서 중요하게 생각하는 기준과 원칙을 정리했습니다.
© Final Section 에필로그
SCENE — 06
Epilogue
Simple Card Accordion
Responsive Box Model Design
Delivery Truck On Road Button
Glowing Gradient Button Effects On Hover
Notification Button Ui Design
Subscription Button With Regex
Moving Gradation
Rotating Polygons
Rotating Polygons2
Wavy Layer
Price Table User Interface Design
Zoom In N Out Image Card
Css Creative Checkbox Design
Css Custom Animated Checkbox
Css Custom Checkbox List Design
Glowing Checkbox Button Design
Animate Login And Sign Up
Input Label Slide Up On Hover
Simple Login Form Gradient Background
Transforming
Zoom In N Out
Folder Open Effect
Location Pointer Animation
Falling Arrow Effect 1
Falling Arrow Effect 2
Mouse Scroll Down Effect
Simple Input Text Box
Draggable Grid System With Gridster
Responsive Masonry Grid Layout Like Pinterest
Post List Ui Design
Style Lists With Css Hover Effect
Transforming Social Media List Toggle Icon
19 Simple Spinner Collections
Analog Clock Shape Loading
Bounce X Loading Animation
Bounce Y Loading Animation
Changing Shape Loading
Css Svg Following Spinner
Detached Diamond Loading Animation
Flip Loading Animation
Loading Page Similar To Windows
Netflix Logo Reveal Animation
No Freeze Spinner
Simple Square Point Loading
Spinning Square Svg Loader
Widget Spinner Loading
Animated Modal No Js
Moving Light Effects According To Mousemove
Sketchjs Mousemove Effects
Navigation Bar Like Apple Dot Com
Responsive Menu
Responsive Sidebar Menu For Mobile
Responsive Transparent Menu
Transforming Page Movement Navigation
Login Form
Neumorphism Card Ui Hover Effects
Responsive Page Use Media Query
Responsive Vertical Timeline Design
Vertical Timeline Design
Customize Scrollbar Using Css
Smooth Scrolling Effect
Trigger Css Animate On Scroll
Styling Dropdown Select Box
3d Responsive Touch Slider
Box Slider Hover Effects
Capture Effect Slider
Simple Vanilla Js Carousel Slider
3d Jumping Text Animation
Ghost Text Animation
Loading Text Animation Effects
Responsive Text Size
Shining Text Animation Effects
Stretch Motion Text
Text Filling With Water
Text To Smoke Animation
Wave Motion Text
Wavy Text Animation Effects
Product Slider Like Flipcart
Simple Jquery Photo Gallery
Tooltip With Social Sharing
Responsive Web Xypo
Simple Card Accordion
Responsive Box Model Design
Delivery Truck On Road Button
Glowing Gradient Button Effects On Hover
Notification Button Ui Design
Subscription Button With Regex
Moving Gradation
Rotating Polygons
Rotating Polygons2
Wavy Layer
Price Table User Interface Design
Zoom In N Out Image Card
Css Creative Checkbox Design
Css Custom Animated Checkbox
Css Custom Checkbox List Design
Glowing Checkbox Button Design
Animate Login And Sign Up
Input Label Slide Up On Hover
Simple Login Form Gradient Background
Transforming
Zoom In N Out
Folder Open Effect
Location Pointer Animation
Falling Arrow Effect 1
Falling Arrow Effect 2
Mouse Scroll Down Effect
Simple Input Text Box
Draggable Grid System With Gridster
Responsive Masonry Grid Layout Like Pinterest
Post List Ui Design
Style Lists With Css Hover Effect
Transforming Social Media List Toggle Icon
19 Simple Spinner Collections
Analog Clock Shape Loading
Bounce X Loading Animation
Bounce Y Loading Animation
Changing Shape Loading
Css Svg Following Spinner
Detached Diamond Loading Animation
Flip Loading Animation
Loading Page Similar To Windows
Netflix Logo Reveal Animation
No Freeze Spinner
Simple Square Point Loading
Spinning Square Svg Loader
Widget Spinner Loading
Animated Modal No Js
Moving Light Effects According To Mousemove
Sketchjs Mousemove Effects
Navigation Bar Like Apple Dot Com
Responsive Menu
Responsive Sidebar Menu For Mobile
Responsive Transparent Menu
Transforming Page Movement Navigation
Login Form
Neumorphism Card Ui Hover Effects
Responsive Page Use Media Query
Responsive Vertical Timeline Design
Vertical Timeline Design
Customize Scrollbar Using Css
Smooth Scrolling Effect
Trigger Css Animate On Scroll
Styling Dropdown Select Box
3d Responsive Touch Slider
Box Slider Hover Effects
Capture Effect Slider
Simple Vanilla Js Carousel Slider
3d Jumping Text Animation
Ghost Text Animation
Loading Text Animation Effects
Responsive Text Size
Shining Text Animation Effects
Stretch Motion Text
Text Filling With Water
Text To Smoke Animation
Wave Motion Text
Wavy Text Animation Effects
Product Slider Like Flipcart
Simple Jquery Photo Gallery
Tooltip With Social Sharing
Responsive Web Xypo
Simple Card Accordion
Responsive Box Model Design
Delivery Truck On Road Button
Glowing Gradient Button Effects On Hover
Notification Button Ui Design
Subscription Button With Regex
Moving Gradation
Rotating Polygons
Rotating Polygons2
Wavy Layer
Price Table User Interface Design
Zoom In N Out Image Card
Css Creative Checkbox Design
Css Custom Animated Checkbox
Css Custom Checkbox List Design
Glowing Checkbox Button Design
Animate Login And Sign Up
Input Label Slide Up On Hover
Simple Login Form Gradient Background
Transforming
Zoom In N Out
Folder Open Effect
Location Pointer Animation
Falling Arrow Effect 1
Falling Arrow Effect 2
Mouse Scroll Down Effect
Simple Input Text Box
Draggable Grid System With Gridster
Responsive Masonry Grid Layout Like Pinterest
Post List Ui Design
Style Lists With Css Hover Effect
Transforming Social Media List Toggle Icon
19 Simple Spinner Collections
Analog Clock Shape Loading
Bounce X Loading Animation
Bounce Y Loading Animation
Changing Shape Loading
Css Svg Following Spinner
Detached Diamond Loading Animation
Flip Loading Animation
Loading Page Similar To Windows
Netflix Logo Reveal Animation
No Freeze Spinner
Simple Square Point Loading
Spinning Square Svg Loader
Widget Spinner Loading
Animated Modal No Js
Moving Light Effects According To Mousemove
Sketchjs Mousemove Effects
Navigation Bar Like Apple Dot Com
Responsive Menu
Responsive Sidebar Menu For Mobile
Responsive Transparent Menu
Transforming Page Movement Navigation
Login Form
Neumorphism Card Ui Hover Effects
Responsive Page Use Media Query
Responsive Vertical Timeline Design
Vertical Timeline Design
Customize Scrollbar Using Css
Smooth Scrolling Effect
Trigger Css Animate On Scroll
Styling Dropdown Select Box
3d Responsive Touch Slider
Box Slider Hover Effects
Capture Effect Slider
Simple Vanilla Js Carousel Slider
3d Jumping Text Animation
Ghost Text Animation
Loading Text Animation Effects
Responsive Text Size
Shining Text Animation Effects
Stretch Motion Text
Text Filling With Water
Text To Smoke Animation
Wave Motion Text
Wavy Text Animation Effects
Product Slider Like Flipcart
Simple Jquery Photo Gallery
Tooltip With Social Sharing
Responsive Web Xypo
- UI Precision
- Motion Focused
보이지않는탄탄한구조와타협하지않는시각적섬세함을결합해밀도높은프로덕트를완성합니다.모든상태와전환을세심하게다듬어,어떤스크린에서든사용자가마주하는순간들이명확하고한결같으며흔들림없는의도를갖도록설계합니다.