← OpenDesign
큐레이션 · 오픈 · 무료
Squadeasy
역동적인 사진과 굵은 타이포그래피를 사용하여 연결감을 증진하는 따뜻하고 활기찬 직원 몰입 플랫폼입니다.
Consumer Friendly Mobile UI App UI Warm
01
디자인 DNA
직원 몰입 친근한 역동적인 연결 따뜻한
활기차고 겹쳐진 사진과 굵고 격려적인 메시지가 있는 친근한 커뮤니티 게시판입니다.
02
컬러
#FF5A8FAccent
#000000Ink
#666666Ink soft
#E1C19EBG
rgba(0,0,0,0.12)Line
인간적 연결과 친근함을 강조하는 따뜻하고 활기찬 팔레트입니다.
03
타이포그래피
grotesque-sans · humanist-sans
display 80px · 900heading 56px · 700body 16px · 400모든 주요 헤드라인은 대문자 사용 · 주요 전시 텍스트에는 극한 굵기(900) 사용 · 큰 헤드라인에는 좁은 자간(-2px) 사용
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
넉넉한 패딩(40px 24px 140px 24px)으로 큰 콘텐츠 블록 주변에 숨쉴 여유를 만듭니다.
05
표면 (라운드 / 그림자 / 경계선)
sm · 4px
md · 14px
lg · 100px
pill · 100px
활성 요소에는 1px solid black
rgba(0, 0, 0, 0.12) 0px 1.52px 8px 0px
06
레이아웃
1280 container
12 columns
24px gutter
768 / 1024 breakpoints
겹쳐진 회전 이미지와 중앙 정렬 텍스트가 포함된 전폭 히어로 섹션
07
모션과 인터랙션
220ms micro
400ms small
800ms medium
cubic-bezier(0.4, 0, 0.2, 1) easing
이미지 회전을 위한 트랜스폼 애니메이션(0.2s) · 섹션 등장을 위한 opacity 페이드(0.4s - 0.8s)
인터랙티브 요소에 스케일 트랜스폼 · 즉각적인 시각적 피드백
08
컴포넌트
button 고대비 색상(검정 배경/흰색 텍스트 또는 네온 옐로우 배경/검정 텍스트)의 알약 형태 버튼 card 부드러운 그림자와 유기적 형태가 있는 겹쳐진 회전 이미지 카드 chip 해당 없음 input 해당 없음 hero 역동적이고 겹쳐진 이미지와 굵고 중앙 정렬된 타이포그래피가 있는 전폭 섹션
09
보이스와 금지 목록
톤 열정적이고 격려적이며 인간 중심적 헤드라인 긴박감과 흥분을 만드는 굵고 대문자 선언문 CTA 명확하고 행동 지향적(DEMANDER UNE DÉMO)이며 방향 화살표 포함 차갑고 기업적인 색상 팔레트를 사용하지 마세요 — 스크린샷은 대신 따뜻하고 인간 중심적인 색상을 보여줍니다 얇고 가벼운 타이포그래피를 사용하지 마세요 — 스크린샷은 초굵고 임팩트 있는 폰트를 보여줍니다 엄격하게 고정된 그리드 레이아웃을 만들지 마세요 — 스크린샷은 유기적이고 겹쳐진 회전 이미지를 보여줍니다 작고 비좁은 여백을 사용하지 마세요 — 스크린샷은 넉넉한 패딩과 숨쉴 여유를 보여줍니다 미세하고 은은한 버튼을 사용하지 마세요 — 스크린샷은 네온 포인트가 있는 고대비 알약 형태 CTA를 보여줍니다 사진을 사용하지 않는 것을 피하지 마세요 — 스크린샷은 전체적으로 여러 역동적이고 인간 중심적인 사진을 사용합니다 피하기: 기업 전문 용어 피하기: 수동태 피하기: 작고 수줍은 타이포그래피
10
팩 안의 실제 스크린샷
桌面首屏(hero) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 移动首屏 실제 페이지에서 캡처 · 실 computed styles
11
System Prompt
따뜻하고 활기찬 직원 몰입 플랫폼으로, 역동적인 사진과 굵은 타이포그래피를 사용하여 연결감을 증진합니다. 주요 색상으로는 따뜻한 베이지(#E1C19E) 배경, 블랙(#000000) 타이포그래피, 선명한 핑크(#FF5A8F) 포인트, 네온 옐로우(#E4FF60) 하이라이트가 포함됩니다. 타이포그래피는 좁은 자간의 초굵은 grotesque-sans가 전시 텍스트용으로, 깔끔한 humanist-sans가 본문용으로 특징입니다. 핵심 디자인 규칙: 유기적인 에너지를 위해 겹쳐진 회전 이미지를 포용; 최대 임팩트를 위해 극한 타이포그래피 굵기 사용; 넉넉한 여백과 숨쉴 여유 유지; 차갑고 기업적인 미학, 얇은 폰트, 엄격한 그리드 레이아웃, 작고 비좁은 여백, 미세한 버튼을 피하고 인간 사진을 사용. 이 시스템은 열정적이고 격려적인 커뮤니케이션과 행동 지향적 CTA를 강조합니다.
더 보기
en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
왜 수록: 이 사이트는 굵은 타이포그래피, 역동적인 사진, 그리고 기존 기업 디자인 패턴을 깨는 선명한 색상 선택을 통해 어떻게 따뜻하고 친근한 브랜드 성격을 만들 수 있는지 효과적으로 보여줍니다.