성범죄 전문 변호사 홈페이지 | 이경복 With TEAM Teheran
첫 화면 메시지 → ‘확실한·남다른·진정한·든든한’ 4가지 내 편 소개 → 사건 단계 안내 → 확신이 가능한 이유 → 비용 안내 → 자주 묻는 질문 → 24시간 상담 신청 순으로 구성했습니다.
차콜과 짙은 네이비 톤에 연한 하늘색 포인트를 더해 신뢰감을 주고, 큰 숫자 타이포로 긴 페이지의 흐름을 만들었습니다.
Design Concept
4가지 내 편, 이경복
‘대형 로펌 변호사, 과연 그게 다일까요?’라는 질문으로 시작해 변호사 개인과 팀의 역량을 함께 보여 주는 것을 컨셉으로 삼았습니다.
큰 숫자 1·2·3·4와 ‘내편’ 타이틀로 섹션마다 한 가지 메시지가 남도록 구성했습니다.
차분한 어두운 배경과 밝은 섹션을 번갈아 두어 정보 밀도가 높은 페이지에서도 읽기 편하게 했습니다.
Design Elements
-
01
4가지 내 편 구성
확실한·남다른·진정한·든든한 4개 섹션이 각각 사례, 자격, 직접 상담, 팀 구성을 설명합니다.
변호사 선택 기준을 순서대로 읽도록 설계했습니다. -
02
변호사 팀 시각화
전문 변호사들의 인물 사진을 여러 줄로 가득 채워 보여 줍니다.
사건에 함께 투입되는 팀의 규모가 한눈에 느껴지도록 구성했습니다. -
03
비용·FAQ·상담 마무리
비용 안내와 자주 묻는 질문을 검색창·아코디언으로 정리했습니다.
마지막에 24시간 즉답 상담 버튼을 두어 문의로 이어지게 했습니다.
Responsive
디바이스 대응
PC · 태블릿 · 모바일 전 환경에서 정보의 순서와 사용성이 동일하게 유지되도록 반응형으로 설계했습니다.
Desktop
1920 × 1080
데스크톱
Tablet
768 × 1024
태블릿
Mobile
375 × 812
모바일
Design System
컬러 팔레트와 타이포그래피를 시스템으로 정의해 화면 전반에 일관된 규칙을 적용했습니다.
Colors
- Point Color#A8C7E8
- Gray#8F949C
- Light Gray#E9E9EC
- White#FFFFFF
Typography
Aa 가나다 Pretendard
가나다라마바사아자차카타파하
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789
- 가나다 Aa
- 가나다 Aa
Regular · Bold
Main Page
메인 페이지
첫 화면에서 브랜드와 핵심 서비스를 먼저 보여주고,
스크롤 흐름에 따라 필요한 정보로 자연스럽게 이어지도록 구성했습니다.
스크롤하여 전체 보기 ↓
Mobile
모바일 환경에서 자주 쓰는 기능을 손이 닿는 곳에 배치했습니다.
Bottom Bar
Optimization
-
Menu
PCMenu · 상단 가로 메뉴와 contact 버튼
MOMenu · 햄버거 메뉴
-
Layout
PCLayout · 풀폭 섹션 번갈아 배치
MOLayout · 1단 세로 스택
-
Typography
PCTypography · 큰 숫자와 굵은 제목
MOTypography · 숫자·제목 크기 단계 축소
-
Image
PCImage · 인물 사진 중심 히어로
MOImage · 인물 비중 유지하며 크롭
이런 홈페이지, 우리 법무법인도 가능할까요?
변호사 · 법무법인 홈페이지만 100개 이상. AI 검색 노출 설계까지 기본으로 넣어 드립니다.
