Demos · 배움 강의
Education · Online Classes
배움 강의
Enrollment and class management for online classes
Screens you visit inside the preview are also added to this tab's back history. To explore for longer, open it in a new window.
At a glance
This is a sample app for an online class service, built by Cocode with Flutter, CoUI and Serverpod. In the student app you find classes by category, sort order or search, pick a format and start date, and pay with the first enrollment coupon applied; in the admin console you go through students and classes, the lesson upload form and this month's sales. Cocode builds online course apps like this as outsourced projects, from planning and development to deployment and maintenance.
- Type
- Enrollment and class management for online classes
- Parts
- Student app · Admin console · Widgetbook · Golden gallery · Project documentation
- Tech
- Flutter · CoUI · Serverpod · Widgetbook
- Try it
- In your browser, no sign-up, with sample data
- Built by
- Cocode Inc.
Key features
6 features
- Finding classesNarrow down eight classes by drawing, cooking, fitness or languages, sort them by popularity, newest or price, or search by keyword.
- Enrollment flowOn the class page, pick a format and start date, then pay by card, bank transfer or easy pay with the first enrollment coupon applied. A confirmation screen follows.
- Admin homeSee questions waiting for an answer, students, revenue this month and average progress, the status of your classes and this week's new students at a glance.
- Student managementFilter students by active, completed or expired and by class, and check their progress and when they last studied.
- Classes and lesson uploadSee each class's students, average progress, rating and revenue this month, whether each lesson is public or scheduled, and fill in the lesson upload form and save a draft.
- SalesSee this month's revenue, enrollments, average order and refund rate, a revenue-by-week chart and the three best-selling classes.
Demo accounts
In both the app and the console, pick an account under “Choose a demo account” on the first screen. No password is needed.
- StudentBrowse classes · Enroll · Pay · My page
- Instructor · AdminDashboard · Classes · Students · Upload lesson · Sales
Screens to explore
5 in total. Each one opens right in your browser, in a new window.
- AppStudent appPick a class, then enroll and pay (opens in a new window)
- ConsoleAdmin consoleManage students, classes, lessons and sales (opens in a new window)
- WidgetbookWidgetbookScreen and component catalog (opens in a new window)
- GoldenGolden galleryScreen captures by device and theme, checked against the design (opens in a new window)
- DocsProject documentationStructure, conventions and design-check notes (opens in a new window)
Tech stack
About the demo environment
- A demo built around a fictional online class service. No real enrollments or payments are made, and no text messages are sent.
- It runs on sample data inside this browser, with no server, and reloading brings it back to the start. Do not enter real personal information.
- Changing the language keeps you on the same screen and switches sample data such as student and instructor names and class titles to that language.
- My learning and reviews in the app, and Questions and Settings in the console, are still coming soon and show only a placeholder.
Custom online course app development
From the first call to handover. We scope the work first, then give you a quote.
- ConsultationWe get in touch to understand your situation
- Scoping1 week. Screen list, then quote and contract
- Design & buildYou try an interim version every week
- HandoverRepository · Admin · Permissions · Documents
- Ops (optional)Store support and maintenance
FAQ
Can an online course platform be built as an outsourced project?
Yes. As in this demo, Cocode builds the student app and the admin console used by instructors and the operations team together. We start by learning how your classes are taken and run, then spend one week listing the screens before the quote and contract.
How is pricing determined?
It depends on what you want to build. We first define the scope with you and then give you a quote. How we set costs and how our contracts work are explained on the Process & pricing page.
How long does it take?
It depends on what you want to build. Tell us what you have in mind, and we will start by working out how long it would take. While the work is in progress, you can check a working interim version every week through a link and a test app.
Who owns the copyright and the deliverables?
Upon completion of acceptance and full payment, all economic rights in the copyright vest in your company — including the right to create derivative works — and we will not exercise moral rights in the deliverables. This is stated in the contract.
Shared components used across multiple projects, such as CoUI, are excluded from the transfer. Instead, you receive a copy of their source code together with the right to use and modify them without limits on term, quantity, or territory. Business logic, data structures, and brand elements unique to your company all belong to your company.
Does the scope include video playback and payments?
Features such as video playback, progress tracking and permissions differ from service to service, so we settle them in the consultation. This demo only shows enrollment, simulated payment and the admin screens, and parts that connect to external services, such as real payments or video streaming, affect the quote.
Need a system like this?
You can send us just three lines. That's where scoping starts.