온라인 강의 서비스 운영사 개발 사례

LMS 개발
온라인 강의 플랫폼

온라인 강의 플랫폼 리뉴얼

운영 중이던 온라인 강의 서비스를 전면 리뉴얼한 프로젝트입니다. 고객사가 준비한 기획과 디자인을 받아 DB와 API를 설계하고, 동영상 수강, 결제와 쿠폰, 선물하기, 나의 강의실과 수료증을 개발하였습니다. 기존 회원과 수강 기록을 새 시스템으로 옮기고 서비스 중단을 줄여 전환하였습니다.

  • LMS개발
  • LMS구축
  • LMS시스템
  • 학습관리시스템
  • 온라인교육플랫폼
  • 온라인강의플랫폼
  • 인강사이트
  • 홈페이지리뉴얼
  • 페이팔결제
  • 수료증발급
고객사
온라인 강의 서비스 운영사
범위
개발 (기획 · 디자인은 고객사)
플랫폼
PC · 모바일 반응형 웹
기간
설계부터 전환까지 2.5개월

LMS 의뢰 전
궁금한 여섯 가지

두꺼운 기획서와 디자인 출력물을 내려놓는 기획 담당자와 기능이 사슬처럼 이어진 그림을 보여 주는 PM

01개발 순서

기획 담당자기획과 디자인은 준비되었습니다. 기능이 많은데 어디부터 만듭니까?

흐름소프트기능 사이의 연결을 먼저 정리해 가입, 강좌, 결제, 수강, 리뷰 순서로 만드는 방안을 제안합니다.

기획 담당자그 순서로 하겠습니다.

재생 단추와 진도 막대, 커리큘럼이 있는 큰 화면 옆의 PM과 기획 담당자

02동영상

기획 담당자영상 서버를 직접 두어야 합니까?

흐름소프트상용 동영상 API를 연동하고 진도율과 이어보기를 붙이는 방안을 제안합니다.

기획 담당자API로 하겠습니다.

결제 화면과 쿠폰, 선물 상자 아이콘이 있는 노트북 앞의 PM과 기획 담당자

03결제

기획 담당자해외 수강생과 쿠폰, 선물하기도 필요합니다.

흐름소프트페이게이트와 페이팔을 함께 붙이고, 쿠폰과 선물하기를 결제 흐름에 묶는 방안을 제안합니다.

기획 담당자둘 다 붙이겠습니다.

진도 막대가 있는 대시보드와 수료증을 들어 보이는 PM

04강의실

기획 담당자수강생이 자기 진도와 결제를 한눈에 보아야 합니다.

흐름소프트나의 강의실에 수강 현황, 결제와 쿠폰 내역, 수료증을 모으는 방안을 제안합니다.

기획 담당자한곳에 모으겠습니다.

옛 서버에서 새 서버로 회원 카드가 옮겨지는 그림 앞의 PM과 기획 담당자

05데이터 이관

기획 담당자기존 회원과 수강 기록은 그대로 있어야 합니다.

흐름소프트기존 데이터를 새 DB 구조로 옮기고 건수를 대조하는 방안을 제안합니다.

기획 담당자그렇게 옮기겠습니다.

자정 무렵 새 사이트가 켜진 화면 앞에서 안도하는 PM과 기획 담당자

06전환

기획 담당자사이트를 오래 멈출 수 없습니다.

흐름소프트이용이 적은 시간에 마지막 동기화와 주소 전환을 함께 하는 방안을 제안합니다.

기획 담당자그 시간에 전환하겠습니다.

Main Page

실제 메인 화면

추천 강좌 배너, 신규·인기 강좌, 오프라인 강좌, 수강평이 있는 메인 화면

Projects Detail View

강좌 선택부터 결제와 수강까지
실제 화면

강좌 목록과 태그 필터가 있는 전체 강좌 화면
전체 강좌
강사 소개, 강좌 정보, 맛보기 영상, 커리큘럼이 있는 강좌 상세 화면
강좌 상세 · 맛보기 영상
영상과 커리큘럼, 다음 강의 단추가 있는 수강 화면
동영상 수강 · 커리큘럼
수강 중 강좌의 진도율과 수강 완료 강좌가 있는 수강 현황 화면
나의 강의실 · 수강 현황
주문 정보, 구매자 정보, 결제 수단을 고르는 결제 화면
결제
받는 회원을 찾아 강좌를 선물하는 화면
선물하기
쿠폰 등록과 사용 내역 화면
쿠폰 내역
수료한 강좌의 수료증 발급 화면
수료증 발급
기간별 결제 내역과 환불 상태 화면
결제 내역 · 환불
강사별 강좌를 고르는 강사 목록 화면
강사별 강좌

Responsive Design

모바일에서도
같은 강좌를 수강합니다

모바일 메인 화면
모바일 강좌 상세 커리큘럼 화면
모바일 수강 화면
모바일 수강 현황 화면
모바일 결제 화면

Font Concept

나눔고딕 한 가지로
읽기 쉬운 강좌 화면

