Sign In

E&C Slashpage 상담센터형 디자인 적용안

1. 사이트 기본 설정

•
사이트 이름: E&C 질문을 만나다
•
공개 URL: https://slashpage.com/enc
•
대표 문장: 글자로 외운 추상어는 오래 남지 않습니다.
•
검색 설명: E&C 감각-어휘 통합 세상읽기. 몸의 감각에서 시작해 감정, 관계, 추상어와 문해력으로 이어지는 학습상담센터 프로그램입니다.
•
공개/검색: 검색 엔진 공유 켜기, SEO/GEO 메뉴에서 제목과 설명 입력

2. 디자인 톤

•
전체 분위기: 상담센터형, 따뜻함, 안정감, 전문성
•
배경: 크림/아이보리 계열
•
포인트 컬러: 딥블루 + 세이지그린 + 클레이오렌지
•
권장 색상값
◦
배경: #FBF6EE
◦
본문 카드: #FFFDF9
◦
메인 블루: #236DA8
◦
딥블루: #184C73
◦
세이지그린: #7D9A7A
◦
클레이오렌지: #C27755
◦
본문 글자: #241F1B
◦
보조 글자: #665C52

3. Slashpage 설정값

•
페이지 폭: 넓게
•
헤더: floating header 켜기
•
사이드바 아이콘: 숨김
•
메뉴 정렬: 오른쪽
•
배경: 아이보리 단색 또는 은은한 그라데이션
•
구분선: 얇게, #E0D4C6, solid
•
버튼: 둥근 버튼, 메인 버튼은 딥블루 배경 / 흰색 글자
•
카드: 흰색 또는 아이보리, 둥근 모서리, 약한 그림자 느낌

4. 블록 구성 순서

Hero

•
블록 형태: 넓은 커버/히어로 섹션
•
배경: 크림 → 연한 블루 그라데이션
•
왼쪽: 큰 제목과 CTA 버튼
•
오른쪽: 상담 대화 예시 카드 2개
입력 문구:
E&C 감각-어휘 통합 세상읽기

글자로 외운 추상어는
오래 남지 않습니다.

몸으로 느끼고, 언어로 이해할 때 비로소 아이의 말이 됩니다.
E&C는 아이가 단어를 외우는 것이 아니라 자신의 경험을 언어로 설명하는 힘을 갖도록 돕습니다.
버튼:
•
첫 상담 문의하기 → mailto:eandc.lcc@gmail.com
•
프로그램 살펴보기 → 아래 배움 흐름 섹션
오른쪽 카드:
before
"몰라요. 그냥 짜증나요."

after
"가슴이 답답해서 화가 난 것 같아요."

핵심 방향 3카드

3열 카드로 배치:
1.
몸에서 출발합니다
•
아이의 실제 감각과 경험을 먼저 듣습니다.
2.
언어로 정리합니다
•
감정, 상황, 관계를 말로 연결합니다.
3.
문해력으로 이어집니다
•
추상어를 자기 경험과 연결해 이해합니다.

소개 섹션

•
제목: 읽기는 되는데, 왜 이해는 어려울까요?
•
3열 카드:
◦
읽기는 가능하지만 이해는 어렵습니다
◦
감정은 느끼지만 표현은 서툽니다
◦
생각은 있지만 말로 정리하기 어렵습니다
•
강조 박스: 딥블루 배경
강조 문구:
우리는 아이가 단어를 외우는 것이 아니라,
자신만의 언어를 만들어 가도록 돕습니다.

배움 흐름 섹션

•
블록 형태: 타임라인 또는 번호 카드 4개
•
카드 색상: 흰색 카드, 번호 원형 배지
1.
몸의 감각을 알아차리기
2.
감정을 언어로 표현하기
3.
관계를 이해하는 언어 배우기
4.
추상어와 문해력으로 확장하기
추상어 태그:
배려 · 책임 · 공정 · 존중 · 정의 · 공동체

과학적 바탕 섹션

•
배경: 아주 연한 블루/아이보리
•
3열 카드:
◦
몸·마음·관계가 함께 자라는 모델
◦
신체화된 인지
◦
메타인지 기반 자기관찰

아이에게 생기는 변화 섹션

•
2열 카드:
◦
자신의 상태를 설명할 수 있습니다
◦
감정 표현이 풍부해집니다
◦
글을 이해하는 힘이 깊어집니다
◦
스스로 질문하는 아이가 됩니다

철학 섹션

•
블록 형태: 풀폭 강조 배너
•
배경: 딥블루 → 세이지그린 그라데이션
•
제목: 감정과 학습을 따로 보지 않습니다.

문의 섹션

•
블록 형태: CTA 카드
•
제목: 아이의 말이 막히는 지점부터 함께 살펴봅니다.
•
버튼/링크:
◦
Email: eandc.lcc@gmail.com
◦
Instagram: https://www.instagram.com/eandc.lcc/
◦
Threads: https://www.threads.com/@eandc.lcc

5. 바로 참고할 완성 HTML 시안

완성형 상담센터 홈페이지 디자인은 아래 파일에 구현되어 있습니다.
/Volumes/LEARNING/E&C/04_브랜딩/홈페이지/E&C_상담센터형_홈페이지_시안_2026-06-29.html
Made with Slashpage