/
KST
브랜드의 철학을 몰입도 높은 디지털경험으로 만드는 웹 스튜디오입니다.디자인만큼 그 과정을중요하게 생각합니다.
이메일:info@alephstudio.art
AI 커머스

Artify

Artify

설명

AI 기반 아트 커머스 플랫폼

기간

Aug 20, 2025 - Feb 13, 2026

역할

  • 풀스택 엔지니어: Supabase 기반 DB 스키마(10개 이상 테이블) 설계, Edge Functions API 구현, 프론트엔드 비즈니스 로직 구현 리드.
  • AI 서비스 아키텍트: FAL.AI API 연동 및 고품질 목업을 위한 제품/스타일 이미지 블렌딩 로직과 프롬프트 엔지니어링 설계.
  • DevOps: Vercel 배포 파이프라인 구축, 환경 시크릿 관리, 안정적인 운영을 위한 도메인 DNS 설정.

기술

Frontend (Client)

HTML5 · CSS3 · JavaScript (ES6+) · Semantic HTML

Frontend (Admin)

Next.js · React · Tailwind CSS

Backend & DB

Supabase (PostgreSQL) · Supabase Edge Functions · Supabase Auth · Node.js · Express.js

AI & Payment

FAL.AI (FLUX.2) · Portone Payment SDK

Deployment

Vercel

프로젝트 목적

Artify는 B2B 아트 플랫폼이지만, 중개는 이 서비스에서 가장 덜 흥미로운 부분입니다. 생성형 AI(FAL.AI FLUX.2)가 브랜드의 설명이 채 끝나기도 전에 그 이미지를 렌더링하고, 그렇게 나온 이미지에 아티스트를 붙입니다. 추상적인 요구가 실시간으로 제품 목업이 되고, 그 아래 커머스 로직은 서버리스로 돌려 가볍게 유지했습니다. 이만큼 실험적인 것이 첫 브리프부터 결제까지 예측 가능하게 굴러가도록 만드는 일이 이 프로젝트의 과제였습니다.

범위

  • · 풀스택 웹 애플리케이션 개발
  • · 생성형 AI(FAL.AI) 파이프라인 구축
  • · 이커머스 & 결제 시스템 연동
  • · 어드민 대시보드 개발

주요 기술 특징

고급 AI 생성 파이프라인

  • · 이미지 생성 품질과 지연 시간을 끌어올리기 위해 DALL·E 3에서 FAL.AI FLUX.2 Edit API로 옮겼습니다.
  • · 제품 이미지와 스타일 이미지를 동적 프롬프트 주입과 결합해, 운영자가 목업 프롬프트를 직접 정의하고 실시간으로 고정밀 제품 비주얼을 뽑습니다.
  • · Supabase Edge Functions로 사용자별 일일 사용량을 제한해, AI 비용이 통제 가능한 범위 안에 머무르게 했습니다.

서버리스 이커머스 아키텍처

  • · 결제 검증(Portone)과 AI 생성 요청 같은 핵심 커머스 로직을 Supabase Edge Functions 위에 올렸습니다.
  • · Supabase DB와 PG사 사이에서 주문 금액을 교차 검증해 위·변조 가능성을 닫았습니다.
  • · PostgreSQL 행 수준 보안(RLS) 정책으로 사용자·관리자·아티스트의 데이터 접근을 엄격히 분리했습니다.

통합 어드민 대시보드

  • · 운영자가 개발자 없이 주문·배송 현황·AI 매칭 옵션·프롬프트를 다루는 Next.js 기반 관리자 콘솔을 만들었습니다.
  • · 사용자 요청과 생성된 AI 이미지를 실시간으로 이어, 운영이 곧바로 반응할 수 있게 했습니다.

디자인 포인트

미니멀리스트 아트 캔버스

시각적 노이즈를 걷어낸 갤러리형 인터페이스로, 작품과 AI 생성 이미지가 경험의 한가운데에 섭니다. B2B 클라이언트가 이미지에만 집중하도록 여백이 레이아웃을 이끕니다.

인터랙티브 모션 & 피드백

CSS3와 JavaScript로 만든 마우스 트래킹 호버와 절제된 전환이 플랫폼을 살아 있는 전시처럼 느끼게 합니다. AI가 이미지를 만드는 동안에는 생성형 로딩 UI가 진행 상황과 브랜드를 동시에 전달합니다.

매끄러운 반응형 경험

적응형 그리드가 모바일·태블릿·데스크톱에서 작품 목록과 AI 패널의 비율을 고르게 유지합니다.

갤러리

클릭하여 확대

자주 묻는 질문

3D 인터랙티브 웹사이트는 일반 홈페이지와 무엇이 다른가요?

Three.js와 WebGL을 사용해 브라우저에서 3D 오브젝트가 움직이고 마우스와 스크롤에 반응하는 웹사이트입니다. 일반 홈페이지가 정보를 정리해 보여준다면, 3D 인터랙티브 웹은 브랜드의 인상을 체험으로 전달합니다. 패션, 뷰티, 건축, 전시처럼 브랜드 경험이 중요한 분야에서 효과가 큽니다.

웹사이트 제작 기간은 얼마나 걸리나요?

랜딩페이지는 7일, 5페이지 기업 웹사이트는 15일, 10페이지 3D 인터랙티브 웹은 30일을 기준으로 합니다. 자료를 전달받은 시점부터 기산하며 디자인 시안 확인과 피드백 일정에 따라 조정됩니다. 급한 일정이 있으시면 상담 시 말씀해 주시면 가능 여부를 먼저 확인해 드립니다.

호스팅, 도메인, 서버 비용은 따로 드나요?

SSL 보안 인증서 설치, 호스팅 세팅, 데이터베이스 구축은 무상으로 제공해 드립니다. 도메인 구입 비용만 의뢰인이 부담하시며 연 2~3만원 수준입니다. 계정은 처음부터 의뢰인 명의로 생성하므로 이후 담당자가 바뀌어도 서비스가 끊기지 않습니다.

완성 후 제가 직접 내용을 수정할 수 있나요?

관리자 페이지를 함께 구축해 드리므로 개발 지식 없이도 텍스트, 이미지, 게시물을 직접 수정하실 수 있습니다. 납품 시 관리자 사용 매뉴얼을 함께 전달해 드립니다. 화면 구조를 바꾸거나 새로운 기능을 추가하는 작업만 별도 개발이 필요합니다.

다음 프로젝트

VELLUM

패션 하우스 — 소재 중심 D2C 커머스

계속 스크롤하세요