본문 · 메뉴NanumGothic

가나다라마바사아자차카타파하 ABCDEFGHIJKLMN abcdefghijklmn 1234567890

배너 제목Slides Caption

60pt · Bold

  • Bold

    온라인 강좌 · 오프라인 강좌 · 광장 · 내 강의실

  • Regular

    전체 강좌 · 테마 · 강사별 · 패키지 · 무료존

  • Menu 16pt

    Online courses   Offline courses   Square   My classroom

Color Concept

버튼과 진도는 연두
바탕은 짙은 회색

  • Main#BED730
  • Black#1A1A1A
  • Dark#2E2E2E
  • Gray#808080
  • Point#EE9900
  • Sub#77DAED
  • Sub#EE9C9E
  • Bg#FFFFFF

서로 물린 기능을
순서대로 이었습니다

기존 데이터를 옮기고
2.5개월 만에 전환

기획 검토 · 설계2주

기능 개발가입 → 강좌 → 결제 → 수강 → 리뷰

시나리오 테스트 · 데이터 이관2주

전환1주

  • Spring · MySQL
  • HTML · CSS · JS
  • Jenkins · Apache 배포

이런 프로젝트에 맞습니다

  • 자체 브랜드로 운영하는 인강 사이트
  • 운영 중인 사이트의 전면 리뉴얼
  • 기획·디자인을 갖춘 팀의 개발 외주
  • 국내외 결제와 쿠폰이 필요한 교육 서비스
  • 수료증과 진도 관리가 필요한 교육 기관

자주 묻는 질문

비용과 기간

LMS 개발 비용은 어떻게 산정합니까

강좌 유형, 동영상 연동, 결제 수단, 쿠폰과 선물하기, 강의실과 수료증, 데이터 이관 범위를 기준으로 산정합니다. 범위를 정리한 뒤 견적서로 안내합니다.

LMS 구축 기간은 얼마나 걸립니까

본 사례는 기획과 디자인이 준비된 상태에서 설계부터 전환까지 2.5개월이 걸렸습니다.

기획과 디자인이 있으면 개발만 맡길 수 있습니까

가능합니다. 본 사례는 고객사의 기획서와 디자인을 받아 개발만 맡았습니다.

강의와 수강

동영상은 어떻게 올리고 재생합니까

상용 동영상 API를 연동해 재생합니다. 직접 영상 서버를 두는 것보다 트래픽과 화질 관리가 수월합니다.

진도율과 이어보기가 됩니까

됩니다. 강의별 진도율을 기록하고, 멈춘 지점부터 이어서 보도록 하였습니다.

패키지 강좌나 무료 강좌도 만들 수 있습니까

가능합니다. 단과, 패키지, 무료, 오프라인 강좌를 함께 운영하도록 하였습니다.

수료증을 자동으로 발급할 수 있습니까

가능합니다. 수강을 마치면 나의 강의실에서 수료증을 발급하도록 하였습니다.

모바일에서도 수강할 수 있습니까

가능합니다. PC와 모바일 반응형으로 만들어 같은 강좌를 봅니다.

결제와 회원

해외 결제도 붙일 수 있습니까

가능합니다. 본 사례는 국내 결제는 페이게이트, 해외 결제는 페이팔로 연동하였습니다.

쿠폰과 선물하기는 어떻게 동작합니까

결제 단계에서 쿠폰을 적용해 금액을 줄이고, 선물하기는 받는 사람을 지정해 대신 결제하면 받는 사람의 강의실에 강좌가 들어갑니다.

소셜 로그인을 넣을 수 있습니까

가능합니다. 네이버와 페이스북 로그인을 넣었습니다.

환불 처리도 됩니까

결제 내역에서 환불을 요청하도록 하고, 수강 진도에 따른 환불 기준은 고객사 정책에 맞춥니다.

리뉴얼과 운영

운영 중인 사이트를 리뉴얼해도 기존 데이터가 남습니까

남습니다. 기존 회원과 수강 기록을 새 DB 구조로 옮기고 건수를 대조하였습니다.

전환할 때 사이트가 멈춥니까

이용이 적은 시간에 마지막 데이터 동기화와 주소 전환을 함께 해 중단 시간을 줄였습니다.

기능이 서로 얽혀 있는데 테스트는 어떻게 합니까

가입, 강좌 검색, 쿠폰 적용, 결제, 수강, 리뷰까지 실제 사용 순서대로 시나리오 테스트를 반복하였습니다.

LMS 솔루션을 쓰는 것과 무엇이 다릅니까

직접 개발하면 화면과 결제, 정책을 서비스에 맞게 정하고, 수강생 데이터를 직접 관리합니다.

출시 후 수정도 맡길 수 있습니까

가능합니다. 유지보수 계약으로 기능 개선과 오류 수정을 지원합니다.

자료를 보내기 전에 NDA를 먼저 체결할 수 있습니까

가능합니다. 비밀유지계약을 먼저 체결한 뒤 기획서와 자료를 받아 검토합니다.

유사한 시스템 문의하기