top of page
Blackboard UI
iLearn Web App
Project Overview
With the recent impact of COVID-19, students around the world are immersed into virtual learning environments.
​
​
The work here focuses around improving user experience to accommodate newer generations of users.
"It's clunky and ugly. Nobody uses the student tools. It looks like it was made in 2001." - Sandy
My Contributions
Through the design thinking process I redesign the UI, declutter unused features, and implement a new array of tools.
​
​
I use Qualtrics to gather data from participant surveys, and Figma to design and prototype.
How do the users feel about iLearn?
As a fellow student at UC Riverside, I understood the difficulty concerning Blackboard's iLearn. While it was usable and efficient, the interface was messy and outdated.
​
​
​
Many services were discontinued, but were still included on the frontend interface. What's an address book doing on a website? It didn't look like a competitive university.
What's the problem and what do students want?
Blackboard's Learn is a product that focuses on virtual learning environments, meaning that it focuses on maximizing student efficiency and productivity. As a result, the aesthetics of a well-designed UI is sacrificed for having the most amount of information at once.
How might we create a friendlier user-interface to improve user-experience, while maintaining its efficiency?
​
​
​
Methods
User Interviews
Surveys
Usability Testing
Research & User Insights
Through our user interviews and usability testing, I found users were having difficulty dealing with the UI of iLearn. The interface was unappealing and complicated to maneuver.
​
​
​
Too much too soon.
Newer users struggle to adjust to the website. In comparison, older users are indifferent because they have grown used to using iLearn.
Cluttering.
The front page had many redundant tools that many students didn't use. It overwhelmed the front page and slowed down multitasking.
​
​
​
Efficiency is incredibly important.
Students want all of the resources laid out at once so they can process information as fast as possible. They value efficiency over design aesthetic.s
What can I do to solve those problems?
I began to explore a variety of solutions by utilizing low-fidelity mockups and wireframes. My goal was to quickly generate ideas while meeting all of the user requirements.
How might I balance the elements of design with the usability of the product?
​
​
​
User Flow
I drew out the user flow to determine what could be simplified, and what was important for the usability. It allowed me to see the patterns in cluttering and redundancy throughout the functions on the website.
​
​
The new user flow was simpler and more compact, while keeping the usability intact. Most of the important student functions surrounding course management were kept and redesigned. The other repetitive and unused tools were removed.
​
​
By removing the cluttering that confused newer users, it provided a more appealing user experience. In addition, it's able to maintain its efficiency, since students are able to see the core categories that they use day-to-day.
​
​
​
Wireframing
Using the new user flow, I designed low-fidelity prototypes to solve the problems at hand. Key changes included revamping the front page, redesigning the UI, and adding new tools.
​
​
​
Prototype
To implement the change, I prototyped based on the wireframes and user flows that I previously designed. For this process I utilized Figma, a free-cloud based prototyping tool.
One of the prototypes included an innovative app-like interface that was different from most virtual learning environments. I further tested if users would like a new concept model.
​
​
​
First Iteration
Through the first iteration, we implemented a redesign of the UI, along with the addition of new elements such as grade calculators, calendars, and user profiles.
Users found a need for grade calculation, since university courses had weighted categories.
​
User Feedback
Based on some user feedback, I determined that the style is not fitting for a prestigious university. It was too inefficient and the concept was poorly-received.
​
As previously hypothesized, I received feedback that this model was too childish and inconvenient for university-based students. While the design could have been appealing for a different set of users, it took out a great deal of efficiency from having info laid out.
Through the next few iterations we were able to settle for a design with more information laid out on the dashboard. This catered to the desire for efficiency, while balancing a modern design.
​
We removed many of the unused features such as student tools, address books, and notepads. In replacement, we added visual agendas, activity sheets, and reminder apps. These were quality of life changes, and would be customizable by the user.
​
​
​
Iterating User Feedback
Testing
In order to test our changes, I conducted more user research to determine whether the changes were successful. I focused on efficiency, appearance, and usability.
Conclusion
Through this case study, I learned a variety concerns and successes on virtual learning environments. These factors are critical to determining what the future will have in store.
​
​
​
Success
Design as a Medium
There needs to be a balance between efficiency and good design principles to create a satisfying and indulging experience. To cater to those who value efficiency and those who appeal to appearance, we need to find a medium in between.
​
Design is not a one-sized fits all, it's a one-size fits most.
​
​
Improving the Education Experience
As an academic institution, much of the focus is on how well they can facilitate a student's ability to succeed. As a result, institutions need to cater to their needs and habits.
In a generation where students grow up with smartphones in their pockets, virtual learning environments need to keep up with the innovation of new technology.
Concerns
Traditional Users
One of the difficulties in redesigning a virtual learning environment is the dedicated user base. Older users prefer familiarity and this is correlated with their acceptance of the redesign. A sudden and rapid change will take users by surprise.
​
Changes should be implemented slowly and periodically.
​
Motion
In the near future, we can consider the implementation of motion. As a virtual learning environment, there is a heavy focus on efficiency and productivity. While it would improve user experience, it would slow down web-processing. Once premium web-hosting becomes more widely available, universities can consider implementing a wide array of motion.
​
​
bottom of page