1BOOK(Not Released)

‘원북(1book)’의 디자인은 하루에 한 권으로 스마트하게(One Day One Book)라는 교육 철학을 바탕으로 아이들이 스스로 공부하고 재미있게 성장할 수 있는 환경을 웹사이트 전반에 일관되게 구현했습니다. 로고, 폰트, 컬러, 아이콘, UI 컴포넌트를 체계적으로 정립한 디자인 시스템을 구축하여 브랜드 고유의 톤앤매너를 유지했습니다. 인지 발달 단계를 고려한 사용자 친화적 UI/UX 설계와 함께 PC 및 모바일 환경 모두에 최적화된 인터페이스를 제공하여 어린 학습자부터 학부모까지 모두 쉽고 편리하게 접근할 수 있도록 완성했습니다.

아이들에게 친근하면서도 높은 가독성을 제공하기 위해 부드러운 곡선 미가 돋보이는 ‘나눔스퀘어 라운드' 서체를 선택했습니다. 타이틀, 서브타이틀, 본문의 위계 구조를 명확히하고 자간과 행간을 세밀하게 조정하여 시스템을 정립했습니다. 학습의 열정과 에너지를 상징하는 레드 계열을 메인 컬러로 정립했습니다. 메인 컬러인 ‘원북 레드’를 중심으로 ‘다크 레드'와 ‘버건디'로 무게감을 더하며 배경 및 서브 톤으로 ‘라이트 레드’와 ‘원북 BG’를 활용하여 시각적 피로도를 줄이면서도 통일감 있는 무드를 연출했습니다.

원북의 아이콘 디자인은 키라인(Key Line) 그리드 시스템을 기반으로 제작되어 시각적 균형감과 정밀함을 고려했습니다. 직관적인 형태의 ‘웹 시스템 아이콘'으로 네비게이션의 사용성을 극대화하며 교육 콘텐츠의 특성을 살린 ‘맞춤형 그래픽 아이콘'을 추가 제작했습니다. 학습 주제와 동기부여 요소들을 브랜드 톤에 맞춘 생동감 넘치는 일러스트형 아이콘으로 녹여내어 아이들에게 보다 풍부하고 흥미로운 시각적 경험을 제공합니다.

방대하고 복잡한 교육 플랫폼에서 일관된 사용자 경험(UX)을 유지하기 위해 원북만의 독자적인 UI 컴포넌트 디자인 시스템을 체계적으로 설계했습니다. 버튼, 그림자, 학습 상태를 나타내는 배지, 셀렉박스, 페이지네이션 등 핵심 요소를 규격화했습니다. 이를 통해 디자인 일관성을 확보하며 실제 개발 과정에서의 효율성을 고려했습니다.

PC 환경과 모바일 환경을 아우르는 웹 반응형 디자인을 적용했습니다. 1) PC 환경 : 그리드 레이아웃을 활용해 대시보드 내의 캘린더 등 다채로운 학습 콘텐츠 가드, 주간 요약 리포트 등을 구조적이고 와이드하게 배치하여 시각적으로 개방감을 주었습니다. 2) 모바일 환경 : 작은 화면에서의 가독성을 최우선으로 고려했습니다. 레이아웃을 단순화하고 하단 고정 네비게이션을 적용해 편리함을 제공합니다.

메인 웹사이트 외에도 실제 아이들이 학습을 진행하는 E-Learning 화면은 게임화된 UI/UX로 기획되었습니다. 장시간 화면을 보아도 눈이 피로하지 않도록 신비로운 ‘우주·은하수' 테마의 다크한 배경을 적용했으며 단어 맞추기, 문장 배열하기, 카드 배치하기 등 다양한 학습 퀴즈 UI를 아기자기하고 입체적인 컴포넌트로 디자인했습니다. 정답을 맞혔을 때 나오는 ‘Good Job!’ 등의 시각 피드백 효과를 활용하여 아이들의 성취감을 자극하고 몰입도를 높이는 요소들을 제작했습니다.