Proposed Design Ideas

Below are the detailed proposed design ideas to make the learning experience better on website.

Problem 1- Misprioritized task while learning

Currently a lot of videos in Lynda point to online resources for reference and present shortened links for the users.

David doesn’t want to see and type the URL again on a separate browser as it distracts him from the current course. He would still want to save it for viewing in the future.

Solution: Interactive URL for reference

The user can now simply click on the button presented to them while the instructor is referencing a website during the course. This would enable the user to open the link on a new tab thus helping them bookmark at that instance for future reference. The video would be paused while this interaction happens such that the user does not loose out on information conveyed during the transition.

FAB to view links presented during the course

Problem 2- Full-screen mode not too informative thus requiring frequent exiting from the mode for information or to take notes

Samantha has to frequently keep shifting from full-screen mode to normal mode to view where she is, in the course. She also has wants to be able to see what’s the next chapter within context without breaking the flow of her learning.

Solution: Drawer menu along with the current chapter title on the header of the video. A re-designed video player bar which includes functionalities such viewing whats the next chapter and screenshot to save ppt slide presented along with annotation.

The menu and course video list is made available in the full-screen mode thus reducing the number of interruptions while completing the course. The user is also provided with a functionality to take notes within the context of the video/presentation, which is a cohesive way to ease the process of recording and revising the taught information.

The note-taking within the context of the presentation mimics the way in which students generally take notes of a lecture on the study material provided to them. This helps in adding relevant information to the slides such that the resulting document becomes a cheat-sheet for refreshing lessons learnt.

Full-screen layout re-design

The note taking action is triggered by the clicking or tapping on the screen shot button which would lead to adding notes in formats as supported by the viewing device. As touch screen laptop is becoming a thing of the past the tablet mode can be made accessible by those devices as well.

Note Taking and annotation (Tablet Mode)
Note Taking ( Desktop Mode)

I primarily tasked myself to tackle the above mentioned problems. A random set of guerrilla testing on the proposed screens were done a couple of elements were changed over the course of design. Further tests might be needed to validate the proposed design solutions.

Source link


Please enter your comment!
Please enter your name here