소개"폰은 잠깐 내려놓고, 같이 읽어요." 혼자 하는 독서를 함께하는 경험으로 바꾸기 위해 기획·디자인·개발한 3D 온라인 서재. 나만의 캐릭터를 꾸며
서재에 입장하고, 공간마다 다른 음악이 흐르는 자리 중 머물고 싶은 곳에 앉아 독서 타이머로 읽은 시간을 기록합니다. 지금 함께 읽고 있는 사람 수를 실시간으로
보여주고 게시판으로 소식을 나누며, Three.js로 서재 공간을 직접 구현하고 Supabase로 회원·실시간 데이터를 관리했습니다.
소개용인 반도체 클러스터 수혜 입지(3대 주요 구역)를 다룬 아파트 분양 홍보 웹사이트제작. 방문자의 실질적인 상담 전환(CVR)을 목표로 전
화면 스티키(Sticky) 전화 연결 및 방문 접수 UX를 도입하여 유입 대비 높은 상담 접수율을 기록한 반응형 랜딩페이지 프로젝트. 웹, 태블릿, 모바일 이질감 없는 반응형
웹사이트 구현.
프로그램Figma Adobe Photoshop Adobe Premiere Pro CapCut VS Code GitHub
소개한국프로젝트출판사의 주 이용자 고객은 유치원 및 어린이집 원장님들입니다. 해당 연령대를 고려하여 가독성과 직관성을 극대화한 UI/UX로 설계했으며, 비개발자도 손쉽게
유지보수할 수 있도록 워드프레스를 기반으로 제작하고 관리자 페이지를 통한 회원 관리 및 세미나 일정 안내 기능을 구축하는 한편, 세미나 접수와 결제는 본사를 통해 안정적으로
처리되도록 기획했습니다.
프로그램Figma Adobe Photoshop WordPress(ElementsKit)
사용 언어CSS JavaScript
작업기간2025.12.15 ~ 2026.01.09
양양공항 AI 안내 콘텐츠
소개AI 기술을 기반으로 한 양양공항 안내 키오스크는 탑승 정보, 교통, 관광지 안내 등 여행에 필요한 정보를 쉽고 빠르게 제공합니다.
직관적인 UI와 다국어 지원으로 외국인 관광객 또한 편리하게 사용할 수 있는 스마트 안내 콘텐츠 입니다.
기여도
콘텐츠 기획 : B2BG 협업
UX/UI 디자인 : 1인 단독 작업
PM : 일정 및 진행 관리 2인 병행
1차 화면 구현 : 인터랙션 구조 및 API연동 1인 단독 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
AI: CNAI
작업기간2024.07.03 ~ 2024.10.22
육군본부 KADEX행사 AI 안내 콘텐츠
소개육군본부 '고우림'이 소개하는 KADEX 전시회 키오스크 콘텐츠입니다.
행사에 방문하는 방문자들이 전시회를 쉽게 탐색하고 필요한 정보를 신속하게 찾을 수 있도록 도우며,
육군 관련 정보와 KADEX 전시회에 대한 다양한 콘텐츠를 제공하여 방문 고객이 육군의 정책과 전시회에 대한 이해를 높일 수 있도록 합니다.
AI 사진 촬영 기능을 통해 사용자는 AI 포즈와 프레임을 선택하여 사진을 촬영하고 이메일로 전송할 수 있으며, 육군 정보 섹션에서는 육군 인삿말, 주요 정책,
육군 의 상징을 AI가 소개합니다.
KADEX 소개에서는 AI가 전시회의 배치도, 시간표 및 관련 정보를 제공하고, 홍보 영상 재생 기능을 통해 전시회의 내용을 시청할 수 있습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 2인 작업
1차 화면 구현 : 인터랙션 구조 및 API연동 2인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Adobe Premiere Pro
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
AI: CNAI
작업기간2024.08.01 ~ 2024.10.02
강남 메디컬투어센터 자율주행 안내 콘텐츠
소개강남메디컬투어센터 콘텐츠 로봇은 방문객에게 센터의 소개, 시설, 서비스, 다양한 프로그램을 직관적으로 안내하는 스마트 시스템입니다.
한국 미용 의료가 익숙하지 않은 외국인을 위해 병원 이용 주의사항, 체크리스트, 통·번역 지원 등 실용 정보를 한/영 2개국어로 제공하며, 서울의 주요 관광지와
교통 정보를
함께 제공하여 메디컬과 관광을 모두 즐길 수 있도록 돕습니다. 또한 음성 안내 역시 한국어와 영어로 지원되며, 원하는 질문이 없을 경우 음성으로 직접 질문하고,
GPT
인공지능이 실시간으로 답변해드립니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 2인 병행
1차 화면 구현 : 인터랙션 구조 및 API연동 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Adobe Premiere Pro
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
AI: klleon
작업기간2024.10.02 ~ 2024.11.22
두바이 GITEX 박람회 자율주행&동행안내 안내 콘텐츠
소개두바이 자이텍스(GITEX) 박람회의 한국로봇산업진흥원 공동 부스에서 관람객들을 위한 안내를 수행하는 스마트 로봇입니다.
로봇은 박람회장 내 사전 설정된 경로를 따라 자율적으로 이동하며, 방문객이 원하는 부스를 선택하면 직접 해당 위치로 동행 안내를 제공합니다.
한국로봇산업진흥원이 주관하여 참여한 국내 로봇 기업들의 소개와 부스 위치를 쉽게 확인할 수 있으며, 각 기업의 대표 제품에 대한 상세 정보와 기술 시연 영상도
로봇 화면을 통해 바로 확인할 수 있습니다.
또한, 자이텍스 박람회장 전체를 파악할 수 있는 전시장 지도와 공식 홍보 영상도 함께 제공되어 관람 동선을 더욱 효율적으로 계획할 수 있습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 1인
1차 화면 구현 : 인터랙션 구조 및 API연동 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Tinkercad
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
작업기간2024.10.04 ~ 2024.10.11
자카르타 센트럴파크몰 자율주행&동행안내 안내 콘텐츠
소개자카르타 센트럴파크몰의 자율주행 안내로봇은 층별로 지정된 경로를 따라 스스로 이동하며, 방문객이 원하는 매장으로 직접 동행 안내를 제공하는 스마트한 쇼핑
파트너입니다.
각 층별 매장 지도를 통해 브랜드 위치를 검색할 수 있으며, 선택한 매장으로 즉시 안내를 받을 수 있어 길을 헤맬 걱정이 없습니다. 브랜드 이름은 알파벳
초성으로도 검색 가능하며, 다양한 카테고리별 매장 정보를 한눈에 확인할 수 있어 누구나 손쉽게 원하는 매장을 찾을 수 있습니다.
로봇은 인도네시아어, 영어, 한국어의 3개국어 음성 안내를 제공하며, 음성으로 질문 시 저장된 데이터로 응답하거나, 없는 정보는 GPT 인공지능이 실시간으로
답변해줍니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 2인 병행
1차 화면 구현 : 인터랙션 구조 및 API연동 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Adobe Premiere Pro
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
작업기간2024.08.06 ~ 2024.09.30
정읍 솔티생태관광방문자센터 어린이 게임
소개솔티생태방문자센터는 어린이 방문객들이 솔티생태숲의 자연을 쉽고 재미있게 배울 수 있도록, 맞춤형 체험 게임 콘텐츠를 제공합니다.
아이들은 솔티숲의 동식물이 담긴 일러스트 카드게임으로 같은 그림을 찾아보며 관찰력을 기를 수 있고, 여러 교육용 게임을 통해 지역과 자연에 대한 지식을 놀이처럼
배울 수 있습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 2인
1차 화면 구현 : 인터랙션 구조 및 API연동 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Adobe Illustrator
Adobe Premiere Pro
Procreate
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
AI: klleon
작업기간2024.02.05 ~ 2024.05.26
정읍 솔티생태관광방문자센터 안내 콘텐츠
소개솔티생태방문자센터 안내 콘텐츠는 방문객 누구나 쉽게 센터를 이해하고 즐길 수 있도록 구성된 스마트 콘텐츠입니다.
솔티숲을 즐길 수 있는 테마별 추천 체험 코스도 함께 안내할 뿐 아니라, 솔티숲 주변의 정읍시 주요 관광지 정보와 정읍시 문화관광 홈페이지 연결을 통해 지역
전체의 문화자원까지 함께 둘러볼 수 있도록 구성되어 있습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 2인
1차 화면 구현 : 인터랙션 구조 및 API연동 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Adobe Illustrator
Adobe Premiere Pro
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
AI: klleon
작업기간2024.02.05 ~ 2024.04.26
코엑스 AI-EXPO 박람회 안내 콘텐츠
소개AI EXPO 안내 콘텐츠는 관람객들이 박람회를 더욱 편리하게 즐길 수 있도록 설계된 스마트 정보 콘텐츠입니다.
전시장 전체 지도를 제공하고, 참가 기업을 알파벳으로 검색해 부스 위치와 기업 정보를 쉽게 확인할 수 있어 효율적인 관람을 도와줍니다.
또한, 박람회 현장의 주요 프로그램과 행사 정보를 담은 이미지 및 영상 콘텐츠를 통해 AI EXPO의 분위기와 핵심 내용을 직관적으로 파악할 수 있으며, 보다
자세한 내용이 필요할 경우 AI EXPO 공식 홈페이지로 연결되어 다양한 정보를 자유롭게 확인할 수 있습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 1인
1차 화면 구현 : 인터랙션 구조 및 API연동 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
작업기간2024.04.24 ~ 2024.04.30
한국문화정보원 월별 포스터
소개한국문화정보원의 월간 홍보 이벤트 및 설문조사 콘텐츠를 기획하고, 이에 따라 매월 포스터를 디자인하여 교체·배포하는 업무를 1년간 작업하였습니다.
포스터는 계절감, 행사 주제, 정책 방향에 맞춰 시각 콘셉트를 설정하고, 온라인·오프라인 채널에 적합한 형태로 제작하였습니다.
기획부터 제작, 배포까지 정기적 콘텐츠 유지보수 담당하였으며, 월별 일정에 따라 효율적인 콘텐츠 교체가 이루어지도록 관리하였습니다.
기여도
이벤트 기획 : 1인 기획
디자인 : 1인 작업
프로그램
Adobe Photoshop
Adobe Illustrator
Procreate
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
작업기간2023.01.01 ~ 2023.01.12
(매월 1개 포스터 업데이트)
경주 국제회의복합지구 안내 콘텐츠 (힐튼호텔, 라한호텔,
코모도호텔, 엑스포대공원,
한국대중음악박물관)
소개경주국제회의복합지구는 하이코컨벤션센터, 힐튼호텔, 라한호텔, 코모도호텔, 한국대중음악박물관, 엑스포대공원, 우양미술관 등 총 6개 시설로 구성되어 있으며,
각 시설에 적용된 콘텐츠는 통일된 디자인과 구조로 기획·제작되었습니다.
모든 콘텐츠는 한국어, 영어, 중국어, 일본어 총 4개 국어로 제공되어, 외국인 관광객도 편리하게 정보를 확인할 수 있습니다. 각 시설의 개별 행사 안내는 물론,
복합지구 전체의 공동 행사 정보도 모든 시설에서 확인 가능하며, 각 시설에 맞춘 층별안내와 부대시설 정보 페이지도 함께 제공합니다.
또한 복합지구 인근의 주요 관광지 정보와 함께, 테마별 관광 코스를 제안하고 QR코드 연동을 통해 모바일에서도 확인할 수 있도록 설계되어 관광 편의성도
높였습니다. 교통 안내 콘텐츠에서는 셔틀버스 정보와 KTX 연계 실시간 버스 시간표도 함께 제공하여 전시·관광·이동을 모두 고려한 통합 콘텐츠로
구성되었습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 2인
1차 화면 구현 : 인터랙션 구조 및 API연동 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Adobe Illustrator
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
작업기간2023.10.06 ~ 2023.01.31
고려대학교의료원 기부금 콘텐츠
소개고려대학교의료원 기부금 콘텐츠는 병원을 찾은 방문객들이 키오스크를 통해 간편하게 기부하고, 기부 내역도 즉시 확인할 수 있는 사용자 중심의 시스템으로
구성되어 있습니다.
기부는 1만 원, 5만 원, 10만 원 단위로 선택하거나, 1천 원 이상 금액을 자유롭게 입력할 수 있으며, 기부 시 휴대폰 번호를 입력하면 모바일로 후원
영수증을 받을 수 있는 기능도 함께 제공됩니다. 또한 고려대의료원에 기부한 기부자들의 이야기와 기부 소식을 통해 기부의 의미를 공유하고, 기부와 관련된
문의처(전화, 카카오톡, 홈페이지) 정보도 함께 제공하여 편리한 상담이 가능하도록 설계되어 있습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 2인
1차 화면 구현 : 인터랙션 구조 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
작업기간2023.06.08 ~ 2023.07.25
청도군 보건소 자율주행 안내 콘텐츠
소개청도군보건소 자율주행 안내 로봇은 모든 연령대, 특히 어르신들도 직관적으로 이용할 수 있도록 설계된 안내 콘텐츠로, 보건소 방문 시 필요한 다양한 정보를
쉽고 편리하게 제공합니다.
로봇에는 음성 안내 기능이 탑재되어 있어 마이크 버튼을 누르고 질문하면 답변을 들을 수 있으며, 등록된 정보가 없을 경우 GPT 인공지능을 통해 실시간 응답도
가능합니다. AI 아바타가 진료 정보를 시각적으로 안내해 고령층도 내용을 쉽게 이해할 수 있고, 보건소 층별 시설 위치 정보를 통해 원하는 공간을 빠르게 찾을 수
있습니다. 또한 지역 정보 서비스로 청도군의 관광지와 역사·자연 명소를 테마별로 확인할 수 있는 콘텐츠도 함께 제공되어, 보건소 이용과 함께 청도군을 더욱 즐길
수 있도록 구성되어 있습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 2인 작업
PM : 일정 및 진행 관리 2인
1차 화면 구현 : 인터랙션 구조 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Adobe Premiere Pro
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
AI: klleon
작업기간2023.08.01 ~ 2023.10.05
잠실 롯데호텔 AI 안내 콘텐츠
소개잠실 롯데호텔의 AI 컨시어지 안내 콘텐츠는 호텔 유니폼을 착용한 전용 AI 아바타를 통해 디지털 서비스를 제공합니다.
사용자는 자주 묻는 질문을 음성으로 선택하거나 직접 질문하여 AI의 안내를 들을 수 있으며, 지정된 답변이 없을 경우 GPT 인공지능이 실시간으로 안내를
이어줍니다.
호텔 내 각 층의 지도와 위치 정보, 길찾기 안내, 그리고 객실, 레스토랑, 부대시설 등 다양한 시설의 상세 정보를 확인할 수 있어 투숙객의 편의성을 높였습니다.
또한, 더 자세한 내용이 필요할 경우에는 롯데호텔 공식 홈페이지로 바로 연결되어 예약이나 서비스 정보도 손쉽게 확인할 수 있습니다.
기여도
콘텐츠 기획 : 클라이언트와 협업
UX/UI 디자인 : 1인 작업
PM : 일정 및 진행 관리 2인
1차 화면 구현 : 인터랙션 구조 1인 작업 ※ 사내 전용 툴로 화면 및 기능 구현을 직접 수행하여,
실질적인 프론트엔드 역할 담당.
프로그램
Adobe Photoshop
Adobe Premiere Pro
Q-wayfinder (인터랙티브 키오스크 UI 콘텐츠 제작 도구)
Q-Wayfinder Manager (디지털 사이니지 장비 배포 및 콘텐츠 관리 툴)
AI: klleon
소개빛나다 솔루션은 아임웹(imweb)을 이용해 만든 홈페이지입니다. 진로에 대한 고민이 많은 청년들에게 실질적인 방향과 도약의 기회를 제공하는 교육 솔루션으로,
현실에 기반한 실무 중심 커리큘럼과 맞춤형 진로 설계 프로그램으로 청년의 성장을 함께 만드는 철학을 담아, 쉽고 빠르게 핵심 정보를 찾을 수 있는 구조로 설계되었습니다.
사용자 경험을 중심으로, 직관적인 UI와 깔끔한 다크모드 디자인을 적용해 청년층이 편안하게 정보를 탐색할 수 있도록 했습니다.
프로그램imweb / Adobe Photoshop / Adobe Illustrator
작업기간2024.12.02 ~ 2024.12.23
와이어트 영어유치원
소개와이어트 영어유치원 4·5·6·7세 유아 대상의 여름 및 겨울 방학 숙제 교재를 기획 및 제작하였습니다.
각 연령별 발달 단계에 맞춰 구성된 콘텐츠로, 총 한 권당 40~100페이지 분량의 교재를 디자인 및 편집하였으며, 영어 학습과 창의 활동이 균형 있게 이루어질
수 있도록 구성하였습니다.
교재는 쓰기, 읽기, 색칠하기, 퍼즐, 복습 퀴즈 등 다양한 형식으로 제작되었으며, 연령별 수준 차이를 고려해 단계별 학습 난이도와 흥미 요소를 반영하였습니다.
방학 기간 동안 학습 흐름이 유지될 수 있도록 교육 목적과 재미를 고려한 콘텐츠로 완성하였습니다.