UI UX Designer - Webileapps

UI UX Designer - Webileapps

DocTutorials

UI UX Designer - Webileapps

DocTutorials

DocTutorials

UI UX Designer - Webileapps

DocTutorials

UI UX Designer - Webileapps

DocTutorials

DocTutorials

DocTutorials is designed for medical students who plan on taking competitive examinations. With comprehensive study materials, it features video tutorials, practice tests, and personalized study plans that allow the users to organize better learning. With a tight focus on quality content and tailored learning paths, DocTutorials attempts to support students in mastering complex medical concepts and achieving success in exams.

DocTutorials is designed for medical students who plan on taking competitive examinations. With comprehensive study materials, it features video tutorials, practice tests, and personalized study plans that allow the users to organize better learning. With a tight focus on quality content and tailored learning paths, DocTutorials attempts to support students in mastering complex medical concepts and achieving success in exams.

DocTutorials is designed for medical students who plan on taking competitive examinations. With comprehensive study materials, it features video tutorials, practice tests, and personalized study plans that allow the users to organize better learning. With a tight focus on quality content and tailored learning paths, DocTutorials attempts to support students in mastering complex medical concepts and achieving success in exams.

Overview

Overview

Overview

DocTutorials is a medical exam prep app and website that, while on-brand, felt visually outdated, cluttered, and tiring to use for long study sessions. Students found it hard to quickly find the right content and move smoothly between videos, tests, and other resources. There was no simple way for learners to shape the app around their own study style or build a structure that matched their exam timeline. The experience also lacked clear analytics, making it difficult for students to understand how they were performing or where they were falling behind. These issues together made the overall learning journey feel confusing, less motivating, and not fully supportive of serious exam preparation.

DocTutorials is a medical exam prep app and website that, while on-brand, felt visually outdated, cluttered, and tiring to use for long study sessions. Students found it hard to quickly find the right content and move smoothly between videos, tests, and other resources. There was no simple way for learners to shape the app around their own study style or build a structure that matched their exam timeline. The experience also lacked clear analytics, making it difficult for students to understand how they were performing or where they were falling behind. These issues together made the overall learning journey feel confusing, less motivating, and not fully supportive of serious exam preparation.

The Problem

The Problem

DocTutorials is a medical exam prep app and website that, while on-brand, felt visually outdated, cluttered, and tiring to use for long study sessions. Students found it hard to quickly find the right content and move smoothly between videos, tests, and other resources. There was no simple way for learners to shape the app around their own study style or build a structure that matched their exam timeline. The experience also lacked clear analytics, making it difficult for students to understand how they were performing or where they were falling behind. These issues together made the overall learning journey feel confusing, less motivating, and not fully supportive of serious exam preparation.

The Problem

Research

Research

Research

Competitive and SWOT Analyses

Competitive and SWOT Analyses

Strengths

strong confidence and trust due to expert-led, in-depth content, but only after investing significant time and effort.

Weakness

Dense information architecture and long learning paths increase cognitive load, causing fatigue and drop-offs for overwhelmed users.

Opportunity

Simplifying learning paths and improving personalization could make PrepLadder more accessible to diverse study styles.

Threat

Leaner, revision-focused platforms risk attracting users who prefer faster, less intensive preparation.

PrepLadder is a medical learning platform that really leans on strong faculty guidance and well-structured video lectures. Many students use it as their go-to resource for long-term exam preparation, thanks to its extensive question banks, tests, and performance tracking. At the same time, the platform can feel a bit overwhelming because of its dense content and linear learning paths, which makes it harder for those who are short on time or just want a quick revision. Overall, it’s best suited for disciplined learners who prefer a thorough, guided approach over speed or flexibility.

Overview

Prepladder

Strengths

strong confidence and trust due to expert-led, in-depth content, but only after investing significant time and effort.

Weakness

Dense information architecture and long learning paths increase cognitive load, causing fatigue and drop-offs for overwhelmed users.

Opportunity

Simplifying learning paths and improving personalization could make PrepLadder more accessible to diverse study styles.

Threat

Leaner, revision-focused platforms risk attracting users who prefer faster, less intensive preparation.

