7년 차 · Frontend Engineer

이해람

사람을 생각하는 엔지니어

Email: sunlikeperson@gmail.com
Phone: 010-6776-7903
GitHub: github.com/hetarho
Portfolio: portfolio.haeram.me

Introduce.

7년 차, 사람을 생각하는 엔지니어 이해람입니다. 저의 실행 동기는 사람에 대한 관심에서 비롯됩니다. 동료에 대한 관심으로 팀에 맞는 개발 프로세스를 제안하고, 사용자에 대한 관심으로 기획과 UX에 주도적으로 기여합니다.

그 결과로 애자일 프로세스를 팀에 정착시키고 AI 기반 SDD(Spec-Driven Development) 프로세스를 도입해, 합류 전 6개월 이상 걸리던 개발 기간을 2개월로 단축했습니다. 또한 팀의 협업 툴을 기획부터 디자인, 구현까지 직접 맡아 현재 팀 전체가 사용하고 있으며, 사내 AX 우수사례로 선정되었습니다.

함께 일하는 동료와 사용자의 경험을 개선하여 궁극적으로 세상을 이롭게 하는 프로덕트를 만들고 싶습니다.

Experience.

2025.12 – 현재

Deepnoid

의료 AI 코스닥 상장사

의료 AI 제품개발팀|주임 / 개발 Lead

SDD 기반 팀 협업 및 의료 AI 제품 개발 프로세스 설계·정착
의료 AI 웹 제품의 프론트엔드 아키텍처 설계와 코드 품질 주도
제품 단위로 프론트엔드와 백엔드 경계를 넘나드는 풀스택 개발

2022.07 – 2025.11

Dyphi

저속 노화를 위한 헬스케어 스타트업

개발팀|매니저 / FE Lead

웹·앱 프로젝트의 프론트엔드 아키텍처와 개발 표준 설계
Next.js / React 기반 웹 제품 개발 및 유지보수
Flutter 기반 디지털 치료기기와 헬스케어 앱 개발 및 유지보수

2020.02 – 2022.06

SMIT

UI 프레임워크 개발 중소기업

UA팀|주임

순수 JS 기반 레거시 프로젝트를 자사 프레임워크로 마이그레이션
자사 프레임워크 UI 컴포넌트 개발

Project.

2026.02 – 현재

Yestion

팀 협업 툴

기획·디자인·풀스택 개발|React · MCP · SDD

PRD와 디자인 시스템에서 실행 가능한 Vite 프로토타입과 User Story를 만들고, Yestion MCP로 로컬 구현까지 연결했습니다.

6개월 → 2개월개발 기간
50% 이상 감소기획-개발 의사소통 비용
사내 AX 우수사례선정

PRD에서 실행 가능한 프로토타입까지 연결

기획자가 PRD를 작성하고, 디자이너는 AI가 화면 구현에 사용할 수 있는 디자인 시스템을 준비
기획자가 PRD와 디자인 시스템을 함께 사용해 실제로 실행되는 Vite 코드 형태의 프로토타입 생성
같은 PRD에서 User Story를 생성해 구현 단위까지 구체화

Yestion MCP로 스펙과 로컬 작업공간을 연결

Yestion MCP로 PRD, User Story, Vite 프로토타입을 로컬에 각각 파일로 내려받도록 구현
로컬에 내려받은 파일을 입력으로 삼아 자체 SDD 프레임워크에서 제품 코드 구현
문서, 디자인 기준, 실행 가능한 프로토타입을 한 작업공간에 모아 스펙과 구현 사이의 중간 전달 단계 제거

팀 구성에 맞는 협업 프로세스 정착

유료 SaaS를 대체할 스프린트 관리 도구로 시작해 기획·디자인·구현을 혼자 맡음
플래닝, 스프린트, 회고를 한곳에서 처리하고 기획·디자인·개발이 같은 스프린트에 참여하도록 구성
기획-개발 간 의사소통 비용을 50% 이상 줄이고, 기존 6개월 이상 걸리던 개발 기간을 2개월로 단축
팀 전체가 실제 업무에 사용 중이며 사내 AX 우수사례로 선정

