Design Assignment

6 min readJul 4, 2022

As the title suggests, this was a design assignment that I did for a company hiring process. I’ll be sharing my whole design process that I followed while doing the assignment.

Time frame: 3 Days

Note: I will not be making any edit to the solution that I shared with the company, I will share the exact design that I shared with the company for the hiring process.

Problem Statement

(Received from the company)

Teachers of Teachmint want to sell their courses online. These courses will be sold on their website. (You can also come up with other venues to sell these courses). There will be 5 steps involved to help teachers create a course (Both web and mobile version for all the screens is expected).

Task 1: Course Creation

Step 1: Overview of the course: This includes name, description, and language (you can add other things if you deem them necessary).

Step 2: Pricing: This includes discounts and final pricing of the course.

Step 3: Course content: Teachers can upload images, documents, camera pictures, Youtube links, study materials from Teachmint and other files available on their devices.

Step 4: In case the teacher has not created a payment profile — nudge them to do so. The amount received from any course sold should go into the teacher’s bank account or UPI.

Step 5: In case the teacher has not created the website — nudge them to do that too. You can think of other ways for teachers to showcase and sell their courses.

You can change the order of the above steps as per your understanding.

Task 2: Edit Course

Once the course is published, where should the teacher go to edit this course? (Go through the Teachmint app and decide where we should display the courses section)

Task 3: Student View

Finally, showcase how the course would look to any student who lands on the teacher’s website.

Target audience: Teachers within the age bracket (25–45). Try to give a premium feel to the overall product.

Design Solution

Task 1: Dashboard for the Teachers

Type of users

School teachers
Tuition teachers
Youtubers

General user Persona

Ashish is a 29 Y/O old tuition teacher and an educational YouTuber from Kanpur. He wants to sell courses on Mathematics.
Varun Yadav is a 33 Y/O old Frontend developer from Delhi. He wants to sell courses on front-end development in his free time.

Use cases

Create course
Sell it on the personal website(by Teachmore)
Listing on 3rd party platforms
Edit courses once published, ex. price change, delete, unpublish etc.

Benefits

Easily create course
Accept payments easily using UPI
Sell anywhere

Main steps of the story

For creating course

Users go to the dashboard > Create course(Setting up basic info, setting up the course content, pricing) > Publish course on personal website + other platforms

Creating an online course is a pretty long process. Starting from planning the course topic to researching about it and then finally recording it, and collecting various resources. The next step involves putting everything together in one place and making it accessible to the students via web/mobile.

Here our main goal is to make the process of creating online courses easy for all the teachers out there. It includes multiple steps like setting up the details of the course, pricing, contents, offers, distribution and much more.

To make the overall process of creating a course easy for the teachers, we will be breaking down the overall process of creating the course into 5 simple steps.

Here users can easily toggle between any of the 5 steps.

Basic details > Course content > Course rules > Pricing and Promotions > Publish

Things to be added in each step

To come up with this, I used the card sorting technique, where I took all the edit options(Ex title, pricing, offers, SEO, etc) and put them into the below 5 categories where it makes the most sense.

Basic details

Course title
Course short description
Full description
Cover image
Course trailer
Course Category
Course language

2. Course Content

Create section
Add resources

3. Course rules

Enforce Lesson Order
Enforce Video Watching
Start course on a specific date
Course validity
Only available on the app
Recommend other courses

4. Pricing and Promotions

Setting the base price
Discounted price
Coupons
SEO

5. Publish

Publish on own website
Publish on 3rd party platform
Option to create a website

Helping the users at each step

To make the process of creating the course easier for the teachers, I added tooltips, relevant links, and suggestions to make sure the user doesn’t feel lost at any point and easily navigates around without any problem. For example:

Putting a relevant link for writing a proper course description with the course description I/O field and giving the option to directly upload the description in PDF format.
Sharing a link on how to create an effective course trailer video creating for a better conversation rate.
Showing the real-time discount percentage while setting up the course pricing which will help the users take clear decisions while setting up the pricing up the price.
Giving suggestions to the users to complete the necessary task which will help in publishing the course like, setting up the bank details for payment processing and setting up the website for publishing the course content.

Final Web-version: prototype and the source file.

Task 2: Designing the admin dashboard in the mobile app of Teachmint (Teachers’ side)

Courses will be a new feature that needs to be added to the existing Teachmint mobile app. The new feature is the primary feature for the users, which means it should be visible after opening the app and should be easily accessible by the users, So to do that I added it to the bottom navigation bar of the app instead of putting in the sidebar or any other place.

While designing the courses section in the Teachmint mobile app, putting all the editing options the same as the web version is not a very feasible option. Overall it will not be easy to create the whole course only on mobile for the teachers.

Navigating around different sections is comparatively easier in the web version compared to the app. In the web version, there were 5 major steps which included several minor steps while creating courses. But when it comes to apps, it is not a very feasible thing. So to ease down the process I created 5 main steps and the further created sub-steps in a few of the main steps.

Some of the steps were omitted in the app version and the users were given instructions to login into the Teachmint web version by Scanning the QR code and doing the necessary editing from the web version.

Some of the reasons behind omitting particular steps:

Course content section: Creating a course includes a lot of big files and putting everything on a mobile phone is less feasible. Also navigating around multiple videos, images, links, and documents is not convenient on mobile. So east down this, users were given the option to go to the web version and upload all the content. In the app version, users get the basic edit options like a rearrangement of sections/chapters/files and deleting any specific section or files. etc.
SEO section: The SEO section includes a very long form and filling out the form on mobile will be a very tedious process for the users.
Creating their website: For creating their website the users will be redirected to the web version, where they can easily create the website and preview it in real-time on the browser.