영어스터디센터 반응형 포트폴리오
모두가 만족할 결과물을 제시해 드립니다.
we deliver outcomes that satisfy everyone.
- 영어스터디센터 반응형
- 개발분야 : Website(웹사이트) / Responsible website(반응형웹) / AI 영어 말하기 학습 플랫폼(반응형웹)
영어스터디센터 반응형
AI 기반 영어 말하기 학습 플랫폼
[메인 화면 기획]
**AI 기술과 토론 중심의 영어 학습을 제공하는 '영어스터디센터'**의 교육 철학을 반영해,
다양한 영어 말하기 프로그램과 학습 정보를 직관적으로 탐색할 수 있는 웹사이트를 기획했습니다.
'Discuss in English. Think Beyond.'라는 핵심 메시지와 6가지 교육 강점을 메인 화면에 배치해,
방문자가 센터의 교육 방향과 차별화된 학습 프로그램을 쉽게 이해할 수 있도록 설계했습니다.
또한 토론 프로그램 탐색부터 일정 확인, 상담 신청까지 이어지는 사용자 흐름을 구성해,
학습 목적에 맞는 프로그램을 편리하게 선택할 수 있는 정보 구조를 구축했습니다.
말하기 중심 학습 구조 기획
[메인 디자인]
그린과 화이트 컬러를 중심으로 한 깔끔하고 학습 친화적인 디자인을 적용해,
영어 학습 플랫폼의 전문성과 신뢰감 있는 브랜드 이미지를 시각적으로 표현했습니다.
간결한 타이포그래피와 여백 중심의 레이아웃을 활용해,
교육 프로그램과 주요 학습 정보에 자연스럽게 집중할 수 있는 화면을 구성했습니다.
또한 초록색 포인트 컬러를 주요 버튼과 강조 영역에 일관되게 적용해,
시각적 통일성과 직관적인 정보 전달력을 갖춘 인터페이스를 구현했습니다.
학습 친화적 인터페이스 디자인
[콘텐츠 디자인]
센터 소개·온오프라인 그룹 토론·AI 음성토론·후기 및 신청문의를 4개 주요 메뉴로 구성해,
방문자가 다양한 영어 학습 프로그램을 목적에 따라 쉽게 탐색할 수 있도록 설계했습니다.
고급·중급·초중급 토론 그룹과 AI 기반 학습 프로그램을 체계적으로 분류하고,
요일별 시간표에서 온라인은 초록색, 오프라인은 남색으로 구분해 원하는 수업을 직관적으로 비교할 수 있도록 했습니다.
또한 실제 수강 후기와 교육 프로그램별 상세 정보를 제공해,
학습 과정에 대한 이해도를 높이고 상담 및 수강 신청으로 이어질 수 있도록 콘텐츠를 구성했습니다.
[웹사이트 UX/UI]
학습 프로그램 탐색과 빠른 상담 신청을 고려한 사용자 중심 UX/UI를 설계해,
상단 고정 헤더와 초록색 문의하기 버튼을 통해 어느 페이지에서든 상담에 쉽게 접근할 수 있도록 구현했습니다.
모바일에서는 주요 메뉴를 한 줄로 배치하고 긴 소개글의 가독성을 개선해,
작은 화면에서도 별도의 복잡한 탐색 없이 필요한 정보를 확인할 수 있도록 구성했습니다.
또한 지도·대중교통 안내·전화·카카오톡 채널을 직관적으로 배치해,
센터 방문과 상담에 필요한 정보를 편리하게 확인할 수 있는 사용자 동선을 설계했습니다.
PC·태블릿·모바일 환경에 대응하는 반응형 웹 디자인을 적용해,
다양한 디바이스에서도 일관된 학습 정보 탐색과 상담 경험을 제공하도록 구현했습니다.