2026.06 – 2026.08

DN-BS-01

AI 기반 뇌 위축 정량 분석 및 진단 보조 의료 서비스

개발 Lead · Full-stack Developer|WebGL · SDD · HTML to PDF

연구소의 뇌 위축 분석 모델을 로그인–워크리스트–뷰어–리포트로 이어지는 의료용 웹 제품으로 구현했습니다.

연구소 모델을 웹 제품으로 구현

연구소에서 개발한 뇌 위축(atrophy) 분석 모델을 로그인, 워크리스트, 뷰어, 리포트로 이어지는 제품으로 구현
워크리스트에서 검사 데이터를 선택하면 영상 뷰어와 정량 리포트 중 필요한 화면으로 이동하도록 동선 설계

WebGL 뷰어와 PDF 리포트 구현

팀이 자체 개발한 WebGL 의료 영상 뷰어를 라이브러리로 정리해 제품에 붙이고, 웹에서 분석 결과를 탐색할 수 있는 화면 구현
PACS 전송용 문서가 필요해 백엔드에서 HTML을 PDF로 렌더링한 뒤 프론트엔드에 전달하는 리포트 생성 과정 구현

Yestion과 SDD로 풀스택 개발

프론트엔드 아키텍처를 설계하고 Yestion에 정리한 제품 문서를 스펙으로 삼아 SDD 방식으로 개발
프론트엔드와 백엔드는 아키텍처 설계 책임만 나눴으며, 실제 기능은 파트 경계 없이 풀스택으로 구현
개발 Lead로서 코드 리뷰와 구현 방향을 조율하며 제품 전체의 코드 기준을 맞춤

2024.08 – 2025.11

SarcoFit

근감소증 치료를 위한 디지털 치료기기(DTx)

FE Lead|React · FSD · Connect-RPC · FSM · TDD/BDD

FE Lead로 아키텍처와 RPC 설계를 주도하고, FSD 도입으로 병합 충돌을 80% 이상 줄였습니다.

80% 이상 감소병합 충돌
20% → 70%AI 코드 채택률

프론트엔드 아키텍처와 RPC 설계

모노레포에서 병합 충돌이 잦아 팀의 인지 부담이 커졌고, 이를 줄이려고 FSD 아키텍처 도입
코드를 쓰기 전에 설계를 맞추는 절차를 세우고 FSD 구조를 정리해 병합 충돌 80% 이상 감소
Connect-RPC로 BFF Server와 React Web 사이의 RPC 인터페이스 설계 전담

팀이 함께 따를 개발 규칙 정리

컴포넌트 분리 규칙과 AI 룰을 문서로 남겨 공유. AI 코드 채택률이 20%에서 70% 수준으로 올라 팀 생산성도 높아짐
DDD(도메인 주도 설계) 기반 스크럼에서 유저 스토리 단위로 기능 개발
TDD/BDD 사이클에 맞춰 테스트 코드를 작성하고 비즈니스 로직 구현
복잡한 상태는 FSM으로 선언해 코드 복잡도를 낮추고 안정성 확보

2024.06 – 2025.06

화푸리

화병 치료를 위한 디지털 치료기기(DTx)

Frontend Developer|Flutter · Lottie

Figma 비숙련 디자이너와의 협업 방식을 다시 설계해 전달 관련 피드백을 절반으로 줄였습니다.

50% 이상 감소디자인 전달 관련 피드백

디자이너와 일하는 방식 정리

Figma가 익숙하지 않은 영상 디자이너에게 개발하기 좋은 전달 방식을 구체적인 예시와 함께 제안하고 실제 적용까지 지원
협업 방식을 꾸준히 맞춘 결과, 6개월 후 디자인 전달 관련 피드백 50% 이상 감소

