# Corporate Memphis — 디자인 스타일 가이드
## 기본 정보
- **ID**: corporate-memphis
- **카테고리**: design-style
- **연도**: 2017
## 설명
플랫한 색상과 단순화된 인체 비율을 특징으로 하는 현대적 일러스트 스타일입니다.
## 역사·배경
2010년대 후반 실리콘밸리 스타트업을 중심으로 폭발적 확산. Alegra 일러스트레이터에 의해 양식화됨. 지금은 '과포화'로 비판받기도 함.
## 핵심 원칙
- 포용성과 다양성
- 단순함과 명확성
- 친근함
## 주요 특징
- 과장된 신체 비율
- 단순화된 얼굴 표현
- 밝고 포화도 높은 색상
- 기하학적 형태
- 친근하고 접근하기 쉬운 느낌
## 컬러 시스템 가이드
파스텔 배경 + 선명한 아웃라인 일러스트. 중간 채도의 부드럽고 친근한 팔레트
### 색상 역할
- background: 크림·라벤더·민트 등 연한 파스텔
- illustration-fill: 피부·의상 색 — 다양한 중채도 파스텔
- illustration-outline: 검정 또는 진한 색 아웃라인
- text: 어두운 회색 또는 네이비
### 색상 제약 조건
- vivid·형광 색 금지 — 파스텔 계열 유지
- 순수 흰색 배경 지양 — 색조 있는 파스텔 배경 권장
- 다양한 피부색·의상색 포용 — 단일 피부색 고정 금지
### 다크모드 전략
Dark Memphis: 배경을 짙은 남색·보라로. 일러스트 아웃라인을 밝게. 파스텔 채우기 색 유지
### 대비 요구사항
텍스트는 파스텔 배경 위에서 WCAG AA 확인 필수 — 파스텔+회색 텍스트 조합은 위험
## 타이포그래피 가이드
- **폰트 성격**: 둥글고 친근한 산세리프. 딱딱함 없이 conversational한 느낌
- **권장 폰트 수**: 최대 2개
- **타입 스케일**: 1.25 (Major Third)
### 타이포그래피 제약
- angular·condensed 폰트 금지
- font-weight 400~600 권장 — too bold하면 Memphis 캐릭터 무거워짐
- heading 크게, 친근하게
## 하면 안 되는 것 (안티패턴)
- 사진 이미지 사용 금지 — 일러스트로만 인물·사물 표현
- 딱딱하고 기업적인 느낌 금지
- Memphis 캐릭터 없이 파스텔만 사용 금지
## 반드시 포함해야 하는 것
- Memphis 스타일 일러스트 (아웃라인+색채우기+단순화된 인체)
- 둥근 UI 요소 (pill 버튼, rounded card)
- 친근하고 다양성 있는 일러스트 캐릭터
## 모션 가이드
캐릭터 subtle animation (흔들리기, 눈 깜빡임). ease-in-out 부드럽게. 과도한 애니메이션보다 micro-interaction 위주.
## 사용 사례
- 온보딩 화면
- 에러 페이지
- 빈 상태(Empty State) UI
- 마케팅 일러스트
## 추천 프로젝트 유형
- SaaS 온보딩
- 에러·빈 상태 페이지
- 마케팅 일러스트
- 다양성 표현
## 장점
- 다양성과 포용성 표현 용이
- 친근하고 접근하기 쉬운 느낌
- 빠른 제작이 가능 (템플릿 풍부)
## 단점·한계
- 남발로 인해 '평범함'의 상징이 됨
- 개성이 없어 보일 수 있음
- 세련된 브랜드 이미지와 충돌
## 실제 사용 제품·서비스
- Slack 온보딩
- Mailchimp
- Asana
- 많은 SaaS 에러 페이지
## 접근성
밝은 색상과 명확한 외곽선으로 기본 가독성 양호. 복잡한 정보 전달엔 텍스트 병행 필요.
## 관련 스타일
- [flat-design](https://ui.buildersgate.com/styles/flat-design)
- [minimalism](https://ui.buildersgate.com/styles/minimalism)
- [glassmorphism](https://ui.buildersgate.com/styles/glassmorphism)
## 참고 구현 예시 (디자인 토큰)
> 아래 토큰은 이 스타일의 참고 구현 예시입니다. 프로젝트의 브랜드 컬러·폰트에 맞게 조정하되, 위 컬러 시스템/타이포그래피 가이드의 제약 조건을 준수하세요.
### 색상
- primary: #5B4DFF
- secondary: #FF6B6B
- accent: #FFD93D
- background: #FFFEF9
- surface: #F8F7FF
- text: #2D3748
- textSecondary: #718096
- border: #E2E8F0
### 헤더
- background: linear-gradient(135deg, #5B4DFF 0%, #FF6B6B 100%)
- textColor: #FFFFFF
- accentColor: #FFD93D
### 타이포그래피
- fontFamily: Poppins, 'Noto Sans KR', sans-serif
- headingWeight: 600
- bodyWeight: 400
- letterSpacing: 0.01em
### 스페이싱
- unit: 8px
- scale: 1.2
### 그림자 (Shadows)
- sm: 0 2px 8px rgba(91, 77, 255, 0.1)
- md: 0 4px 16px rgba(91, 77, 255, 0.15)
- lg: 0 8px 32px rgba(91, 77, 255, 0.2)
- xl: 0 16px 48px rgba(91, 77, 255, 0.25)
### Border Radius
- none: 0
- sm: 12px
- md: 20px
- lg: 32px
- full: 9999px
### 테두리 (Borders)
- width: 2px
- style: solid
- color: #E2E8F0
### 이펙트
- blur: 0px
- opacity: 1
- transition: all 0.3s ease-out
### 애니메이션
- duration: 300ms
- easing: ease-out
### 컴포넌트 토큰
- 버튼: shape=pill / hoverEffect=bounce / textTransform=none
- 카드: style=elevated / hoverEffect=bounce
- 인풋: style=filled / focusEffect=ring
- 배지: shape=pill / style=solid
- 아이콘: package=phosphor / strokeWidth=2 / defaultSize=24
### 레이아웃
- containerStyle: boxed
- sectionSpacing: spacious
### 특수 효과
- glassmorphism: false
- gradientText: true
- animatedBackground: false
- scanlines: false
- noise: false
## 자주 묻는 질문 (FAQ)
### Q: Corporate Memphis이란 무엇인가요?
A: 플랫한 색상과 단순화된 인체 비율을 특징으로 하는 현대적 일러스트 스타일입니다. 2010년대 후반 실리콘밸리 스타트업을 중심으로 폭발적 확산. Alegra 일러스트레이터에 의해 양식화됨. 지금은 '과포화'로 비판받기도 함.
### Q: Corporate Memphis의 핵심 디자인 원칙은 무엇인가요?
A: Corporate Memphis의 핵심 원칙은 포용성과 다양성, 단순함과 명확성, 친근함입니다.
### Q: Corporate Memphis은 어떤 프로젝트에 적합한가요?
A: Corporate Memphis은 온보딩 화면, 에러 페이지, 빈 상태(Empty State) UI, 마케팅 일러스트, SaaS 온보딩, 에러·빈 상태 페이지, 마케팅 일러스트, 다양성 표현 등의 프로젝트에 적합합니다.
### Q: Corporate Memphis의 장단점은 무엇인가요?
A: 장점으로는 다양성과 포용성 표현 용이, 친근하고 접근하기 쉬운 느낌, 빠른 제작이 가능 (템플릿 풍부)이 있습니다. 단점으로는 남발로 인해 '평범함'의 상징이 됨, 개성이 없어 보일 수 있음, 세련된 브랜드 이미지와 충돌이 있습니다.
### Q: Corporate Memphis에서 색상은 어떻게 사용하나요?
A: 파스텔 배경 + 선명한 아웃라인 일러스트. 중간 채도의 부드럽고 친근한 팔레트 색상 역할은 background: 크림·라벤더·민트 등 연한 파스텔, illustration-fill: 피부·의상 색 — 다양한 중채도 파스텔, illustration-outline: 검정 또는 진한 색 아웃라인입니다. 주의사항: vivid·형광 색 금지 — 파스텔 계열 유지, 순수 흰색 배경 지양 — 색조 있는 파스텔 배경 권장.
### Q: Corporate Memphis에 어울리는 폰트 스타일은 무엇인가요?
A: Corporate Memphis에는 둥글고 친근한 산세리프. 딱딱함 없이 conversational한 느낌 폰트가 적합합니다. 최대 2개 폰트 패밀리 사용을 권장합니다. 제약 사항: angular·condensed 폰트 금지, font-weight 400~600 권장 — too bold하면 Memphis 캐릭터 무거워짐.
### Q: Corporate Memphis 디자인에서 하면 안 되는 것은 무엇인가요?
A: Corporate Memphis에서 피해야 할 것: 사진 이미지 사용 금지 — 일러스트로만 인물·사물 표현, 딱딱하고 기업적인 느낌 금지, Memphis 캐릭터 없이 파스텔만 사용 금지.
### Q: Corporate Memphis을 사용하는 실제 서비스나 제품은 무엇이 있나요?
A: Corporate Memphis을 적용한 대표적인 제품·서비스로는 Slack 온보딩, Mailchimp, Asana, 많은 SaaS 에러 페이지 등이 있습니다.
## API 엔드포인트
- 스타일 상세: https://ui.buildersgate.com/api/styles?id=corporate-memphis
- 디자인 토큰: https://ui.buildersgate.com/api/themes?id=corporate-memphis&merged=true
2010년대 후반 실리콘밸리 스타트업을 중심으로 폭발적 확산. Alegra 일러스트레이터에 의해 양식화됨. 지금은 '과포화'로 비판받기도 함.
#5B4DFF
핵심 원칙
1
포용성과 다양성
2
단순함과 명확성
3
친근함
주요 특징
과장된 신체 비율
단순화된 얼굴 표현
밝고 포화도 높은 색상
기하학적 형태
친근하고 접근하기 쉬운 느낌
장단점
장점
+다양성과 포용성 표현 용이
+친근하고 접근하기 쉬운 느낌
+빠른 제작이 가능 (템플릿 풍부)
단점 / 한계
−남발로 인해 '평범함'의 상징이 됨
−개성이 없어 보일 수 있음
−세련된 브랜드 이미지와 충돌
적합한 사용처
사용 사례
온보딩 화면
에러 페이지
빈 상태(Empty State) UI
마케팅 일러스트
이런 프로젝트에 추천
SaaS 온보딩에러·빈 상태 페이지마케팅 일러스트다양성 표현
접근성
밝은 색상과 명확한 외곽선으로 기본 가독성 양호. 복잡한 정보 전달엔 텍스트 병행 필요.
실제 사용 예시
Slack 온보딩MailchimpAsana많은 SaaS 에러 페이지
UI 컴포넌트 예제
이 디자인 스타일의 특징을 반영한 실제 UI 컴포넌트들입니다.
Simplified Characters
단순화된 얼굴과 과장된 신체 비율의 친근한 캐릭터
Person A
Person B
Person C
Vibrant Cards
밝고 포화도 높은 색상을 사용한 친근한 카드
🎨
Creative
Express your creativity with bold designs
💡
Innovative
Bring new ideas to life
✨
Inspiring
Inspire others with your work
Geometric Elements
기하학적 형태를 활용한 장식 요소
Circle
Square
Triangle
Mixed
Illustration Scene
단순화된 요소들을 조합한 친근한 장면
Friendly Buttons
둥근 모서리와 밝은 색상의 버튼
Feature Cards
아이콘과 함께 사용하는 정보 카드
👥
Inclusive
Designed for everyone, celebrating diversity and accessibility
🎯
Clear
Simple and straightforward communication that works
🤝
Friendly
Approachable design that welcomes everyone
⚡
Modern
Contemporary aesthetics for today's digital world
자주 묻는 질문
Corporate Memphis이란 무엇인가요?
플랫한 색상과 단순화된 인체 비율을 특징으로 하는 현대적 일러스트 스타일입니다. 2010년대 후반 실리콘밸리 스타트업을 중심으로 폭발적 확산. Alegra 일러스트레이터에 의해 양식화됨. 지금은 '과포화'로 비판받기도 함.
Corporate Memphis의 핵심 디자인 원칙은 무엇인가요?
Corporate Memphis의 핵심 원칙은 포용성과 다양성, 단순함과 명확성, 친근함입니다.
Corporate Memphis은 어떤 프로젝트에 적합한가요?
Corporate Memphis은 온보딩 화면, 에러 페이지, 빈 상태(Empty State) UI, 마케팅 일러스트, SaaS 온보딩, 에러·빈 상태 페이지, 마케팅 일러스트, 다양성 표현 등의 프로젝트에 적합합니다.
Corporate Memphis의 장단점은 무엇인가요?
장점으로는 다양성과 포용성 표현 용이, 친근하고 접근하기 쉬운 느낌, 빠른 제작이 가능 (템플릿 풍부)이 있습니다. 단점으로는 남발로 인해 '평범함'의 상징이 됨, 개성이 없어 보일 수 있음, 세련된 브랜드 이미지와 충돌이 있습니다.
Corporate Memphis에서 색상은 어떻게 사용하나요?
파스텔 배경 + 선명한 아웃라인 일러스트. 중간 채도의 부드럽고 친근한 팔레트 색상 역할은 background: 크림·라벤더·민트 등 연한 파스텔, illustration-fill: 피부·의상 색 — 다양한 중채도 파스텔, illustration-outline: 검정 또는 진한 색 아웃라인입니다. 주의사항: vivid·형광 색 금지 — 파스텔 계열 유지, 순수 흰색 배경 지양 — 색조 있는 파스텔 배경 권장.
Corporate Memphis에 어울리는 폰트 스타일은 무엇인가요?
Corporate Memphis에는 둥글고 친근한 산세리프. 딱딱함 없이 conversational한 느낌 폰트가 적합합니다. 최대 2개 폰트 패밀리 사용을 권장합니다. 제약 사항: angular·condensed 폰트 금지, font-weight 400~600 권장 — too bold하면 Memphis 캐릭터 무거워짐.
Corporate Memphis 디자인에서 하면 안 되는 것은 무엇인가요?
Corporate Memphis에서 피해야 할 것: 사진 이미지 사용 금지 — 일러스트로만 인물·사물 표현, 딱딱하고 기업적인 느낌 금지, Memphis 캐릭터 없이 파스텔만 사용 금지.
Corporate Memphis을 사용하는 실제 서비스나 제품은 무엇이 있나요?
Corporate Memphis을 적용한 대표적인 제품·서비스로는 Slack 온보딩, Mailchimp, Asana, 많은 SaaS 에러 페이지 등이 있습니다.