01
정보 구조
무엇을 먼저 보고 어떤 순서로 행동할지 정합니다.
디자인 · 비교형
같은 앱도 분위기가 달라지는 디자인 콘셉트 6가지
색상만 바꾸는 것이 아니라 정보 우선순위, 글자, 컴포넌트와 그래픽까지 서비스 성격에 맞게 설계하는 기준을 확인합니다.
약 14분화면과 구현 기준
UI CONCEPTS3가지 화면 언어
GLASS
EXPRESSIVE
CLEAR
2:30 PM
같은 기능 · 다른 인상
먼저 이해할 내용
화면 뒤에서 함께 결정해야 하는 기준입니다
같은 예약 목적을 유지한 채 정보 순서와 화면 구성까지 다르게 설계해 신뢰·친근함·프리미엄·커뮤니티·업무 효율·웰니스 방향을 비교합니다.
- 01
사용자·핵심 행동
- 02
디자인 언어 비교
- 03
주요 화면 구성
- 04
전체 규칙 확장
직접 비교하기
기능은 같아도 디자인에 따라 인상이 달라집니다
아래 콘셉트를 눌러보세요. 예약이라는 목적은 같지만 서비스 성격에 따라 정보 우선순위, 화면 구성, 글자, 컴포넌트와 그래픽 표현까지 다르게 설계했습니다.
01선택한 디자인
신뢰 중심
정돈되고 안정적인 인상
정보의 정확성과 안정감을 먼저 전달합니다.
- 잘 맞는 서비스
- 의료·금융·공공 서비스
- 화면 표현 기준
- 또렷한 글자와 규칙적인 간격
- 정보 우선순위
- 확정 상태와 일정을 가장 먼저 표시
- 컴포넌트·그래픽
- 규칙적인 카드와 분명한 상태 배지
- 장식보다 정보 이해를 돕는 아이콘 중심
예약 현황
안녕하세요, 김고객님
1예약
4완료
0문의
확정된 상담예약 확정
9월 4일 목요일
오후 2:30 · 30분 상담
실제 프로젝트에서는 한 가지 콘셉트를 그대로 고르기보다 서비스의 사용자, 목적과 운영 환경을 기준으로 필요한 요소를 조합합니다.
색상보다 먼저 설계하는 것
디자인은 화면 전체의 규칙을 만드는 일입니다
같은 색을 사용해도 정보 순서와 글자 위계, 컴포넌트 규칙이 다르면 사용 경험은 완전히 달라집니다.
02
글자 위계
제목·본문·숫자의 크기와 대비로 읽는 속도를 조절합니다.
03
컴포넌트 규칙
버튼과 카드가 화면이 늘어나도 같은 원칙을 유지하게 합니다.
04
이미지 언어
사진·그래픽·아이콘이 브랜드의 한 분위기로 이어지게 합니다.
05
사용 반응
눌림·로딩·완료 상태를 사용자가 바로 이해하게 합니다.
디자인 콘셉트 비교
애플·구글·토스는 디자인을 어떻게 다르게 풀까요?
Liquid Glass, Material 3 Expressive, Toss Design System처럼 익숙한 디자인 언어의 차이를 살펴보고 우리 서비스에 필요한 원칙을 선택합니다.
9:41
오늘
나를 위한 일정
예약 확정
오후 2:30 상담
집중할 내용을 미리 확인하세요
Apple HIG · Liquid Glass
리퀴드 글래스
콘텐츠는 선명하게 유지하고 탐색·버튼 같은 조작 영역에 반투명 재질과 깊이감을 제한적으로 적용합니다.
잘 맞는 서비스미디어·개인화·프리미엄 서비스
TODAY
다가오는 일정을
한눈에 확인하세요
다음 예약
9월 4일
오후 2:30 · 30분
예약 변경문의하기
Google Material 3 Expressive
Material 3 Expressive
강조된 글자, 대비되는 형태, 동적 색상과 자연스러운 반응으로 중요한 정보와 행동을 빠르게 보여줍니다.
잘 맞는 서비스생활 서비스·개인화·다기능 플랫폼
예약 확인
목요일 오후 2시 30분,
상담이 예정되어 있어요
상담 전에 확인하면 좋은 내용을
미리 정리해 드릴게요.
상담 일정
9월 4일 · 30분
준비 사항3개
Toss Design System 계열
쉽고 명확한 금융 UX
쉬운 문장, 한 화면의 한 가지 목적과 일관된 컴포넌트로 복잡한 금융 행동을 부담 없이 완료하게 합니다.
잘 맞는 서비스금융·보험·결제·가입 서비스
오늘의 일정
한눈에 확인하세요
오후 2:30
상담 예약
3
준비 사항
담당자 확인
모듈형 대시보드
벤토 그리드
서로 다른 정보를 크기가 다른 블록으로 묶어 한눈에 탐색하게 합니다.
잘 맞는 서비스홈 화면·기능 소개·대시보드
PRIVATE JOURNALSEP 02
A quiet
moment
for you.
Thursday Session
14:30 · Personal care
매거진형 구성
에디토리얼
큰 제목, 이미지와 비대칭 여백으로 브랜드의 이야기와 분위기를 전달합니다.
잘 맞는 서비스콘텐츠·패션·브랜드 서비스
TODAY PICK
Book it.
Do it.
9월 4일 목요일
오후 2:30
강한 개성 중심
볼드 그래픽
선명한 색, 굵은 선과 예상 밖의 배치로 짧은 시간에 브랜드를 각인시킵니다.
잘 맞는 서비스커뮤니티·이벤트·젊은 타깃
OVERVIEW
예약 분석
128
전체
17
이번 주
월화수목금토일
오늘 처리할 예약4건
업무 도구형 구성
데이터 중심
숫자, 변화와 상태를 빠르게 비교하도록 밀도와 정렬 기준을 세밀하게 조정합니다.
잘 맞는 서비스관리자·SaaS·분석 서비스
서비스별 선택 기준
우리 서비스에는 어떤 콘셉트가 맞을까요?
업종만으로 정답이 정해지지는 않지만, 사용자가 가장 중요하게 여기는 행동을 기준으로 시작 방향을 좁힐 수 있습니다.
의료·공공·행정
신뢰 중심 + Material 계열
정확한 정보, 접근성, 상태 안내와 실수 방지가 우선입니다.
금융·보험·간편결제
신뢰 중심 + Toss Design System 계열
복잡한 조건을 쉬운 문장으로 바꾸고 한 번에 하나의 행동만 안내해야 합니다.
예약·주문·생활 편의
친근한 생활형 + Material 계열
처음 방문한 사용자도 설명 없이 핵심 행동을 시작해야 합니다.
뷰티·패션·멤버십
프리미엄 + 에디토리얼
기능을 모두 노출하기보다 이미지와 경험의 순서를 설계해야 합니다.
커뮤니티·교육·콘텐츠
활동적인 커뮤니티 + 벤토
사람, 새로운 콘텐츠와 참여 행동이 계속 눈에 들어와야 합니다.
B2B·관리자·SaaS
업무 효율형 + 데이터 중심
많은 정보에서도 우선순위와 처리 상태를 빠르게 구분해야 합니다.
건강·마음관리·반려
차분한 웰니스 + 콘텐츠 미니멀
사용자가 부담 없이 읽고 기록하도록 속도와 자극을 낮춰야 합니다.
실제 작업 과정
취향이 아니라 근거로 방향을 정합니다
고객이 원하는 분위기와 실제 사용자가 편하게 쓰는 방향이 다를 수 있어 주요 화면에서 먼저 비교하고 결정합니다.
- 01
사용자와 핵심 행동 확인
누가 어떤 상황에서 가장 먼저 무엇을 해야 하는지 정합니다.
- 02
서로 다른 방향 비교
한 가지 시안만 제시하지 않고 성격이 다른 방향을 주요 화면에서 비교합니다.
- 03
직접 눌러보며 확인
정적인 설명서 대신 실제 화면 흐름에서 이해하기 어려운 부분을 찾습니다.
- 04
화면 전체 규칙 확장
확정한 방향을 글자·간격·버튼·상태 규칙으로 정리해 전체 화면에 적용합니다.
확인할 내용
이 내용을 보면 알 수 있습니다
- 서비스가 전달해야 하는 첫인상과 핵심 행동 정하기
- Apple·Google 등 익숙한 디자인 원칙의 차이 이해하기
- 업종과 사용자 목적에 맞는 화면 구조 선택하기
판단 기준
실제 구현에서는 이렇게 확인합니다
- 01주요 사용자의 연령과 사용 환경에 맞는 정보 밀도인가
- 02중요한 행동과 상태가 글자·색상·배치로 분명하게 구분되는가
- 03화면이 늘어나도 컴포넌트와 그래픽 규칙을 유지할 수 있는가
우리 서비스에는 어떤 방식이 맞을지 궁금하다면
만들려는 서비스와 현재 준비된 내용을 알려주세요. 필요한 화면, 개발 구조와 우선순위를 30분 전화 상담에서 함께 정리합니다.