UI / UX 구현

기획자·디자이너와 함께 화면을 설계하고 Lottie와 여러 인터랙션을 활용해 직관적인 UI 구현
애니메이션 피드백과 낙관적 업데이트 적용

2024.05 – 2024.11

SDM

AI 기반 류마티스 챗봇 유지보수

Frontend · Backend 유지보수|LangChain · GPT-4 · Sendbird · SSR

기존 설계 철학을 존중하며 Dialog Engine을 유지보수하고, 부분 SSR 전환으로 초기 로딩을 개선했습니다.

기존 설계를 해치지 않는 유지보수

DDD·클린 아키텍처 기반 백엔드와 LangChain, GPT-4, Sendbird Webhook이 연결된 Dialog Engine의 흐름을 파악하고 유지보수
Presenter와 의존성 주입 등 기존 설계 원칙을 지켜 기능을 바꾼 뒤에도 아키텍처 경계가 흐려지지 않도록 관리
프로젝트 설정과 아키텍처를 빠르게 파악해 팀에 공유

일부 화면을 SSR로 전환

CSR로만 구성된 프로젝트에서 초기 로딩이 느린 화면을 SSR로 전환해 첫 화면 렌더링 개선

2023.01 – 2023.10

MyVivache

고령자 대상 운동 애플리케이션

Flutter Developer|Flutter · BLoC · Clean Architecture

개발자 역할을 넘어 복지관 현장에서 고령자를 직접 인터뷰하고, 발견한 UX 문제를 프로덕트에 반영했습니다.

5가지 이상고령자 특화 UI/UX 문제점 발굴

복지관에서 직접 확인한 고령자 UX

복지관을 방문해 사용자(고령자) 리서치와 인터뷰 수행
실사용자 테스트에서 ‘붉은색을 경고로 인식’, ‘아이콘 의미가 불명확’ 등 고령자 특화 UI/UX 문제 5가지 이상을 찾았으며 일부 내용은 후속 논문에 기재
발견한 문제를 기획팀과 공유해 제품에 반영하고 고령자 친화적인 화면으로 수정

BLoC와 클린 아키텍처 도입

BLoC 패턴으로 비즈니스 로직과 UI를 분리해 핵심 로직의 테스트 가능성과 유지보수성 향상
클린 아키텍처로 계층별 책임을 나눠 변경과 확장이 쉬운 구조로 설계

2021.06 – 2022.03

MetLife생명 UI 전환 프로젝트

보험사 ERP 시스템을 자사 UI 프레임워크로 전환한 프로젝트

Frontend Developer|JavaScript · 사내 UI Framework · Scrum

레거시 ERP 코드를 분석해 마이그레이션 룰을 도출하고 고객사 개발자 대응을 문서화했습니다.

레거시 ERP 마이그레이션

순수 JavaScript 기반 레거시 ERP 코드를 분석해 자사 프레임워크로 옮길 때 적용할 규칙을 정리
고객사 개발자 지원 과정에서 반복되는 질문과 해결 방법을 문서화해 대응 기준 마련
웹 표준 기반 자사 프레임워크로 UI 컴포넌트를 개발하고 시스템 마이그레이션 주도
스크럼 방식으로 2주 단위 스프린트 진행

코드와 설계 맥락을 포함한 상세 성과 보기

Skill.

Languages: TypeScript·JavaScript·Dart
Frameworks & Libraries: React·Next.js·Flutter·TanStack Query·WebGL
Tools & Platforms: pnpm·Connect-RPC·Firebase·Git·Figma·Claude Code·Slack·Notion

Education.

2013.03 – 2019.03

숭실대학교 IT대학 글로벌미디어학부

주요 이수 과목: 프로그래밍 및 실습 1, 프로그래밍 및 실습 2, 알고리즘, HCI, 자료구조, 고급 프로그래밍, 소프트웨어공학