Foodnoms
햇살 가득한 흰 도자기 과일 시장 - 따뜻한 오렌지색, 싱그러운 초록색, 그리고 풍성하고 둥근 모양들이 돋보입니다.
Foodnoms는 영양 추적을 위한 유쾌한 마케팅 언어를 선보입니다. 깔끔한 흰색 바탕에, 시각적 중심 역할을 하는 대형 스마트폰 목업 이미지, 그리고 영양소와 진행 상황을 나타내는 재미있는 색상 조합이 특징입니다. 키워드에는 한 가지 색상을, 나머지 부분에는 짙은 회색을 사용하여 헤더를 구성함으로써 핵심 가치를 빠르게 파악할 수 있도록 했습니다. 이 시스템은 데이터 용량이 큰 앱 화면을 부드럽게 보이도록 모서리가 둥글게 처리된 단일 사용자 디스플레이(Aquawax Pro)를 사용합니다. 대부분의 표면은 평평하고 그림자가 없으며, 균일한 모서리 곡률은 버튼, 카드, 라벨에 친근하고 부드러운 느낌을 더해 건강 추적을 딱딱한 임상적인 느낌보다는 훨씬 쉽게 접근할 수 있도록 합니다.
이 페이지는 세로 방향으로 여유로운 리듬감을 가진 단일 열, 중앙 정렬, 전체 너비(약 1200px) 레이아웃을 특징으로 합니다. 헤더는 얇은 상단 바로, 왼쪽에 로고, 중앙에 내비게이션, 오른쪽에 주황색으로 채워진 액션 버튼이 있습니다. 히어로 섹션은 중앙에 배치된 스택 형태로, 두 가지 색상의 제목, 한 줄짜리 부제목, 앱 스토어 아이콘, 그리고 가로 방향으로 펼쳐진 3~5개의 휴대폰 목업 이미지가 있습니다. 히어로 섹션 아래에는 2x3 그리드 안에 중앙에 배치된 "추천" 언론 로고 섹션이 있습니다. 기능 섹션은 두 열 텍스트와 휴대폰 목업 이미지가 번갈아 가며 배치되고, 주황색/녹색으로 강조된 섹션 제목이 있는 반복 패턴을 따릅니다. 푸터 바로 앞에는 전체 너비의 다운로드 가능한 CTA 카드가 있습니다. 섹션 사이의 간격은 넉넉하여(96px) 갤러리처럼 탁 트인 느낌을 줍니다. 내비게이션은 사이드바나 메가 메뉴 없이 최소한의 상단 바 형태로 구성되어 있습니다.
이 앱의 시각적 언어는 앱의 작동 인터페이스를 보여주는 고품질 아이폰 프레임 목업으로 구성되어 있으며, 스톡 사진이 아닌 이러한 목업이 주요 요소입니다. 목업은 거의 완벽한 투명도로 펼쳐지며, 약간 겹치고 부드럽게 회전하며 흰색 배경 위에 직접 배치됩니다. 목업 내의 시각적 구성 요소는 영양 정보, 제품 사진, 매크로 링, 다채로운 카테고리 태그 등 앱 자체 인터페이스로 이루어져 있습니다. 유일한 사진 콘텐츠는 앱의 카메라 화면에 표시되는 사용자 제출 음식 이미지입니다. 라이프스타일 사진, 추상적인 일러스트레이션, 장식용 그래픽은 전혀 없습니다. 브랜딩은 맞춤형 글꼴, 주황색/녹색/어두운 색 구성표, 그리고 앱 자체 인터페이스로 완전히 정의됩니다.
팔레트
상표
- Ember Orange
#ff5406— 주황색은 장식적인 디테일을 강조하거나 드물게 나타나는 단서를 부각하는 데 보조적인 색상으로 사용됩니다. 행동을 유도하는 주요 색상으로 사용해서는 안 됩니다.
중립적
- Graphite
#2f2f2f— 기본 텍스트, 어두운 버튼(앱 스토어 아이콘) 및 아이콘 윤곽선. 제목과 본문 텍스트에 주로 흰색이 아닌 색상이 사용되었습니다. - Verdant Green
#00b33f— 녹색은 장식적인 디테일을 강조하고 저주파를 부각하는 데 추가적인 악센트 역할을 합니다. - Signal Red-Orange
#ff3400— 앱 화면 UI 요소 및 관련 브랜딩에서 볼 수 있는 따뜻한 느낌의 보조 색상입니다. 엠버 오렌지보다 한 톤 따뜻한 색상으로, 선택되었거나 활성화된 앱 상태를 강조합니다. - Sky Blue
#00a9dd— 앱 내부 데이터 카테고리(탄수화물/단백질/기타 영양소 그룹)에 보기 좋은 대비를 이루며, 휴대폰 레이아웃의 따뜻하고 주된 색상 팔레트와 균형을 이룹니다. - Mist Blue
#72a2c5— 은은한 차가운 느낌의 포인트 - 앱 내 추가 데이터 레이블 및 차트 배경의 하늘색을 부드럽게 만들어줍니다. - Sunset Orange
#ff6d00— 마케팅 페이지의 보조 제목과 강조 텍스트에 따뜻한 느낌을 더해줍니다.
타이포그래피
12픽셀에서 60픽셀로 · 7단계
- Aquawax Pro Medium — 대사: Inter · 요점 500 · Aquawax Pro Medium - 추출된 데이터에서 발견되었지만 AI가 설명하지 못했습니다.
- Aquawax Pro — 대사: Nunito Sans · 요점 700, 500, 600 · 제목과 본문을 포함한 모든 영역에서 사용되는 주요 브랜드 폰트입니다. 이 맞춤 디자인 폰트는 넓은 자간, 둥근 기하학적 형태, 편안한 비율이 특징입니다. 굵은체(700)는 시스템의 주요 타이포그래피 요소인 제목과 섹션에 사용됩니다. 중간 굵기(600)는 소제목과 버튼 레이블에 14~1.8mm 간격으로 사용됩니다. 중간 굵기(500)는 본문에 17~1.8mm 간격으로 사용되며, 편안한 가독성을 위해 1.6~1.8mm의 충분한 줄 간격이 제공됩니다.
- System sans-serif — 대사: Inter · 요점 400, 700 · 사용자 인터페이스에서 매우 작은 텍스트나 아이콘 텍스트의 경우 대체 옵션이 사용됩니다. Aquawax Pro는 아주 작은 크기에서는 사용되지 않으며, 시스템 글꼴이 렌더링 용량을 줄이기 위해 이러한 크기를 처리합니다.
간격과 형태
| 목적 | 의미 |
|---|---|
| 밀도 | 넓은 |
| 기본 단계 | 20px |
| 버튼 반경 | 26px |
| 카드 반경 | 26px |
| 그림자 | 아니요 - 그림자 대신 테두리를 사용합니다. |
| 구간 사이 | 96px |
| 페이지 너비 | 1200px |
AI가 Foodnoms 스타일로 웹사이트를 구축하고 내용을 채워줍니다.
- 제품 및 게시물을 링크를 통해 Instagram, TikTok, Facebook 에 올려주세요.
- 이전 사이트의 콘텐츠를 전송하세요. 주소만 지정하면 됩니다.
- 최신 디자인과 최고의 엔진인 React ( Next.js)를 기반으로 서버 렌더링 및 SEO 최적화 기능을 기본 제공합니다.
- 검색 결과 최적화 및 신경망 기반 추천 기능을 완벽하게 자동화했습니다.
비슷한 스타일
- Slite — 따뜻한 느낌의 양피지 노트에 테라코타 손잡이가 달려 있습니다. 모든 면은 크림색 종이로 되어 있고, 모든 포인트에는 은은한 오렌지색이 더해져 있습니다.
- Adora — 불투명 유리 너머로 보이는 인상주의 박물관
- Bento — 햇살이 비치는 리놀륨 바닥 위에 도시락통이 놓여 있다. 따뜻하고 부드러운 크림색 리넨 위에는 라임, 라벤더, 코발트, 버건디 색상의 둥근 스티커 같은 카드들이 격자 모양으로 배열되어 있고, 각 카드에는 굵은 검정 잉크로 테두리가 그려져 있다. 그 아래에는 대담하고 기하학적인 제목문이 적혀 있다.
- Payments — 고급스러운 보라색 배경에 생기 넘치는 시트러스 색상이 돋보입니다. 깊고 강렬한 보라색은 밤하늘을 연상시키고, 레몬 옐로우 색상은 깨끗한 흰색 표면 위에서 신선한 시트러스 껍질처럼 반짝입니다.
- Textla — 햇살 가득한 레트로 식물 달력 - 크림색 노란색 페이지에 짙은 녹색으로 인쇄되었으며, 선인장 그림이 선명하고 어긋난 그림자로 표현되어 있습니다.
- AI for Business — 따뜻한 회색 톤의 브루탈리즘 양식 편집 쇼룸
- Superhuman — 골든아워 편집 패널
- Visitors — 흰색 엔지니어링 도면
- Vercel — 흰 종이에 인쇄된 터미널
- Jeton — 따뜻한 대리석 위에 핀테크에 관한 사설
- Say Briefly — 크림색 종이에 그린 크리에이티브 에이전시 스케치북
- ClickUp — 흰색 대리석 위에 펼쳐진 강력한 대시보드. 이 페이지는 생산성 도구의 제품 브로셔이므로, 시각적 언어는 제품 자체에서 차용되었습니다. 빽빽한 목록, 상태 표시기, 아바타 그룹, 그리고 마치 제품 사양서를 전시해 놓은 듯한 대담한 서체 문구들이 그 예입니다.