개요

본 프로젝트는 NEXT INSTITUTE의 ‘웹 실전 프로젝트’ 수업에서 진행한 '강의 관리 시스템’ 웹 서비스입니다.
이 서비스를 위해 기존에 강의를 하며 사용하게 되는 여러가지 서비스들의 장점을 모으고, 보기 좋은 디자인으로 접근하기 위해 노력하였습니다. 이 서비스가 추구하는 목표는 학생들이 학습하고 배우는 과정을 체계적으로 아카이빙하는 것입니다. 그 이유는 모든 학생들은 각자 학습속도가 다르므로, 학생들 개개인의 NEXT STEP은 달라질 수 밖에 없습니다. 따라서 그 모든 STEP들을 아카이빙하여 모든 학생들이 자신의 NEXT STEP으로 나아가기 위해 발판을 마련하고자 합니다. 그 체계적인 아카이빙 과정은 이 웹서비스와 교수님들이 함께 해주실 것입니다.    

스펙  

• frontend
  • React.js
  • Redux
• backend
  • Spring boot
  • Spring Security
  • Spring REST
• database
  • MySQL

frontend와 backend는 완전히 분리되어 개발되었으며, 각각의 소스코드는 브랜치를 통해 업데이트 됩니다.
두 영역은 각자 서버에서 배포되며, CORS를 통해 통신합니다.

브랜드  

이 서비스의 이름인 NEXT STEP은 개발을 학습하는 모든 학생들의 NEXT STEP을 마련해준다는 목표를 가지고 있습니다. 그래서 브랜드 이미지는 교육적인 브랜드의 성격과 NEXT STEP이라는 단계를 표현하기 위해 책을 계단 모양으로 쌓아놓은 방식으로 표현되었습니다.

디자인  

화면에 대한 와이어프레임과 스토리보드에  대한 디자인 작업은 외주나라를 디자이너를 컨택했고, 작업을 진행하였습니다. 디자이너와는 총 3번의 미팅을 진행하였으며, 페이스북 그룹을 만들어 작업 중간중간에 작은 단위로 피드백을 주고받기 위해 노력하였습니다. 그 결과 약 3주간의 기간에 걸쳐 디자인 소스들을 완성하였습니다. 디자이너가 작업해준 작업 목록은 아래와 같습니다.

• 로고
  • 4가지 형태의 로고
  • 로고 가이드라인
• 레이아웃
  • 16장의 화면디자인  
  • 레이아웃 그리드 가이드라인
  • 기본 CSS

디자인 소스는 design-resources 브랜치를 통해 확인할 수 있습니다.