PrepLadder is a medical learning platform that really leans on strong faculty guidance and well-structured video lectures. Many students use it as their go-to resource for long-term exam preparation, thanks to its extensive question banks, tests, and performance tracking. At the same time, the platform can feel a bit overwhelming because of its dense content and linear learning paths, which makes it harder for those who are short on time or just want a quick revision. Overall, it’s best suited for disciplined learners who prefer a thorough, guided approach over speed or flexibility.

Overview

Prepladder

PrepLadder is a medical learning platform that really leans on strong faculty guidance and well-structured video lectures. Many students use it as their go-to resource for long-term exam preparation, thanks to its extensive question banks, tests, and performance tracking. At the same time, the platform can feel a bit overwhelming because of its dense content and linear learning paths, which makes it harder for those who are short on time or just want a quick revision. Overall, it’s best suited for disciplined learners who prefer a thorough, guided approach over speed or flexibility.

Overview

Prepladder

Strengths

strong confidence and trust due to expert-led, in-depth content, but only after investing significant time and effort.

Weakness

Dense information architecture and long learning paths increase cognitive load, causing fatigue and drop-offs for overwhelmed users.

Opportunity

Simplifying learning paths and improving personalization could make PrepLadder more accessible to diverse study styles.

Threat

Leaner, revision-focused platforms risk attracting users who prefer faster, less intensive preparation.

Strengths

Deep, clinically oriented content and a best-in-class Q-bank give users strong conceptual confidence and exam readiness.

Weakness

Extremely high content volume and long learning paths create cognitive overload and burnout risk for many users.

Opportunity

Smarter prioritization, adaptive learning paths, and lighter revision modes could make Marrow more approachable and sustainable.

Threat

Revision-first platforms with faster completion cycles may attract users closer to exam timelines.

Marrow is a platform designed for students who want to really master their subjects, offering in-depth lectures, extensive question banks, and a strong focus on clinical reasoning. It’s perfect for learners who enjoy diving deep and simulating real exam conditions, giving them confidence that they’re covering everything they need. At the same time, the sheer volume of content and long videos can feel exhausting, especially for those short on time or looking for quick revisions. In essence, Marrow works best for committed learners who are ready to invest time and effort for thorough preparation.

Overview

Marrow

Strengths

Deep, clinically oriented content and a best-in-class Q-bank give users strong conceptual confidence and exam readiness.

Weakness

Extremely high content volume and long learning paths create cognitive overload and burnout risk for many users.

Opportunity

Smarter prioritization, adaptive learning paths, and lighter revision modes could make Marrow more approachable and sustainable.

Threat

Revision-first platforms with faster completion cycles may attract users closer to exam timelines.

Marrow is a platform designed for students who want to really master their subjects, offering in-depth lectures, extensive question banks, and a strong focus on clinical reasoning. It’s perfect for learners who enjoy diving deep and simulating real exam conditions, giving them confidence that they’re covering everything they need. At the same time, the sheer volume of content and long videos can feel exhausting, especially for those short on time or looking for quick revisions. In essence, Marrow works best for committed learners who are ready to invest time and effort for thorough preparation.

Overview

Marrow

Marrow is a platform designed for students who want to really master their subjects, offering in-depth lectures, extensive question banks, and a strong focus on clinical reasoning. It’s perfect for learners who enjoy diving deep and simulating real exam conditions, giving them confidence that they’re covering everything they need. At the same time, the sheer volume of content and long videos can feel exhausting, especially for those short on time or looking for quick revisions. In essence, Marrow works best for committed learners who are ready to invest time and effort for thorough preparation.

Overview

Strengths

Deep, clinically oriented content and a best-in-class Q-bank give users strong conceptual confidence and exam readiness.

Weakness

Extremely high content volume and long learning paths create cognitive overload and burnout risk for many users.

Opportunity

Smarter prioritization, adaptive learning paths, and lighter revision modes could make Marrow more approachable and sustainable.

Threat

Revision-first platforms with faster completion cycles may attract users closer to exam timelines.

Marrow

Interview & Questionnaire

Interview & Questionnaire

Interview & Questionnaire

Reframe design question

Reframe design question

From the above findings that helped s to narrow down our problem statement. so we came up with our final design question:

We brainstormed and decided that we would change all the application esthetics using the same brand guidelines and Improve the layout of the tutorials section first. Then we decided to redesign the tablet version interface and website of DocTutorials.

We brainstormed and decided that we would change all the application esthetics using the same brand guidelines and Improve the layout of the tutorials section first. Then we decided to redesign the tablet version interface and website of DocTutorials.

Design Ideation

Design Ideation

Design Ideation

Design

Design

Design

Ideation wireframes

Ideation wireframes

Ideation wireframes

We were done with Ideation, understanding the user flows and structural hierarchy we now started to sketch the designs which were running in our mind and we came up with many designs and later on finalized which fits the user needs and goals.

Old design VS Final Design

Old Design

Old Design

Since this was a redesign of an existing product, designs were updated. However, I’ve included few screens I could retrieve to illustrate the starting point and focus the case study on my design process and outcomes.

Since this was a redesign of an existing product, designs were updated. However, I’ve included few screens I could retrieve to illustrate the starting point and focus the case study on my design process and outcomes.

Final Design

Final Design

We designed a user friendly interactions and made some cosmetic changes to all the flows. We designed two different homepages based on new and old users which is more interactive for new users to set there goals and customize their learning journey. existing users get a streamlined dashboard with quick access to their ongoing courses, performance insights, and personalized study recommendations. By adapting to student needs. the home page ensures a seamless, efficient and engaging experience, making learning more intuitive and goal-driven.

We designed a user friendly interactions and made some cosmetic changes to all the flows. We designed two different homepages based on new and old users which is more interactive for new users to set there goals and customize their learning journey. existing users get a streamlined dashboard with quick access to their ongoing courses, performance insights, and personalized study recommendations. By adapting to student needs. the home page ensures a seamless, efficient and engaging experience, making learning more intuitive and goal-driven.

We designed a user friendly interactions and made some cosmetic changes to all the flows. We designed two different homepages based on new and old users which is more interactive for new users to set there goals and customize their learning journey. existing users get a streamlined dashboard with quick access to their ongoing courses, performance insights, and personalized study recommendations. By adapting to student needs. the home page ensures a seamless, efficient and engaging experience, making learning more intuitive and goal-driven.

We sent out an online questionnaire to 50+ of our students who use our application on daily bases to seek education and we got around 48 responses from our participants. 62% of our participants have experienced difficulty in accessing the notes while watching tutorials and the notes visibility is not readable due to the timestamps played in tutorials. When we enquired about tests series and question bank in app, Users response was not satisfactory because of it’s boring Interaction, multiple unwanted buttons and Interface which doesn't even make the user stay on the screen for long.

We sent out an online questionnaire to 50+ of our students who use our application on daily bases to seek education and we got around 48 responses from our participants. 62% of our participants have experienced difficulty in accessing the notes while watching tutorials and the notes visibility is not readable due to the timestamps played in tutorials. When we enquired about tests series and question bank in app, Users response was not satisfactory because of it’s boring Interaction, multiple unwanted buttons and Interface which doesn't even make the user stay on the screen for long.

How might we improve the Interface and accessibility for students stay engaged without feeling distracted or bored?

Project Experience

DocTutorials was one of my works that Involved SWOT Analysis and deep research. This time I was not only comparing my competitors but also designed keeping the user first. In this we not only designed mobile application we also designed web versions and Tablet versions. keeping the Brand guidelines in mind we build some components to improve the esthetics and user friendly layouts.

Design oriented

Coordinating with the development team was satisfying as I was aware of what is being done nad how it was being Implemented. I was with two designer who were working on this project and there were some constraints where we needed to make some minor changes. Overall development team was good at what they do so we didn’t face any major issue but there was this QA Team who always raise tickets and development team was always set on fire. Overall I enjoyed this process.

Development oriented

Client oriented

Working with DocTutorials team was one of my best experiences. They were impressed by our deliverables and we continued to design the landing pages and marketing pages for their team. The best part is they gave us that opportunity to go design without more constraints. Our daily meetings with our client helped us to maintain the scope and deliver the project on time.

Create a free website with Framer, the website builder loved by startups, designers and agencies.